如何添加WordPress语言切换器

您是否考虑在网站上添加WordPress语言切换器？如果是的话，请继续阅读！

在您的 WordPress 网站上添加语言切换功能并翻译内容，让访客能够用母语阅读，这有助于您开拓新市场、提升 SEO 效果和在线曝光度，并帮助您赢得新受众的信任。不知道该选哪个插件？请查看我们 上的对比评测，了解 推荐的顶级 WordPress 多语言插件。

借助Weglot，您无需编写代码，即可在 5 分钟内为您的 WordPress 网站或WooCommerce 添加多种语言。

本文将提供详细的分步指南，指导您如何为网站添加WordPress语言切换器，并如何根据网站设计进行个性化定制。

教程：WeglotWeglot为WordPress添加语言切换器

WordPress 语言切换器是一种导航组件，可让访客选择其偏好的语言，并在网站的不同语言版本之间进行切换。您只需安装一个翻译插件，选择所需语言，然后通过短代码将切换器放置在菜单、小工具区域或页面中，即可将其添加到任何 WordPress 网站。

借助Weglot——一款基于人工智能的WordPress 多语言翻译插件（ ），您只需 5 分钟即可为网站添加多种语言，并无需编写任何代码即可自定义设计。该设置同样适用于WooCommerce ——无论您运营的是标准 WordPress 网站还是WooCommerce ，语言切换器的显示效果和操作方式都完全一致。

您可以在网站的多个位置添加WordPress语言切换器，包括菜单栏、小工具区域或HTML页面的源代码中。 

在本教程中，我们将为网站导航添加语言切换器。默认情况下Weglot 语言切换器Weglot 在网站左下角。随后我们将演示如何通过设置或使用Weglot语言切换器visual editor来调整其位置。 

步骤 1：安装并激活Weglot

在你的 WordPress 网站上安装并激活Weglot 插件。然后，创建一个Weglot 账户，在此管理和编辑您的翻译，并获取用于集成的唯一 API 密钥

步骤 2：连接Weglot 选择语言

点击 WordPress 仪表板上的Weglot 标签，添加 API 密钥，选择网站的原始语言和要添加的语言，然后点击保存。 

第 3 步：检查您的网站和语言切换器

您的 WordPress 网站现已支持多语言！Weglot 自动检测Weglot 您网站的内容，利用人工智能将其翻译，并显示在相应的语言子目录下。

请查看您网站的前端界面，您会在右下角看到一个新的 WordPress 语言切换器。

点击后，它会展开显示可用语言，让您选择并显示您喜欢的翻译。

Weglot默认设计，您现在可以通过多种方式自定义WordPress语言切换器的样式和位置。

自定义您的WordPress语言切换器

要开始进行基本定制，请进入 WordPress 后台的Weglot > 语言按钮设计（可选）。在此页面，您可以选择

• 是否使用下拉菜单
• 是否在切换器中使用标记，以及标记的类型
• 如果显示语言名称
• 只显示语言代码

还有一节内容是关于覆盖CSS并用自定义选择器替换的——我们稍后会详细说明。现在，让我们先自定义语言切换器，使其显示语言名称时不带国旗图标，但保留下拉菜单功能。

为此，请取消选中 "有标志"，并选中 "是全名"，然后查看您的网站：

‍“

您可能还想进行一些高级自定义设置。例如，让我们在导航菜单或侧边栏中显示语言切换器。

语言切换器位置选项

有几种实现方式：可以在菜单中、作为小工具、使用短代码、通过 HTML 代码，或者作为悬浮按钮——当用户滚动页面时，该按钮会始终停留在屏幕角落。 您还可以使用短代码 [weglot] 将切换器直接嵌入文章或页面内容中——将其粘贴到页面编辑器中您希望显示的位置即可。Weglot切换器兼容所有 WordPress 主题，包括 FSE 和块式主题。

Weglot 向下滚动页面直至看到显示语言切换器的选项：

只需根据您希望语言切换器的位置，按照提示操作即可。在此示例中，我们将前往“外观 -> 菜单”，然后拖放切换器来调整菜单项的顺序。 

准备就绪并保存更改后，请再次查看前端：

虽然语言切换器位于页眉区域，但其显示方式存在问题。此外，您也可以使用内联语言代码替代下拉菜单。

高级语言切换器样式设置

这就是使用 CSS 的地方。首先，关闭 WordPress 中Weglot 菜单的下拉设置。然后，勾选显示语言代码的复选框。

在这里，你可以使用覆盖 CSS文本区域来设置字体、颜色和文字大小的选择器，使其适合你的网站设计：

最后，看看你的前端设计：

通过合理布局和几行CSS代码，您就能快速轻松地Weglot语言切换器定制样式，使其与您的网站风格完美契合，无需复杂的模板编辑、HTML或PHP编码技能。 

请注意，自定义 CSS 修改完全是可选的。您可以通过 WordPress 管理器中Weglot 标签部分的可用选项移动和更改设计。 

visual editor 您更倾向于可视化操作，也可使用Weglot语言切换器visual editor ： 

语言切换器visual editor 您控制与WordPress仪表板相同的设置。您只需将切换器拖动到期望显示的位置，然后点击“保存”即可让更改在WordPress网站上生效。 

显示 WordPress 语言切换器的最佳实践

语言转换者通常分为两个具有相关属性的阵营：

• 不存在。 换句话说， 网站根本不提供翻译。
• 难以寻觅。语言切换器可能被隐藏在导航栏或其他位置，迫使用户玩起捉迷藏的游戏，造成糟糕的用户体验。
• 易于查找。相比之下，WordPress的语言切换器通常位于清晰且相关的位置，例如页眉或页脚。
• 非常容易找到。 如果WordPress语言切换器位于醒目的屏幕位置（例如页眉），您将 获得好运。这能让您快速选择正确的语言。

因此，让网站访客轻松选择首选语言并为国际网站访客提供友好的用户体验至关重要。在理想的情况下，您应该不需要附加组件就能做到这一点。有鉴于此，请考虑以下几点：

1. 谨慎选择语言选项。您可以启用所有语言并不意味着您应该启用所有语言；您应该只启用您需要的语言。 
2. 让语言切换器易于查找。将其置于页眉或页脚都是不错的选择。在移动设备上，语言切换器通常作为菜单项出现在主导航栏中。
3. 为您的WordPress语言切换器设计专属样式，使其与网站风格完美契合。虽然 默认的通用语言切换器看似便捷，但根据网站视觉风格进行定制化调整才是明智之选。
4. 为所选语言选择旗帜或名称。 虽然旗帜因多种原因（色彩鲜艳、标志性强、节省空间）而吸引着设计师的使用，但旗帜并不是为描述语言而设计的。这就带来了各种问题。

3 个成功转换语言的例子

在浏览网页时，你经常会看到语言切换器。但是，如果你不会说其他语言（或者没有寻找选项），你可能不会意识到它们的设计和在页面上的位置有多么不同。

1. 微软翻译器

Microsoft Translator网站通过位于页面页脚附近的下拉菜单（在本例中为 "上拉菜单"），让访问者从近 40 种语言中进行选择。他们还选择使用母语完整显示每种语言的名称。这样做可以让访问者一目了然地识别自己的语言，并确保语言切换选项一目了然。

2. Etsy

作为一个让手工艺人销售手作商品的国际平台，Etsy提供设计精良的语言切换器并不令人意外。你可以在其网站每个页面的页脚处找到该功能。

您可以选择地区、语言和货币。点击此处会弹出一个模态框，您可以在其中更改这些选项——这种简洁的设计避免了强迫用户跳转到地区网站。

3. Evernote

广受欢迎的笔记应用Evernote将语言切换器设计得简洁明了，通过页脚处的下拉菜单即可切换语言。

它易于查找，且标签清晰——这证明了即使是极简风格的切换器，依然能提供清晰、流畅的使用体验。

实现精心设计的WordPress语言切换器

只要使用合适的工具，为您的网站添加 WordPress 语言切换器非常简单。使用Weglot，您无需开发人员即可自动添加语言切换器，从第一天起即可享受完整的 AI 翻译服务，并拥有完全的编辑控制权。该翻译工具在后台运行，确保您的翻译内容始终保持最新、符合品牌风格，且无需人工干预。 您还可以在Weglot 启用自动重定向功能（ ），该功能会检测访客的浏览器语言，并自动为其提供网站的正确语言版本。

Weglot 多语言 SEO 的需求。它会为网站的每个翻译版本自动创建语言子目录，添加 hreflang 标签并翻译元数据。搜索引擎从上线第一天起就能发现并收录所有语言版本。

选择一款同时兼顾多语言搜索引擎优化的 WordPress 翻译插件。借助自动创建的语言子目录、翻译元数据和 hreflang 标签，Weglot 可以处理多语言网站的技术、搜索引擎优化和翻译工作。

准备好在您的网站上添加一个 WordPress 语言切换器了吗？立即开始使用Weglot免费套餐Weglot Weglot， 无需信用卡。