利用谷歌翻译在网站上添加一键翻译多语言  ,直接上代码 

 
 <script src="https://translate.google.cn/translate_a/element.js?cb=googleTranslateElementInit"></script>



<script type="text/javascript">
    function googleTranslateElementInit() {
        new google.translate.TranslateElement({
            //因为pageLanguage: 'zh-CN'这个参数就是用来指定当前页面的初始语言，一开始就是英文页面那当然是en
           // pageLanguage: 'zh-CN',
            //这个是你需要翻译的语言，比如你只需要翻译成越南和英语，这里就只写en,vi
      includedLanguages: 'en,zh-CN,hr,cs,da,nl,fr,de,el,iw,hu,ga,it,ja,ko,pt,ro,ru,sr,es,th,vi',
            //选择语言的样式，这个是面板，还有下拉框的样式，具体的记不到了，找不到api~~
      layout: google.translate.TranslateElement.InlineLayout.SIMPLE,
            //自动显示翻译横幅，就是翻译后顶部出现的那个，有点丑，这个属性没有用的话，请看文章底部的其他方法
      autoDisplay: true, 
      //还有些其他参数，由于原插件不再维护，找不到详细api了，将就了，实在不行直接上dom操作
        }, 'google_translate_element');
    }
</script>
 
<script type="text/javascript">
    (function () {
        var gtConstEvalStartTime = new Date();
 
        function d(b) {
            var a = document.getElementsByTagName("head")[0];
            a || (a = document.body.parentNode.appendChild(document.createElement("head")));
            a.appendChild(b)
        }
 
        function _loadJs(b) {
            var a = document.createElement("script");
            a.type = "text/javascript";
            a.charset = "UTF-8";
            a.src = b;
            d(a)
        }
 
        function _loadCss(b) {
            var a = document.createElement("link");
            a.type = "text/css";
            a.rel = "stylesheet";
            a.charset = "UTF-8";
            a.href = b;
            d(a)
        }
 
        function _isNS(b) {
            b = b.split(".");
            for (var a = window, c = 0; c < b.length; ++c) if (!(a = a[b[c]])) return !1;
            return !0
        }
 
        function _setupNS(b) {
            b = b.split(".");
            for (var a = window, c = 0; c < b.length; ++c) a.hasOwnProperty ? a.hasOwnProperty(b[c]) ? a = a[b[c]] : a = a[b[c]] = {} : a = a[b[c]] || (a[b[c]] = {});
            return a
        }
 
        window.addEventListener && "undefined" == typeof document.readyState && window.addEventListener("DOMContentLoaded", function () {
            document.readyState = "complete"
        }, !1);
        if (_isNS('google.translate.Element')) {
            return
        }
        (function () {
            var c = _setupNS('google.translate._const');
            c._cest = gtConstEvalStartTime;
            gtConstEvalStartTime = undefined;
            c._cl = 'zh-CN';
            c._cuc = 'googleTranslateElementInit';
            c._cac = '';
            c._cam = '';
            c._ctkk = eval('((function(){var a\\x3d2017041154;var b\\x3d78069894;return 423865+\\x27.\\x27+(a+b)})())');
            var h = 'translate.googleapis.com';
            var s = (true ? 'https' : window.location.protocol == 'https:' ? 'https' : 'http') + '://';
            var b = s + h;
            c._pah = h;
            c._pas = s;
            c._pbi = b + '/translate_static/img/te_bk.gif';
            c._pci = b + '/translate_static/img/te_ctrl3.gif';
            c._pli = b + '/translate_static/img/loading.gif';
            c._plla = h + '/translate_a/l';
            c._pmi = b + '/translate_static/img/mini_google.png';
            c._ps = b + '/translate_static/css/translateelement.css';
            c._puh = 'translate.google.com';
            _loadCss(c._ps);
            _loadJs(b + '/translate_static/js/element/main_zh-CN.js');
        })();
    })();
</script>

    <style>
    .goog-te-gadget-simple{
        background:#F5F5F5;
        border:none;
        padding-top:0;
        padding-bottom:0;
    }
    .goog-te-gadget-simple img{
        display: none;
    }
    .goog-te-gadget-simple .goog-te-menu-value span{
        border-left:none!important;
    }
    .goog-te-banner-frame{
        display: none!important;
    }
    body{
        top:0!important;
    }
    </style>