|
|
|
WHY THIS SCRIPT?
I recommend you to read the following article - 3 Tips To Make Images SEO Friendly On Blogger. I guess you understood the importance of alt and title tags on your blog. I can assure you that this script will rank your blog better, than before, on search engines. What's little more interesting about this script is that, it'll add alt and title tags for all the images - be it the one that your going to post or the ones that already exist in your blog.
HOW IT WORKS?
The script just uses the name 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 "super-script.jpg" using post editor. You'll find the image URL as "http://1.bp.blogspot.com/....../super-script.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="super-script" and title="super-script". Isn't it cool? No more manual addition of tags! Just a proper name for the images and the script will do the rest!
Just keep these two things in your mind before you name an image.
1. Dont' use / or . character when you name your images.
2. Use a name that best explains the image for better SEO.
INSTALLING THE SCRIPT
1. Navigate to "Design >> Edit HTML" and make a backup of your template by clicking on the "Download full template" link at the top of the page. Once the back up is over, search for the following piece of code.
</body>
2. Download this text document - IMAGE SEO SCRIPT FOR BLOGGER and paste the code present in it just above the line mentioned in step 1.
3. Save your template. That's it! Very simple! Isn't it?
Note: Usage of above script is subject to copyrights. Do not make any changes to the above code. If you do so, it'll attract a violation of copyrights and you'll be filed under DMCA. For webmasters, you can modify the script provided you give a credit to this article. It's my kind request to you guys!
The above script is found to work on all major browsers - IE, Firefox, Opera, Safari and Chrome. WordPress users can follow the same instructions to get this script working on their blogs as well. I'll soon post another script that makes your external links open on a new tab with an automatic "nofollow" tag attached to it - just to ensure that your link juice isn't spread to other blogs. I suggest you to subscribe to my blog so that, you don't miss it! Share your opinions about the magic script via comments!
Enjoyed the article?
Click here to subscribe to FREE email updates from "Everything About Blogging", so that you do not miss out anything that can be valuable to you and your blog!
Hello Mukund,
REPLYa master article, i liked it so much, thanks for the script.
Thanks for this informative post mukund :)
REPLYThanks for the script Mukund. U have been a great help for my blog www.satisfyingreviews.blogspot.com. I will implement it tonight...
REPLYThanx for this great script. It will make work of newbies like me much easire. I will implement it as soon as possible
REPLY@Jeet Dholakia: Yup! Thanks buddy! I hope you enjoy the upcoming articles too!
REPLY@Nisarga: Thanks for your comment Nisarga! Just share this article via twitter or Fb so that it becomes informative to others as well!
REPLY@shan: Yes! It'll save a lot of time and you can spend more time on your content part rather than optimizing the images for SEO! Anyway, thanks for the comment Shan!
REPLYThanks for sharing the info Mukund, I'll try the script because adding alt and title tags to every image in a post is really hectic when done manually, but I think Blogger should consider adding an option to add title and alt tag to images like Wordpress does, as Blogger is redesigning every feature, this should really be taken into account.
REPLY@Sagar: Well, I do agree with what you said! I hope they consider it in the upcoming design. Nevertheless, the script will do the magic for you:) Anyway, thanks for the comment Sagar!
REPLYImplemented!
REPLY@Aditya Samitinjay: Yup! Enjoy the script and the upcoming articles too!
REPLYMukund do i need to add this script in the thesis theme or it is already image optimized. I m using the thesis theme that u gave.
REPLY@shan: Nope! It's not added! You need to add them separately!
REPLYVery Useful script,added to my blog
REPLYhttp://studentsidea.blogspot.com .
Again a wonderful release bro.
@TechGeeks: Yup! Thanks for the comment buddy! I'll soon release another one for anchor tags! Hope you like them as well!
REPLYYour article is a must read discussion. Brilliantly you've shared a very good idea to ponder regarding the title tag for images as the best SEO solution for bloggers. I'm grateful I came down for your page and acquire those information from you.
REPLY@SEO: Thanks for the brilliant comment buddy! I would be happy if you can share the article above with your friends so that, they'll get their images SEO optimized as well!
REPLYHi,
REPLYThanks for this cool information..
It would be awesome if this script change '-' to just ' ' (dash to space) automatically. :)
@Learn Everyone: This script is aimed at SEO buddy! Why do you want to change a "dash to space"??? Anyway, thanks for the comment!
REPLYHey, did you see your PR shows 2. As per as i know, your blog PR3. Am i right? Why this is showing??
REPLY@Rajib Kumar: Yes! There was an update that was made yesterday! So, you are seeing a decrease in PR. It'll vary before it settles at a final value!
REPLYhello thanks so so much for this script it's very usefull but i want some develope in this script i want to take alt tag from article title not from image name i think it's easy for you
REPLYthanks so much and i will be so glade to see your reply
and thanks for this awesome blog
@Anonymous: Yup! That's pretty easy! Just ping me via gtalk and I'll send you the code for the same! Thanks for the comment buddy! Try to share the same with your niche bloggers:)
REPLYHi Mukund, A lot of thanks for this. I will implement on my blog
REPLY@Malayalamkutty: Yup! Thanks for the comment buddy! I hope you enjoy the other articles on my blog as well!
REPLYThanks anyways for the tips, this improves productivity.
REPLY@Niño: Yup! Thanks for the comment! I hope you enjoy the upcoming articles on my blog:)
REPLYThanks for the post...
REPLY@Himanshu Raut: Yup! You'll soon find a seo script based on links on SML! Hope you enjoy that article as well!
REPLYgreat tip thanks :D
REPLYi have used it on my blog
http://cargoogler.blogspot.com
@mimo: Yup! Thanks for the comment buddy! I hope you enjoy the other articles on my blog as well!
REPLYHi Mukund,
REPLYThis is a good article, and very helpful. But just one thing, after pasting and configuring the code for my site, I notice that it jammed my feature slider up and stopped it from flowing. Then when I scrolled down to the bottom of my homepage I could see the javascript text itself show through to the homepage. After realizing that I already have JQuery installed on the site for the slider, I removed the first line of your code and that fixed it. You might want to mention that in your article. I know you do on your other JQuery coding articles. Very nice though. Thanks.
@Kev: Well, you are right! I just forgot to mention that in this article! I'll update the article in a while! Thanks for pointing out the mistake and for the comment as well:)
REPLYHello Mukund,
REPLYThanks u for this code. i have ask for u.
Your code : Alt="file-name"
Can you help me change Alt="post-title" ???
My file name very bad(76%*%&$(#&$)
Thanks you very much.
@Love and Sex: Well, you had emailed me about the same issue I guess! I sent a reply to the same! So, please do check out the same! I'll hope I get the code as per your requirements! Anyway, thanks for the comment!
REPLY@Mukund
REPLYThanks you !
I'm waiting for you.
Hi.
REPLYFirst I need to say you doing really good job here. Thanks for that.
Second thing is problem with this script. I did everything what you wrote above but I don't see any changes. I mean, no alt and title tags in my image codes.
@nobord3r: Well, I see the script working. Just view the page source of your blog and you'll find the title tag and alt tags embedded in it. I can send you a screen shot of your blog with the script working provided you let me know your email address. Anyway, thanks for the comment buddy!
REPLYAwesome blog. I am trying to use in own blog. Thanks for giving a best solution for.
REPLY@SEO Company: Well, thanks for the comment buddy! I hope you enjoy the other articles on my blog as well!
REPLYI used this method and images showing Alt tag correctly in the page. But I don't think googlebot can read these alt tags. In google webmaster I checked the googlebot code and found that no Alt tag is coming in the code which googlebot fetches from the site.
REPLYProbably googlebot is indexing the html code before rendering of the javascript code. Any Idea?
After implementing this code the alt tag is coming in the page and if I use firebug to view the source it is showing in the code but when I view source directly in the firefox I can't see any title or alt tag. So googlebot can't see title and alt tag also because it reads code before rendering of the javascript. So in my opinion it will not help to improve SEO.
REPLY@Piyal Kundu: Probably, you are right! But I did read some where that Google will index those contents that are dynamically generated as well! So, I'm not sure about the same! However, I recommend you to check out the article on Shoutmeloud about a similar script that makes your external links open in a new window (along with addition og nofollow tag) which should definitely reduce the bounce rate and improve your SEO to some extent.
REPLYi think this script will be more powerfull if you can add an additional keyword on it, i.e : not just alt="super-script" but alt="super-script-with-my-additional-keyword"
REPLYi just hit the Rss Feed for this article comment. looking forward to hear your reply soon.
btw, thanks a lot for the script :)
@Funny Baby: Well, I'm afraid! That's not possible! We don't have options to add keywords like WP blogs do! So, this shall be the max that we can achieve on blogger - generate tags dynamically. Ping me on gtalk and I'll explain you if you want to:) By the way, thanks for your comment!
REPLY@Mukund well, im impressed how quick you reply my comment, i mean add the keyword what we want, straight in the script, i think it is possible
REPLY@Funny Baby: Well, just get me the idea about inserting such keywords of our choice! Probably I'll be able to think of some code to add them:)
REPLYahh, i have big zero knowledge doing on script or another geeky techy guy things. :)
REPLYbut, i can see the main string on
$img.attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));
the idea is, add a keyword before the '.' <- full stop or after the '/' <- slash... @Mukund what do you think?
@Funny Baby: The idea behind the script is to encounter the words/characters between the last '/' symbol and the last '.' symbol defined in the src value as the keyword! Hope you understood what I meant:)
REPLYyes, i am completely understand sir.. i just wonder with your great script and the idea behind it.
REPLYI have added following code to my blogger blog awesome article.
REPLYThanks
This has some problem, if I upload a image "Speak To Search Widget Blogspot" the auto "alt" and "title" tags appear with a "+" symbol like "Speak+To+Search+Widget+Blogspot" can u fix it??? Demo: http://www.paulsantosh.com/2011/09/speak-to-search-widget-for-blogspot.html
REPLYhow to check alt tag added in image?
REPLYunique article
REPLYhey .i m very thankful for this amazing tip....I have added code to my blog,its an awesome article.
REPLYThank you very much ,
Is there a way for this to work only in the images with no alt tags?
REPLYThanks for all of your work on this web page. I am looking forward to reading more of your posts in the future.
REPLYThanks very much for the script. I've just implemented it on my blog lifeinanothertown.blogspot.com
REPLYWhat I then realised was the flickr images I share with my blog in a thumbnail array don't use the image file name, they use the imageid that flickr assigns.
I hadn't noticed this until I implemented your script. So, now I will add a single photo to each post which will include the file name and then show up on the alt tag.
Great tip. Thanks
hi plz add automatic meta tag generation script for blogger posts
REPLYThank You.. I've try this trick for my blog.
REPLYOMG! This is what I'm looking for because I am so tired of editing HTML everytime I made some post and need to add the alt tag. I tried it and its really working. When I hover my mouse, the alt tag is appearing. Thank you so much for this great creation.
REPLYThanks very much for the script.
REPLYFascinating article and one which should be writer widely illustrious some in my content. Your direct of fact is smashing and the clearness of activity is superior.
REPLYNational Power Supply Engines
Use the tab below to comment. No spam please!!!
POST YOUR COMMENT