Posted by animelion on April 15, 2011 at 4:07am
3 followers
Jump to:
| Project: | Image Caption |
| Version: | 7.x-1.0-beta3 |
| Component: | Code |
| Category: | feature request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | active |
Issue Summary
Since Google doesn't give two shits about image TITLE tags, I've removed that option from my content create form. They do however look at the image ALT tag.
I tweaked the JS to support outputting both ALT and TITLE captions. By outputting both and with a little CSS styling you could make your captions looks like this.
http://awesomescreenshot.com/06dbeel6a
I've never created a patch before, but below is my tweaked image_caption.js and image_caption.min.js. I'll also throw in my CSS as well.
image_caption.js
http://pastebin.com/CFRdMiZn
image_caption.min.js
http://pastebin.com/VMwGxSyv
style-captions.css
http://pastebin.com/B3TyZHis
Comments
#1
Yes, I may actually change the js so it prefers the title, but uses the alt text if the title isn't set, but I'm not keen on using both.
cheers,
DT
#2
Not a fan of using both either, the fall back is a great idea. Everyone has their own way of setting up their site and the default will probably cover 90% of this modules users, but having these options I'm sure will prevent future issue que request. Not sure if this could be an option on a settings page.
Maybe something like:
Use Title as caption
Use Alt as caption
Use Title as caption with Alt as fall back
Use Alt as caption with Title as fall back
Use Title and Alt as caption
#3
That's too many options and overkill, users can put the caption they want in the title or alt text, or both.
#4
Here are the changes I made pulled out so folks can see what's happening and can make the necessary changes against future versions of this module.
Adds support for alt Captioning (image_caption.js)
Once changed the js file needs to be minimized and replace (image_caption.min.js)
- var captiontext = $(this).attr('title');
+ var captiontitletext = $(this).attr('title');
+ // Get caption from alt attribute
+ var captionalttext = $(this).attr('alt');
- // Append caption
- $(this).parent().append("<span style=\"display:block;\" class=\"image-caption\">" + captiontext + "</span>");
+ // Append caption
+ $(this).parent().append(
+ "<span style=\"display:block;\" class=\"image-caption\">" +
+ "<span style=\"display:block;\" class=\"image-title-caption\">" + captiontitletext + "</span>" +
+ "<span style=\"display:block;\" class=\"image-alt-caption\">" + captionalttext + "</span>" +
+ "</span>"
+ );
#5
If the goal is to only use one attribute (either the alt or title tag), I would recommend using the 'alt' tag to generate caption text, it's and all around better strategy for SEO. Image titles are supposed to be short and concise, whereas the alt tag is generally the place to put longer descriptive text (such as the text synonymous with captions).
I am a fan of this module, it provides great functionality in a very simple, clean way. I have written a patch in my own installation for this module to use the 'alt' text rather than the title text for SEO purposes. But I would like very much to stay on the same path with the current development of this module.