Question

我在我的网站上使用谷歌翻译按钮来更改语言。现在，当我点击按钮时，它显示的是每种语言。我想自定义它，就像它应该只显示下拉列表中的某些语言，并且应该有“更多”按钮，当点击更多时，它应该在下拉列表中显示所有语言。

我的代码

HTML

    <div id="google_translate_element5"></div>

   <script type="text/javascript">
     function googleTranslateElementInit() {
     new google.translate.TranslateElement({pageLanguage: 'en', layout: 
     google.translate.TranslateElement.InlineLayout.SIMPLE}, 
     ' google_translate_element5');
 }
</script>
<script src="https://translate.google.com/translate_a/element.js? 
cb=googleTranslateElementInit"></script>

CSS

.goog-te-gadget {
    font-family: Roboto, 'Open Sans', sans-serif!important;
    text-transform: uppercase;
    font-weight: 900 !important;
}
.goog-te-gadget-simple  {
    background-color: #ff0066 !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    border-radius: 1px !important;
    font-size: 1rem!important;
    display: inline-block;
    cursor: pointer;
    zoom: 1;
    margin-top: -2px;
    margin-left: 22px;
}
.goog-te-menu2 {
    max-width: 100%;
}
.goog-te-menu-value {
   color: #fff !important;
   font-weight: 900 !important;
   &:before {
      font-family: 'Material Icons';
      content: "\E927";
      margin-right: 16px;
      font-size: 2rem;
      vertical-align: -10px;
  } 
}
.goog-te-menu-value span:nth-child(5) {
   display:none;
}
.goog-te-menu-value span:nth-child(3) {
   border:none!important;
   font-family: 'Material Icons';
   &:after {
        font-family: 'Material Icons';
        content: "\E5C5";
        font-size: 1.5rem;
        vertical-align: -6px;
   }  
 }

 .goog-te-gadget-icon {
    display: none; 
 }


 .goog-te-banner-frame.skiptranslate {display: none!important;} 
  body {top: 0px!important;}

的JavaScript

我使用javascript来提供垂直对齐语言的风格

 function changeGoogleStyles() {
  if(($goog = $('.goog-te-menu-frame').contents().find('head')).length) {

  var stylesHtml = '<link rel="stylesheet" 
    href="https://clubs.bluesombrero.com/Portals/1809/
    googleTranslateMobile.css">';

  $goog.prepend(stylesHtml);
  } else {
    setTimeout(changeGoogleStyles, 50);
  }
}
changeGoogleStyles();

请帮帮我。

谢谢

在Google翻译按钮中自定义语言

0 个答案: