本文介绍了两种方法可以实现网站的多语言切换。

使用 Google Translate

对于单一语言的 Web 应用,使用 Google Translate 增加几行代码就能实现网页内容的一键翻译,可以有效的提升用户友好度,又不必去做繁琐的多语言配置。

<div id='google_translate_element'></div>
<script>
  function googleTranslateElementInit() {
    new google.translate.TranslateElement({
      pageLanguage: 'zh',
      includedLanguages: 'en,it,fr,ru,tr'
    }, 'google_translate_element');
  }
</script>
<!-- 引入 Google Translate 依赖,可放在网页的 Footer 处,避免堵塞正文加载 -->
<script src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit">
</script>

在页面的最上方就出现了选择语言的 select 切换标签。
此方法需要可访问谷歌网站(梯子)。

使用translate.js

两行js实现html全自动翻译。
无需改动页面、无语言配置文件、无API Key、对SEO友好!
在网页最末尾, 之前,加入以下代码,一般在页面的最底部就出现了选择语言的 select 切换标签。 就这么简单。

<script src="https://cdn.staticfile.net/translate.js/3.12.0/translate.js"></script>
<script>
translate.language.setLocal('chinese_simplified'); //设置本地语种(当前网页的语种)。如果不设置,默认自动识别当前网页显示文字的语种。 可填写如 'english'、'chinese_simplified' 等,具体参见文档下方关于此的说明。
translate.service.use('client.edge'); //设置机器翻译服务通道,直接客户端本身,不依赖服务端 。相关说明参考 http://translate.zvo.cn/43086.html
translate.execute();//进行翻译 
</script>

此方法不需要梯子。

标签: web

添加新评论