冲浪时偶尔发现了 Google Translate 提供的网页在线翻译服务,浏览了一下本站的在线翻译版本,发现谷歌的在线翻译质量非常不错,就想着能不能直接将这个功能加入到自己的博客中。

谷歌在线翻译站点的解析并不复杂,比如本站的欢迎文章网页为
https://blog-clso-fun.translate.goog/posts/welcome.html?_x_tr_sl=zh-CN&_x_tr_tl=en&_x_tr_hl=en&_x_tr_pto=sc
子域的blog-clso-fun即是将本站域名的点换为横杠,而路径和查询参数与原版一致,只是查询参数多了一些翻译参数的设定,基本也不难猜。

所以花了5分钟,写了一个JS脚本库,为本站的博客添加了切换翻译版本的功能,同时也分享给各位使用。

默认名为 gt.js,请保存到您自己的资源文件夹中
/* google translate lib by https://clso.fun */

var GTC = {
    sl : 'zh-CN',
    tl : 'en',
    hl : 'en',
    host : location.host.replaceAll('.', '-'),
    search : (location.search == '') ? '?' : location.search + '&',
    path : location.pathname,
}

function createGTL(target) {
    if (!target || target.tagName !== 'A') return;
    target.href = 'https://' + GTC.host + '.translate.goog' + GTC.path + GTC.search + '_x_tr_sl='+GTC.sl+'&_x_tr_tl='+GTC.tl+'&_x_tr_hl='+GTC.hl+'&_x_tr_pto=sc';
}

createGTL(document.getElementById('GTLINK'));
使用方法也很简单,在页面内插入一个ID为GTLINK的A标签,然后在该标签下方引入gt.js库。
默认是将简中站点翻译为英文,如果你需要翻译为其他语言,可以自行修改参数,并重置一下链接。
<p><a id="GTLINK">Google Translate</a></p>
<script src="/res/gt.js"></script>

<script>
// 此示例表示将简中站点翻译为繁中
GTC.sl = 'zh-CN'; //站点原文为简体中文
GTC.tl = 'zh-TW'; //将站点翻译为繁体中文
GTC.hl = 'zh-TW'; //翻译工具栏的默认文本,这里设置为繁体中文
createGTL(document.getElementById('GTLINK')); //重置一下链接,或者你也可以设置为其他ID的A标签
</script>