如何实现多语言网站内容的切换显示?

在当今全球化的数字环境中,让网站支持多种语言显示,已经不再是一个可选项,而是许多企业和内容运营者拓展国际市场、提升用户体验的必备策略。安企CMS(AnQiCMS)在设计之初就充分考虑了这一点,内置了强大的多语言支持功能,帮助我们轻松实现网站内容在不同语言间的切换显示。

那么,具体该如何操作,才能让我们的安企CMS网站具备多语言内容切换的能力呢?这主要可以从系统语言包、前端内容显示和搜索引擎优化三个方面来着手。


配置系统语言包与后台界面

首先,如果你希望网站后台的管理界面,或是系统自带的一些提示信息能显示不同的语言时,安企CMS 提供了一个直接且方便的设置。

你只需要登录安企CMS的后台,前往“后台设置”菜单下的“全局功能设置”。在这里,你会找到一个名为“默认语言包”的选项。安企CMS目前内置了中文和英文两种语言包供你选择。选择你想要的语言后,系统后台界面以及一些固定的提示文本就会相应地切换显示。

然而,一个非常重要的点需要我们注意:这个“默认语言包”的设置主要影响系统内置的文本,比如后台菜单名称、一些系统提示语等。它并不会自动翻译你网站上自定义发布的内容,例如文章、产品描述、单页面等。这些由我们自己创建和发布的内容,需要我们采用另外的方式来处理。


实现前端多语言内容切换显示

对于网站真正面向用户的多语言内容,例如你的文章、产品介绍、单页面等,安企CMS 提供了灵活的机制来实现切换显示。核心思路是为每种语言准备一套相应的内容,并通过前端的语言切换器引导用户访问对应语言版本。

为了实现不同语言内容的切换,安企CMS提供了一个非常实用的模板标签:{% languages websites %}。这个标签能够动态获取你配置的所有多语言站点信息,这些信息包含了每种语言的名称、对应的链接以及可爱的语言图标(Emoji或自定义Icon)。

内容管理策略: 在安企CMS中,为了让不同语言的用户看到对应的内容,最常见且推荐的做法是为每种语言设置一个独立的站点或子域名。例如,你的主站是 www.example.com(中文),你可以设置 en.example.comwww.example.com/en/(英文)作为英文站。这意味着你需要为每个语言版本独立发布和管理内容。当你创建一个新文章或产品时,你需要为它的每个语言版本分别创建对应的条目,并确保其链接是独立的。

前端语言切换器的实现: 在网站的模板文件中,比如你通常在页头或页脚放置语言切换按钮的地方,可以使用 {% languages websites %} 标签来生成语言切换列表。

一个简单的语言切换代码片段看起来会是这样:

{%- languages websites %}
{%- if websites %}
<div>
    <span>切换语言:</span>
    {%- for item in websites %}
    <a href="{{item.Link}}">
        {%- if item.LanguageIcon %}
        <img src="{{item.LanguageIcon}}" alt="{{item.LanguageName}}" />
        {%- else %}
        {{item.LanguageEmoji}}
        {% endif %}
        {{item.LanguageName}}
    </a>
    {%- endfor %}
</div>
{%- endif %}
{%- endLanguages %}

这段代码会遍历所有已配置的语言站点,并为每个语言生成一个链接。点击这些链接,用户就会被引导到当前页面对应的另一种语言版本。例如,如果用户正在浏览中文站的“关于我们”页面,点击英文切换按钮后,就会跳转到英文站的“About Us”页面。

模板固定文字的翻译: 除了内容本身的翻译,网站模板中一些固定的文字,例如导航菜单项、页面提示语等,也可以通过安企CMS的翻译标签进行多语言化。这需要你在模板目录下创建一个 locales 目录,并在其中为每种语言创建对应的子目录(如 en-uszh-cn),然后在这些子目录中创建 default.yml 文件来定义翻译键值对。

例如,zh-cn/default.yml 中可以有:

"yourLocation": "您的位置"

en-us/default.yml 中则对应:

"yourLocation": "Your Location"

在模板中,你就可以使用 {% tr "yourLocation" %} 标签来显示这些翻译过的固定文本,系统会根据当前站点设置的语言自动选择正确的翻译。


搜索引擎优化(SEO)的**实践:Hreflang 标签

在构建多语言网站时,一个不可忽视的关键点是搜索引擎优化(SEO)。为了让搜索引擎正确识别你的多语言内容,并将不同语言版本的内容展示给合适的受众,使用 hreflang 标签至关重要。

hreflang 标签能够告诉搜索引擎,你的网站提供了相同内容的不同语言或地区版本。这有助于避免重复内容问题,并确保用户在搜索时看到与其语言和地区最匹配的页面。

安企CMS 同样通过 {% languages websites %} 标签提供了方便的 hreflang 输出功能。你只需要将以下代码片段放置在你网站模板的 <head> 区域内,安企CMS 就会自动生成正确的 hreflang 标签:

{%- languages websites %}
{%- for item in websites %}
<link rel="alternate" href="{{item.Link}}" hreflang="{{item.Language}}">
{%- endfor %}
{%- endLanguages %}

这段代码会为每个语言版本生成一个 `