添加谷歌翻译到你的网站

添加谷歌翻译到你的网站

网站懒得做 i18n?

不如直接谷歌翻译

特性

  • 使用 translate.google.cn 资源,大陆地区也能使用
  • 自动判断浏览器语言
  • 支持 Google 翻译支持的所有语言
  • 隐藏谷歌翻译的样式,更美观

index.html

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
<div id="google_translate_element"></div>

<script async src="/translate-google.js"></script>

<script type="text/javascript">
    function googleTranslateElementInit(){
        new google.translate.TranslateElement({
            pageLanguage: 'zh-CN',
            includedLanguages: 'af,ga,sq,it,ar,ja,az,kn,eu,ko,bn,la,be,lv,bg,lt,ca,mk,zh-CN,ms,zh-TW,mt,hr,no,cs,fa,da,pl,nl,pt,en,ro,eo,ru,et,sr,tl,sk,fi,sl,fr,es,gl,sw,ka,sv,de,ta,el,te,gu,th,ht,tr,iw,uk,hi,ur,hu,vi,is,cy,id,yi',
            autoDisplay:false
        },'google_translate_element');
    }
</script>

styles.css

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
#google_translate_element {
    overflow: hidden;
    border-width: 1px;
    border-radius: 0.25rem;
}

.goog-te-gadget {
    font-size: 0 !important;
}

.goog-te-combo {
    margin-top: 0 !important;
    padding-top: 0 !important;
    font-size: 0.75rem !important;
    line-height: 1rem !important;
    outline: 2px solid transparent !important;
    outline-offset: 2px !important;
}
.goog-logo-link {
    display: none !important;
}
.goog-te-banner-frame {
    position: fixed !important;
}

translate-google.js

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
(function () {
    var gtConstEvalStartTime = new Date();
    var h = this || self,
        l = /^[\w+/_-]+[=]{0,2}$/,
        m = null;
    function n(a) {
        return (a = a.querySelector && a.querySelector("script[nonce]")) && (a = a.nonce || a.getAttribute("nonce")) &&
            l.test(a) ? a : ""
    }
    function p(a, b) {
        function c() {}
        c.prototype = b.prototype;
        a.i = b.prototype;
        a.prototype = new c;
        a.prototype.constructor = a;
        a.h = function (g, f, k) {
            for (var e = Array(arguments.length - 2), d = 2; d < arguments.length; d++) e[d - 2] = arguments[d];
            return b.prototype[f].apply(g, e)
        }
    }
    function q(a) {
        return a
    };
    function r(a) {
        if (Error.captureStackTrace) Error.captureStackTrace(this, r);
        else {
            var b = Error().stack;
            b && (this.stack = b)
        }
        a && (this.message = String(a))
    }
    p(r, Error);
    r.prototype.name = "CustomError";
    function u(a, b) {
        a = a.split("%s");
        for (var c = "", g = a.length - 1, f = 0; f < g; f++) c += a[f] + (f < b.length ? b[f] : "%s");
        r.call(this, c + a[g])
    }
    p(u, r);
    u.prototype.name = "AssertionError";
    function v(a, b) {
        throw new u("Failure" + (a ? ": " + a : ""), Array.prototype.slice.call(arguments, 1));
    };
    var w;
    function x(a, b) {
        this.g = b === y ? a : ""
    }
    x.prototype.toString = function () {
        return this.g + ""
    };
    var y = {};
    function z(a) {
        var b = document.getElementsByTagName("head")[0];
        b || (b = document.body.parentNode.appendChild(document.createElement("head")));
        b.appendChild(a)
    }
    function _loadJs(a) {
        var b = document;
        var c = "SCRIPT";
        "application/xhtml+xml" === b.contentType && (c = c.toLowerCase());
        c = b.createElement(c);
        c.type = "text/javascript";
        c.charset = "UTF-8";
        if (void 0 === w) {
            b = null;
            var g = h.trustedTypes;
            if (g && g.createPolicy) {
                try {
                    b = g.createPolicy("goog#html", {
                        createHTML: q,
                        createScript: q,
                        createScriptURL: q
                    })
                } catch (t) {
                    h.console && h.console.error(t.message)
                }
                w = b
            } else w = b
        }
        a = (b = w) ? b.createScriptURL(a) : a;
        a = new x(a, y);
        a: {
            try {
                var f = c && c.ownerDocument,
                    k = f && (f.defaultView || f.parentWindow);
                k = k || h;
                if (k.Element && k.Location) {
                    var e = k;
                    break a
                }
            } catch (t) {}
            e = null
        }
        if (e && "undefined" != typeof e.HTMLScriptElement && (!c || !(c instanceof e.HTMLScriptElement) && (c instanceof e
                .Location || c instanceof e.Element))) {
            e = typeof c;
            if ("object" == e && null != c || "function" == e) try {
                var d = c.constructor.displayName || c.constructor.name || Object.prototype.toString.call(c)
            } catch (t) {
                d = "<object could not be stringified>"
            } else d = void 0 === c ? "undefined" : null === c ? "null" : typeof c;
            v("Argument is not a %s (or a non-Element, non-Location mock); got: %s",
                "HTMLScriptElement", d)
        }
        a instanceof x && a.constructor === x ? d = a.g : (d = typeof a, v(
            "expected object of type TrustedResourceUrl, got '" + a + "' of type " + ("object" != d ? d : a ?
                Array.isArray(a) ? "array" : d : "null")), d = "type_error:TrustedResourceUrl");
        c.src = d;
        (d = c.ownerDocument && c.ownerDocument.defaultView) && d != h ? d = n(d.document) : (null === m && (m = n(
            h.document)), d = m);
        d && c.setAttribute("nonce", d);
        z(c)
    }
    function _loadCss(a) {
        var b = document.createElement("link");
        b.type = "text/css";
        b.rel = "stylesheet";
        b.charset = "UTF-8";
        b.href = a;
        z(b)
    }
    function _isNS(a) {
        a = a.split(".");
        for (var b = window, c = 0; c < a.length; ++c)
            if (!(b = b[a[c]])) return !1;
        return !0
    }
    function _setupNS(a) {
        a = a.split(".");
        for (var b = window, c = 0; c < a.length; ++c) b.hasOwnProperty ? b.hasOwnProperty(a[c]) ? b = b[a[c]] : b =
            b[a[c]] = {} : b = b[a[c]] || (b[a[c]] = {});
        return b
    }
    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 = navigator.language || navigator.userLanguage;
        c._cuc = 'googleTranslateElementInit';
        c._cac = '';
        c._cam = '';
        c._ctkk = '449649.3822363247';
        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.cn';
        _loadCss(c._ps);
        _loadJs(b + `/translate_static/js/element/main_${navigator.language || navigator.userLanguage}.js`);
    })();
})();

预览

现在你可以在本站页面底部找到翻译工具栏

署名 - 非商业性使用 - 禁止演绎 4.0