Javascript,Nodejs,MongodDB,WordPress,CSS,PHP

LightBlog

Tuesday, February 5, 2019

How to create website in multi language

In this tutorial we will learn how to make website in multi language,in this tutorial i will implement google translator API.

include this library before body close or you can also include it before close head tag.

<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

then write this function after including library

<script type="text/javascript">

function googleTranslateElementInit() {


  new google.translate.TranslateElement({pageLanguage: 'en',includedLanguages: 'en,hi',layout: google.translate.TranslateElement.InlineLayout.HORIZONTAL}, 'google_translate_element');


}

</script>

 <div id="google_translate_element"></div>
use this line where you want to show dropdown menu for language

pageLanguage: en this is default language 

includedLanguages: this is optional if you will provide any specific language it will show all language,and you can specify particular language i.e hi,fr etc

HORIZONTAL: here you can also pass SIMPLE for dropdown style

you can also style language dropdown here some styles are:

.goog-logo-link {
  display:none !important;


.goog-te-gadget{
  color: transparent !important;
}
.goog-te-banner-frame.skiptranslate {
  display: none !important;
  } 
body {
  top: 0px !important; 
  }
div#goog-gt-tt {
    padding: 10px 14px;
    display: none !important;

}

No comments:

Post a Comment