How To Add Page Translator In Blogger

How to add page translator in blogger

If your blog has become famous and popular and you see an increase in traffic from overseas then you must add a translator to your blog which lets visitors to translate your blog to their own language so that they could understand your post. Google provides you with a widget called Google translate. This widget has a very useful feature that it automatically detects language of different countries and translate blogs and websites pages automatically.
It supports more than 15 languages among which 12 are mostly spoken e.g English, French, German, Spanish, Italian, Dutch, Portuguese, Russian, Japanese, Korean, Arabic and Chinese. In this post I will tell how to add Google page translator to your blog and also how to add it above header as it is search on internet by many bloggers. 
If you wish to add it just in layout then follow below steps or scroll down if you want to add it above your blog header:

How to add a page translator in blogger layout:

(1). Go to blogger and log-in to your blogger account.

(2). Go to layout and click add a gadget.

(3). Select Translate which lies on fourth number.

(4). In this step choose the style of your page translator, there are three styles of translator see the preview of your page translator on configure page, select the desired style and click save.


How to add page translator in blogger

(5). Open your blog to see page translator.

How to add page translator above header:

You might have seen in websites that page translator floats on top-right of the website and looks very good. Many bloggers search for adding flags on top of the page to make their blogs look like a professional website. In this post I am sharing floating flags translator gadget which has 9 flags. Follow below steps to add page translator flags to your blog header as shown in below image:


How to add page translator in blogger

(1). Go to blogger and click Template.

(2). Click Edit html and on the Html page click anywhere in the template code.

(3). Use Ctrl+F on your keyboard and find </header>.

(4). Copy the below code, paste it below </header> tag and save template:


<div id='fk'><script src='http://100widgets.com/js_data.php?id=142' type='text/javascript'/></div>

(5). Now use Ctrl+F again and find ]]></b:skin> and paste the below code above it.

#fk {
float: right;
margin: -140px -5px;
overflow: hidden;

}

 If you don't find ]]></b:skin> then copy above code and go to Template click customize and select Advanced and go to last option(Add Css) and paste it in the Add css tab.

(6). Click apply to blog on top-right of page and you are done!

Note: Sometimes when this gadget is added to blogs the flags don't fit so adjust your blog width to avoid it, if you can't find a better width then set your blog width to 1090 and right bar width to 360.

I hope this post was helpful and you like it. Share it with others, follow and subscribe for latest news. 

Tags: translate blogger, page translator, web page translator gadget, blogger gadgets, How to add page translator in blogger, free blogger gadgets, page translator gadget for blogger, page translator flags on blog header.


EmoticonEmoticon