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!
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!
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.
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:
…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?
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;
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.
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.
Good question, and I am one to occasionally forget to do the obvious!
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.
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
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.
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.
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