Add fashionable google translator widget inward your blogger

Sometimes about users desire to translate current page alongside his/her ain language. Then he/she find
the interpret selection for interpret electrical flow page. I oft detect websites that install widgets interpret the means of a row of flags of diverse countries which serves to interpret a page to a detail linguistic communication as well as inward blogger itself already has a default widget Google Translate alongside the same business office alongside iii dissimilar styles namely Vertical Horizontal as well as Drop Down.

Well this fourth dimension I volition part this alongside Google Translate widget dissimilar styles that yous tin laissez passer on notice plug inward the sidebar or footer blog. Here's how the application: Open your Blogger> Layout > Then click on the Add Gadget > Click the HTML / JavaScript > Copy as well as apply all of the code below inward it> Save widgets.

 <style type="text/css"> #translator-wrapper {   display:block;   width:90%;   max-width:300px;     border:none;     background-color:#fff;   color:#444;   overflow:hidden;   position:relative;   height:40px;   line-height:40px;   border:1px venture #e0e0e0; } #translator-wrapper guide {   border:none;   background:transparent;   font-family:'Verdana',Arial,Sans-Serif;   font-size:12px;   width:100%;   color:#444;   -webkit-box-sizing:border-box;   -moz-box-sizing:border-box;   box-sizing:border-box;   -webkit-appearance:none;   cursor:text;   padding:5px 10px; } #translator-wrapper a, #translator-wrapper a:hover {   display:block;   background-color:#4791d2;   border:none;   color:#fff;   margin:0 0;   text-decoration:none;   position:absolute;   top:0;   right:0;   bottom:0;   cursor:pointer;   width:14%;    transition:all 0.3s ease;   } #translator-wrapper a:before {   content:"";   display:block;   width:0;   height:0;   border:6px venture transparent;   border-left-color:white;   position:absolute;   top:50%;   left:45%;   margin-top:-5px; } #translator-wrapper a:hover {opacity:0.9;} #translator-wrapper a:active {opacity:0.9;} #translator-wrapper select:focus, #translator-wrapper a:focus, #translator-wrapper select:active, #translator-wrapper a:active {   border:none;   outline:none;   cursor:pointer; } selection {   background:#444;   color:#e0e0e0; } </style> <div id="translator-wrapper">     <select id="translate-language">         <option value="en" selected="selected">English</option>         <option value="id">Indonesian</option>         <option value="af">Afrikaans</option>         <option value="sq">Albanian</option>         <option value="ar">Arabic</option>         <option value="hy">Armenian</option>         <option value="az">Azerbaijani</option>         <option value="eu">Basque</option>         <option value="be">Belarusian</option>         <option value="bn">Bengali</option>         <option value="bg">Bulgarian</option>         <option value="ca">Catalan</option>         <option value="zh-CN">Chinese</option>         <option value="hr">Croatian</option>         <option value="cs">Czech</option>         <option value="da">Danish</option>         <option value="nl">Dutch</option>         <option value="en">English</option>         <option value="eo">Esperanto</option>         <option value="et">Estonian</option>         <option value="tl">Filipino</option>         <option value="fi">Finnish</option>         <option value="fr">French</option>         <option value="gl">Galician</option>         <option value="ka">Georgian</option>         <option value="de">German</option>         <option value="el">Greek</option>         <option value="gu">Gujarati</option>         <option value="ht">Haitian Creole</option>         <option value="iw">Hebrew</option>         <option value="hi">Hindi</option>         <option value="hu">Hungarian</option>         <option value="is">Icelandic</option>         <option value="id">Indonesian</option>         <option value="ga">Irish</option>         <option value="it">Italian</option>         <option value="ja">Japanese</option>         <option value="kn">Kannada</option>         <option value="ko">Korean</option>         <option value="la">Latin</option>         <option value="lv">Latvian</option>         <option value="lt">Lithuanian</option>         <option value="mk">Macedonian</option>         <option value="ms">Malay</option>         <option value="mt">Maltese</option>         <option value="no">Norwegian</option>         <option value="fa">Persian</option>         <option value="pl">Polish</option>         <option value="pt">Portuguese</option>         <option value="ro">Romanian</option>         <option value="ru">Russian</option>         <option value="sr">Serbian</option>         <option value="sk">Slovak</option>         <option value="sl">Slovenian</option>         <option value="es">Spanish</option>         <option value="sw">Swahili</option>         <option value="sv">Swedish</option>         <option value="ta">Tamil</option>         <option value="te">Telugu</option>         <option value="th">Thai</option>         <option value="tr">Turkish</option>         <option value="uk">Ukrainian</option>         <option value="ur">Urdu</option>         <option value="vi">Vietnamese</option>         <option value="cy">Welsh</option>         <option value="yi">Yiddish</option>     </select><a id="translate-me" href="#" title=Add fashionable google translator widget inward your blogger></a> </div> <script type="text/javascript"> (function() {     var mylang = "id", // Your website linguistic communication         anchor = document.getElementById('translate-me');     anchor.onclick = function() {         window.open('http://translate.google.com/translate?u=' + encodeURIComponent(location.href) + '&langpair=' + mylang + '%7C' + document.getElementById('translate-language').value + '&hl=en');         furnish false;     }; })(); </script>