Question

我想在我们的网站上添加一个翻译选项，但除了嵌入谷歌翻译小部件（看起来不太好）之外，我无法找到如何做到这一点。

我希望将其设计为适合我们的网站，类似于他们在此网站上所做的（不是我们的）https://www.visitscotland.com/brochures/

非常感谢任何帮助！

Answer 1

这种方法的典型方法是根据某些切换（例如在您的示例网站中）或网址中的指示符（例如example.uk或example.de）替换内容。

这比尝试使用某个小部件为用户翻译内容要高效得多，因为它只需翻译一次，而不是每次用户访问内容时都会翻译。

某些浏览器还有内置的翻译功能，特别是Chrome经常提供翻译页面。您可以通过明确说明您的网站所使用的语言来帮助增强这一点，然后Chrome会提供将其翻译为用户浏览器的语言;有两种主要方法可以做到这一点：

W3C建议在html标记中使用lang和/或xml：lang属性：

<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">

Google建议使用meta http-equiv：

<meta http-equiv="Content-Language" content="en">

Answer 2

您可以使用Cloud Translation，它是Angry Monkey Cloud的免费开放源代码项目：https://github.com/angrymonkeycloud/CloudTranslation。

您应该先添加对jQuery的引用，然后再添加CloudTranslation JavaScript文件：

<script crossorigin="anonymous" src="https://cdn.amcapi.com/translation/cloudtranslation-1.0.0.min.js"></script>

并在HTML头中添加配置，如下所示：

<script type="application/json" id="CloudTranslationConfig">
    {
  "Settings": {
    "DefaultLanguage": "en",
    "TranslatorProvider": "Azure",
    "TranslatorProviderKey": "{Your Microsoft Azure Translator Key}",
    "UrlLanguageLocation": "Subdirectory"
  },
  "Languages": [
    {
      "Code": "en",
      "DisplayName": "English"
    },
    {
      "Code": "de",
      "DisplayName": "Deutsch"
    }
  ]
}
</script>

并添加具有“ CloudTranslationSelect”类的自定义选择（下拉列表）（您可以按照自己的方式自定义选择的样式）。

您可以将自己的翻译添加到配置中，以减少来自翻译提供商的调用。

有关https://www.angrymonkeycloud.com/translation的更多信息

向网站添加翻译选项

2 个答案: