Skip to content

Instantly share code, notes, and snippets.

@kn9
Created February 26, 2022 16:57
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save kn9/8d03e3c6631411653c5c46a1f3757312 to your computer and use it in GitHub Desktop.
Save kn9/8d03e3c6631411653c5c46a1f3757312 to your computer and use it in GitHub Desktop.
Custom Google Translate (Mobile-friendly) - customized to be mobile friendly without breaking google licensing
#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;
}
<div id="google-translate-container">
<div id="google_translate_element"></div>
</div>
/* 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");
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment