Add Scripting to the Footer Block
Go to Appearance => Theme Options, scroll down to Footer block and add the following code (or similar):
<script type="text/javascript">
// Google Translate Function (SIMPLE layout)
function googleTranslateElementInit() {
new google.translate.TranslateElement({pageLanguage: 'en', includedLanguages: 'en,es,fr,de,nl',
layout: google.translate.TranslateElement.InlineLayout.SIMPLE}, 'google_translate_element');
}
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit">
// Google Tranlate API Reference
</script>
This widget is coded with a simple inline style. The values in red above (en, es, fr, de, nl) represent the included languages when using the widget dropdown β these can be modified to suit your needs
Save and Publish the Changes to the Footer Block
Add the Google Translate Element to the Header Layout
Go to Appearance => Layouts => Header and add the following code to an HTML widget in the Header Layout:
<div id="google_translate_element"></div>
Save and Publish the changes to the Header Layout