Album Module: Help with Thickbox large image caption

[chilsta]

(I was recommended to repost this here from the Forge help forum...)

Hello,

I have used Album with Thickbox on http://salvagedoctor.com/cast-iron-radiators.html and it's working great- thanks for a great addition to CMSMS. One thing that I can't figure out is how to split the image's title and comment when they're displayed with the large image.

I can see the code that's displaying the caption:

"+caption+"

...in thickbox.js, but I can't find where caption is defined.

What I am trying to do is have something like
"+name+""+comment+"

rather than having the image name and comment displayed together as the caption.

Any help much appreciated.

C*

[Dr.CSS]

You will have to change the template not the JS, go to Content » Photo Albums click on the templates tab then click on the word 'Thickbox' to bring up the template and you will find the line near the bottom... I've added and hilited the spots....


{foreach from=$pictures item=picturesrow}
    {foreach from=$picturesrow item=onepicture}
    picture}" class="thickbox" title="{$onepicture->name} - {$onepicture->comment}"> thumbnail}" alt="{$onepicture->name} - {$onepicture->comment}" title="{$onepicture->name}B - {$onepicture->comment}" />
   

      {if ($onepicture->number==$picturenumber and !$picture)}{assign var=picture value=$onepicture}{/if}
    {/foreach}
{/foreach}

[chilsta]

Hi Mark

Thanks for your help, but that's the code that generates the thumbnail list output for the page- it's the caption that appears underneath the large image that I'm trying to change.

The HTML for the large image is generated by thickbox.js (lines 75 & 76), not the template.

Thanks,

C*

[Dr.CSS]

I test what I post... unless it's a CSS call for an IE hack, as I can't make it stick to see if it works...

First I put capitol letters in the place of the and and they showed up in the caption of the popup large image, on all of them, that leads me to believe this is the right place to put the formatting...

Actually I just noticed that I forgot to take the capitol B out of the second line before I posted it...

title="{$onepicture->name} - {$onepicture->comment}"> thumbnail}" alt="{$onepicture->name} - {$onepicture->comment}" title="{$onepicture->name}B - {$onepicture->comment}" />

[Russ]

For me at least , in album admin, title is the first bit and comment is the second bit?

Russ

[chilsta]

Wow!

Many apologies Mark- you're right indeed!

I now see where caption is defined that's used in thickbox.js- it's defined in the title of the href that's linking to the big picture.

That's some weird code, but it's certainly solved the problem in the browsers I've tested it in, although it understandably freaks out the W3C validator.

At least I now understand more of what's going on and will revisit this to see if I can come up with a method that validates when I get some time.


Russ- I'm trying to format the text that's displayed under the big picture once a thumbnail's clicked on. With the standard Thickbox, the title and comment are displayed together, I want to be able to format them separately.
(Edit- Just noticed I've only changed the link on the thumbnail, not the "View large version" text- you can see what I'm talking about if you try both links.)

You can see this working (still got some formatting to do) on http://salvagedoctor.com/cast-iron-radiators.html (4th image down on the right)

Cheers,

C*

[Russ]

Sorry chilsta, I see what you mean. Yes it is picked up from the title and I just formatted it in the template so it would be 'Title - Comment' You could of course change this but ThickBox reads the the href title for the text as you have surmised.

I guess you would have to alter the template to add the comments to some sort of fake element  that is web standard compatible (perhaps 'alt' would work in the href?? Not sure if it is compatible though) and then alter the thickbox js function TB_show(caption, url, imageGroup)  to take into account that new element?

Not an easy task, but I think the steps outlined above would help. You can then specify the class for style also in the thickbox.js and in your CSS.

Let me know how you get on, hope this helps, if not let me know.

Russ