发新帖

[亲测] 使用谷歌网站翻译器为你的站点增加多语言版本

[复制链接]
638 1

快来加入 TensorFlowers 大家庭!

您需要 登录 才可以下载或查看,没有帐号?加入社区

x
得到来自海外社区成员的反馈,问是否可以给网站加入多语言的适配,所以就抽空给网站上加入一个谷歌翻译,让页面自动进行多国语言的翻译。

第一步、获取/替换谷歌网站翻译器代码

用正确的方式打开谷歌网站翻译器 https://translate.google.com/manager/website/add
填入自己的网址和网站语言,点击下一步:
WX20180516.png
这里可以做一些自定义的内容,如下:
WX20180516-01.png
点击下一步,获取了需要插入网页的代码:
<div id="google_translate_element"></div><script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'zh-CN', layout: google.translate.TranslateElement.FloatPosition.BOTTOM_LEFT, multilanguagePage: true, gaTrack: true, gaId: 'UA-111625528-1'}, 'google_translate_element');
}
</script><script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

因为谷歌翻译在国内已经可用,所以这里需要替换如上代码里的
translate.google.com
替换为:
translate.google.cn


第二步、在页面插入资源替换的 js 脚本
经过测试,相关页面会仍然会请求谷歌的资源,如
https://www.google.com/images/cleardot.gif
经过测试,这个 gif 文件应该在 .cn 服务器下也有镜像,所以我们需要简单写一段 js 替换 .com 为 .cn,可用的代码如下:
<script type="text/javascript">
// Google translate CN hack
// Author: admin@ tensorflowers.cn

if(typeof(jQuery) == 'undefined'){
document.write('<script type="text/javascript" src="https://www.tfimgs.cn/template/comiis_mi/img/jquery.min.js"><\/script>');
} else{
var $$ = function(func){  
        if (document.addEventListener) {  
                window.addEventListener("load", func, false);  
        }  
        else if (document.attachEvent) {  
                window.attachEvent("onload", func);  
        }  
}  
    $$(function(){  
                jQuery(".goog-te-gadget-icon")[0].src="https://www.google.cn/images/cleardot.gif";
                jQuery(".goog-te-menu-value").children("img")[0].src="https://www.google.cn/images/cleardot.gif";
                jQuery(".goog-te-menu-value").children("img")[1].src="https://www.google.cn/images/cleardot.gif";
})
}
</script>


WX20180516-115856.png

至此,添加成功,大家可以在本社区的 PC 版进行试用,如果有任何问题可以回帖交流,谢谢!
本楼点评(0) 收起

精彩评论1

ViolinSolo  TF豆豆  发表于 2018-7-9 18:45:22 | 显示全部楼层
WAWAWAWA  这个可以有hhhh
本楼点评(0) 收起
您需要登录后才可以回帖 登录 | 加入社区

本版积分规则

快速回复 返回顶部 返回列表