Add Alt and Title Tag to your Images AUTOMATICALLY

Add Alt and Title Tag to your Images AUTOMATICALLY

Hi Everyone !
I have been busy redesigning the Blog from past few days and So , Was unable to come up with a new post.
While redesigning , This came into my mind , That what if we AUTOMATE the addition of ALT and TITLE tags to our Images.

With this thought , I tried experimenting today and finally, After 2 hours of experimentation , I got what I wanted. So lets AUTOMATE THINGS UP and SAVE SOME TIME ;)

How this Works:

Actually , This is quite Simple. This Piece of code , Automatically makes the NAME OF THE IMAGE , Its TITLE and ALT TEXT , So , You Do not need to Add it manually or worry about forgetting it .

Tutorial:

Follow these Simple Steps to Add Alt and Title Tag to your Images AUTOMATICALLY

•  Goto Your Blogger Dashboard  >>
• Navigate to the Template option >>
• Create backup of your Template >>
• CLICK Edit Template >>
• Search for this code </body> by pressing CTRL + F >>
• Now paste the following code before the </body> tag >>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.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('title', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));$img.attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.'))); }); });//]]> </script>

CONGRATS !!! You just automated the Title and Alt tag for your Images