madeline-s
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;
}