How to Add Google Translator to Your Blogger Blog

Adding Google's website translator to your webpages increases your visitors since they can read your blog in their language. Adding the website translator is quick and easy.

There are two ways of adding Google Translator into Your Blog

1. Add translation to the entire webpage.
2. Add translation to a section of the webpage.

Lets talk about first option, you will have to add a code into your template and translator will be shown at each page. You can also decide the place you would like to show it.

Steps to add:

1. Login to you blogger account.
2. Design->Edit HTML(Don't Expand).
3. Search for </body> tag.
4. Now paste the code just above </body> tag.

<div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
  new google.translate.TranslateElement({
    pageLanguage: 'en'
  }, 'google_translate_element');
}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

Now the Second Option is just like adding a page element. Follow the steps below

1. Login to your blogger account and drive through the Design Tab.
2. Now Click on the add page elements and than select HTML/Java Script
3. Copy the Code below and paste inside that box.

<script>
function googleSectionalElementInit() {
  new google.translate.SectionalElement({
    sectionalNodeClassName: 'goog-trans-section',
    controlNodeClassName: 'goog-trans-control',
    background: '#ffffff'
  }, 'google_sectional_element');
}
</script>
<script src="//translate.google.com/translate_a/element.js?cb=googleSectionalElementInit&ug=section&hl=en"></script>

You can also customize how your translator looks (colour, background, languages etc.) by Google Translate Webpage