Is there a configuration or method for including a 'caption' on the thumbnail (similar to how the filename is used as a caption on the expanded image)?
Great Product!
Thank you!
-
MisterNeutron
- Posts: 440
- Joined: Sun Aug 18, 2013 11:20 am
Re: Putting a Caption on Thumbnails in Gallery
Highslide JS is involved only in the display of the expanded image. Putting captions under thumbnails is just a simple, regular HTML/CSS exercise - the Highslide script has no role to play in the thumbnail display at all. So, that's really not within the scope of this forum.
Re: Putting a Caption on Thumbnails in Gallery
Thank you for the reply and I can certainly appreciate that I might have navigated into the wrong area (but, to be honest, the Highslide.css file is in the same folder as the Highslide.js file - so I assumed that this might be the place to ask questions for both).
Any hints or tips as to where the forum is regarding a question for the Highslide.css file?
Thank you in advance for your help!
Any hints or tips as to where the forum is regarding a question for the Highslide.css file?
Thank you in advance for your help!
-
MisterNeutron
- Posts: 440
- Joined: Sun Aug 18, 2013 11:20 am
Re: Putting a Caption on Thumbnails in Gallery
You're not quite getting the point. The highslide.css file is almost entirely dedicated to styling the enlarged images. There is a skeletal highslide-gallery class in there, but that's just to provide a minimal thumbnail display to support the bare-bones examples. It's not really part of the Highslide JS package.
The Highslide JS script doesn't produce the thumbnail table. The assumption is that anyone using the script will be creating his own thumbnail table, with its own styling, captions, and so on.
If this is beyond your skill level, you might be better off using an application that produces this for you. Take a look at some of the sample albums on this page: http://jgromit.com/matrix/. They all use Highslide JS to display the enlarged images, but the thumbnail page is produced by a skin for the jAlbum application. The Maps & Metadata album, for example, shows captions under the thumbnails - the Beveled Thumbs album shows them to the right of the thumbnails. These albums are all produced by the application - no manual coding required.
The Highslide JS script doesn't produce the thumbnail table. The assumption is that anyone using the script will be creating his own thumbnail table, with its own styling, captions, and so on.
If this is beyond your skill level, you might be better off using an application that produces this for you. Take a look at some of the sample albums on this page: http://jgromit.com/matrix/. They all use Highslide JS to display the enlarged images, but the thumbnail page is produced by a skin for the jAlbum application. The Maps & Metadata album, for example, shows captions under the thumbnails - the Beveled Thumbs album shows them to the right of the thumbnails. These albums are all produced by the application - no manual coding required.
-
MisterNeutron
- Posts: 440
- Joined: Sun Aug 18, 2013 11:20 am
Re: Putting a Caption on Thumbnails in Gallery
If you want to create your own thumbnail table, there are multiple ways of doing so. Here are a couple of demo pages that demonstrate three of the most common ways:
WIthout captions: http://misterneutron.com/thumbsDemo/
With captions: http://misterneutron.com/thumbsDemoCaps/
The page source code illustrates how it's done in each case. There is some CSS in the <head> section to make things work, with comments to indicate which method the classes apply to. In the real world, you'd want to put the CSS into its own file, for easier maintenance.
Of the three methods, I prefer the inline-block technique, since it automatically centers the last row, even if it contains an odd number of items.
These examples don't have the Highslide JS markup, of course - that's because the setup of the thumbnail page has almost nothing to do with Highslide JS. There are just dummy href's in there - you'd be providing the usual Highslide markup, with the href pointing to the full-sized image, with a "highslide" class, with an onclick that invokes the Highslide JS script, and so on.
WIthout captions: http://misterneutron.com/thumbsDemo/
With captions: http://misterneutron.com/thumbsDemoCaps/
The page source code illustrates how it's done in each case. There is some CSS in the <head> section to make things work, with comments to indicate which method the classes apply to. In the real world, you'd want to put the CSS into its own file, for easier maintenance.
Of the three methods, I prefer the inline-block technique, since it automatically centers the last row, even if it contains an odd number of items.
These examples don't have the Highslide JS markup, of course - that's because the setup of the thumbnail page has almost nothing to do with Highslide JS. There are just dummy href's in there - you'd be providing the usual Highslide markup, with the href pointing to the full-sized image, with a "highslide" class, with an onclick that invokes the Highslide JS script, and so on.
Re: Putting a Caption on Thumbnails in Gallery
Fantastic! Thank you so much for going 'above and beyond' to help me out. I know it was out of the scope of this forum, and it is much appreciated.
All the best!
Kirk
All the best!
Kirk