Forums (Obsolete)


Member	gliker-inorbital - 2/15/2011 3:31:18 PM Image caption Hi guys, Is there an easy way to add image caption? Thanks


Kentico Consulting	kentico_borisp - 2/16/2011 8:25:29 AM RE:Image caption Hello, The images are usually displayed via a transformation. If you are using one please modify it according to your needs. For more information about working with transformations please check our developer's guide. Best regards, Boris Pocatko


Member	gliker-inorbital - 2/16/2011 8:31:27 AM RE:Image caption Hi Boris, We were writing our comments at a same time :) You a right about transformations, but that would not work in this case. I'm talking about images added inside the content window using FCK editor and "insert image or media" window.

Member

gliker-inorbital - 2/16/2011 8:26:22 AM

RE:Image caption

Might be that image captions are not that popular with your clients :) so no replies yet.

I was thinking how we can add this feature into Kentico. I thought maybe we should make plugin for FCK but then again Kentico is tightly integrated with FCK and that might not work. Then I discovered small cheat and I thought I might share it with you. I hope this would help someone else looking for image caption in Kentico.

Basically, we can use jQuery and image title property to make caption. Image title is called "tooltip" in Kentico and it's located in advaced tab of "insert image or media" window. If you have alt text already defined then this tooltip is not that important so we can sacrifice it for our goal.

What I'm going to do is add text in tooltip box and then use short jQuery script to grab that info on page load, place it under the image inside the div and then wrap image and caption inside another div so we can position them nicely. You will also have to add some custom class to image. You can do that inside same advaced tab, so it's convenient.

Now, I have a question for Kentico team and I would be very thankful if you could help me. I would like to rename "tooltip" text to "caption" just to make it more logical for client. Also, I would like to add checkbox next to class textbox. When checked some custom class, let's say "captionThis" will be added to image so we will be able to enable and dissable tooltips and help client so they don't have to manually write class name. Can you suggest what would be easiest way to achieve this?

Thanks.

Kentico Consulting

kentico_borisp - 2/22/2011 2:41:49 PM

RE:Image caption

Hello,

To alter the mentioned dialog you need to change the code of the file <project location>\CMSModules\Content\Controls\Dialogs\Properties\HTMLMediaProperties.ascx. There you can insert a checkbox using the following code (this code can be inserted around line 192 where the class textbox is defined (txtImageAdvClass)):


<input type="checkbox" id="chkClass" onchange="var txtClass = jQuery('input[id$=txtImageAdvClass]');
                                    if (this.checked) { txtClass.val('myClass'); } 
                                    else { txtClass.val(''); }" />

For changing the label "Tooltip" to "Caption" just change the resource string "dialogs.advanced.tooltip".

Best regards,
Boris Pocatko


Member	gliker-inorbital - 2/22/2011 2:46:16 PM RE:Image caption Fantastic, thanks Boris!