Showcase caption font size

Showcase is great, but I’ve got some captions on my popups that are just the wrong length and are giving me some unsightly wrapping. Is there a way to reduce the font size? I’m happy to edit a .js file or whatever, but just don’t know where to look. Thanks!

Derek


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Perhaps not :frowning:


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi Derek,

I asked a similar question a bit back and didn’t get an answer either. I reasoned ‘not’ also :frowning:

s


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

There is always a way.

There is a fwshowcase.css file generated by the action


#item1 ul.fwShowcase_thumbs .fwShowcase_caption {
    display: block;
    position: absolute;
    bottom: 10px;
    width: 120px;
    height: 40px;
    margin: 0;
    text-align: center;
    font-size: 12px;
    color: #000;
    overflow: hidden;
    cursor: pointer;
}

This is the part of that styles the caption. Note that #item1 refers to the Div name that contains the showcase on your FW page.

So to change the size of the caption text - and any other attributes - copy/paste this into the before end head section of Page>HTML markup.

So if I wanted to change to 14px font-size I would use the following

<style type="text/css">
    #item1 ul.fwShowcase_thumbs .fwShowcase_caption {
    display: block;
    position: absolute;
    bottom: 10px;
    width: 120px;
    height: 40px;
    margin: 0;
    text-align: center;
    font-size: 14px;
    color: #000;
    overflow: hidden;
    cursor: pointer;
}
</style>

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi S

I think I’ve figured it out. Via the Safari Web Inspector I was able to find out the source of the styling, which is a css doc stored in the same place as the page’s html file.

All you need to do is oopen the css doc in TextWrangler or similar, and change the font size, color or other property in question. It’s really quite easy.

Then save copies of the css files and upload them manually to the server.

I see Dave has leapt in while I wrote this. Thanks, Dave!


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

If you do it that way Derek then you have to do that every time that you make changes to your FW page.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Now how did you know what my next question would be? I just tried the Upload Extra Resources action and found that it didn’t overwrite the FW-generated equivalents.

Markup…it’s genius! Cheers.

Derek


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Not having much luck with this. Manually uploading the modified css files does the trick, but I haven’t been able to get the markup working. I wonder if it’s properly written:

#paintings2007Gallery .fwShowcase_title { position: absolute; etc… }

…where “paintings2009Gallery” is the Showcase div in my FW doc.

Also, there is some weird vertical alignment going on with the title div (the caption on the popup images). If I increase the font size in Safari, the caption text grows upwards and eventually seems to disappear behind the popup. Likewise, if the caption is longer and goes to two lines, the first line moves up to make room for the second. It’s as if there were a line, say 40px below the image, that the text were not allowed to go below.

This seems odd to me. By default the text should flow downwards like text normally does, otherwise it’s very tricky designing for captions of different lengths. Is there perhaps a way around this?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Without seeing your example it is very difficult to diagnose - is it online?

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Remember that by its very nature CSS styles cascade so rather than trying to change the Showcase CSS file itself (Freeway will fight with you and overwrite your changes every time it publishes) simply add a block of markup to each of your gallery pages and overwrite the initial caption values with your own.
For example go to the Page/ HTML Markup menu and then paste in your updated CSS styles in the “before end head” slot;

ul.fwShowcase_thumbs .fwShowcase_caption {
   font-size: 14px;
   color: #ffcccc;
}

Regards,
Tim.

On 14 Dec 2010, at 23:33, derekzinger wrote:

Now how did you know what my next question would be? I just tried the Upload Extra Resources action and found that it didn’t overwrite the FW-generated equivalents.

FreewayActions.com - Freeware and commercial actions for Freeway Express & Pro.

Protect your mailto links from being harvested by spambots with Anti Spam.
Only available at FreewayActions.com

http://www.freewayactions.com


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks Dave and Tim,

I was just trying out the updated Freeway and Showcase. Thought showcase might have been more fully formed and I was missing something.
Hopefully showcase will be improved upon in future releases.

s


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Tim, if I’m not mistaken, your code modifies the captions on the thumbnails. I think the style affecting the popup captions is .fwShowcase_title.

Dave, the page is part of an online artist’s portfolio.

http://web.me.com/flyvebaad/test/floor/portfolio.html

There is a carousel on this page; I’m working specifically on tab 6 right now.

Tim and Dave, I really appreciate your help and kindness.

Derek


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

It’s as if there were a line, say 40px below the image, that the text were not allowed to go below.

Have you tried this same gallery outwith a carousel pane? Does it still behave the same?

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Yeah, just tried, and got the same thing. Very odd.

What would cause text to behave like this? It sounds like bottom alignment, but I can’t find any reference to it in the css styles.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I am a showcase novice Derek but I must ask an obvious question.

Have you tried adjusting the caption height in the showcase inspector action palette?

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Good question, and I am one to occasionally forget to do the obvious! :wink:

But yes, I have tried it. What it appears to do is expand the height of the div that contains the caption. This does allow for a certain amount of adjusting, but the upward flow is still there. I can increase the caption height to make room for a nice-looking 2-line caption, but then my one-line captions end up being a little to far below the image. Does that make sense?

All of this would be solved with a standard downward text flow.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi,
Could someone please tell me how I can style the both the thumbnail and the image captions for the Showcase gallery?
I have looked at this thread to no avail:
http://freewaytalk.net/thread/view/81948#m_81993

Any help would be appreciated.

Richard


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi Richard

To change the image caption, you need to modify the css stylesheet that corresponds to your gallery div. Freeway generates this automatically and places it in the same folder as the page’s html file. It will contain a style called .fwShowcase_title. By modifying it, you can style font family, style, color, etc.

Others can tell you the best way to go about doing this. What I’ve done is to make the changes I want and resave the css doc. The downside is that I need to upload this doc manually everytime I upload the site. I think there is a better way to do this via markup, but I’m not totally sure how to go about it.

Hope that helps a bit.

Derek


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks Derek,
I’ll give it a try. It’s a shame though that Softpress didn’t put the option in to change the font size in the action. I did see the the the comments from Dave and Tim to paste into the “before end head” section of Page>HTML markup. But what is “before end head”? The only options I see are:

Before and

Before

I tried both of these with Tim’s suggestion but nothing changed.

Richard


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

“Before end head” = Before .

I think I could probably figure out the markup way of doing this, but right now it’s low on my priority list. I tried to do this before for something more complicated and couldn’t get it to work, but this seems pretty straightforward.

Actually, after reviewing Dave’s post above, that seems to be what you would need to do. Just change the attributes in question and add as markup and you should be good to go :slight_smile:


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options