madelinelise
1/11/2017 - 8:14 PM

Custom Google Translate (Mobile-friendly) - customized to be mobile friendly without breaking google licensing

Custom Google Translate (Mobile-friendly)

  • customized to be mobile friendly without breaking google licensing
/* Google Translate */
function googleTranslateElementInit() {
  new google.translate.TranslateElement({ pageLanguage: "en" }, "google_translate_element");
    // begin accessibility compliance
    $('img.goog-te-gadget-icon').attr('alt','Google Translate');
    $('div#goog-gt-tt div.logo img').attr('alt','translate');
    $('div#goog-gt-tt .original-text').css('text-align','left');
    $('.goog-te-gadget-simple .goog-te-menu-value span').css('color','#000000');
}
$(function() {
  $.getScript("//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit");
});
<div id="google-translate-container">
 <div id="google_translate_element"></div>
</div>
#google-translate-container {
  float: right;
  padding: 3px 5px 0px 0px;
}

.goog-te-combo,
.goog-te-banner *,
.goog-te-ftab *,
.goog-te-menu *,
.goog-te-menu2 *,
.goog-te-balloon * {
  font-family: arial;
  font-size: 10pt;
  background-image: url("/Style%20Library/VCS-Assets/imgs/google-translate-icon-small.png");
  background-repeat: no-repeat;
  text-indent: 20px;
  background-color: #fff;
  color: #000 !important;
}

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

.goog-te-gadget {
  color: transparent !important;
}

.goog-te-gadget .goog-te-combo {
  margin: 2px 0 !important;
}