This script uses the of your image to auto generate the "alt" and "title" tags. In other words, the name of your image stands as the text for your alt and title tag. It picks up the next character after the last instance of "/" from the image URL as the starting letter of your alt or title tag. The ending character will be recognized using the last instance of "." from your image URL.
For example, you upload an image "image.jpg" using post editor. You'll find the image URL as "http://1.bp.blogspot.com/....../image.jpg". When you publish the article and go check out the source code of the same (source code of the image), you'll find the following tags in it - alt="image" and title="image".
Steps to install the script:
Before doing this backup your full template.
1. Open you blogger dashboard and navigate to "Design >> "Edit HTML" (Template >> Edit Html in Blogger's new look)
2. Search for </body> tag
3. Paste the below code just above the </body> tag.
|
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'> //<![CDATA[ $(document).ready(function() { $('img').each(function(){ var $img = $(this); var filename = $img.attr('src') $img.attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.'))); }); }); //]]> </script> <script type='text/javascript'> //<![CDATA[ $(document).ready(function() { $('img').each(function(){ var $img = $(this); var filename = $img.attr('src') $img.attr('title', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.'))); }); }); //]]> </script> |
4. Save your template. That's it.
0 comments
Post a Comment