如何在多语言站点中实现语言切换链接的显示？

构建一个面向全球用户的网站，多语言支持是不可或缺的一环。AnQiCMS在设计之初就充分考虑了这一点，为多语言内容的发布和管理提供了强大而灵活的解决方案。通过一些简单的配置和模板调整，我们就能轻松地在网站上实现语言切换功能，让不同语言的用户都能顺畅地浏览网站内容。

AnQiCMS的多语言能力

AnQiCMS天生就具备了出色的多语言内容管理能力，这主要得益于其灵活的“多站点管理”和“默认语言包”设计。它不仅支持为每个语言版本创建独立站点，确保内容、URL结构和SEO策略的独立性，还内置了多种语言包，方便后台界面和系统提示的本地化。这意味着我们可以将网站的中文版、英文版、法文版等分别作为不同的站点进行管理，每个站点拥有自己的内容、模板乃至独立的域名或子域名，而AnQiCMS则在后台统一进行协调。

核心：语言切换链接的显示

要在网站前端显示语言切换的链接，AnQiCMS提供了一个非常便捷的模板标签：languages。这个标签能够帮助我们获取所有已配置的多语言站点信息，然后通过循环这些信息，动态生成语言切换的链接。

基本使用方法：

我们通常会将语言切换功能放在网站的头部（Header）或底部（Footer）等公共区域，因此将相关代码放置在模板文件的公共部分（例如base.html或partial/header.html）会比较合适。

以下是一个创建语言切换链接的示例代码：

{%- languages websites %}
{%- if websites %}
<nav class="language-switcher">
    <ul>
        {%- for item in websites %}
        <li {% if item.IsCurrent %}class="active"{% endif %}>
            <a href="{{item.Link}}" {% if item.Nofollow %}rel="nofollow"{% endif %}>
                {%- if item.LanguageIcon %}
                <img src="{{item.LanguageIcon}}" alt="{{item.LanguageName}}">
                {%- else %}
                {{item.LanguageEmoji}}
                {% endif %}
                {{item.LanguageName}}
            </a>
        </li>
        {%- endfor %}
    </ul>
</nav>
{%- endif %}
{%- endlanguages %}

在这段代码中：

  • {% languages websites %}：这个标签会遍历AnQiCMS后台配置的所有语言站点，并将它们的数据赋值给websites变量。
  • {% for item in websites %}：我们通过循环websites来逐一处理每个语言站点的信息。
  • item.Link：这会输出当前语言站点的URL，用户点击后即可跳转到对应的语言版本。
  • item.LanguageName：显示该语言站点的名称，例如“简体中文”或“English”。
  • item.LanguageIcon或item.LanguageEmoji：如果后台为该语言配置了国旗图标或Unicode表情符号，这里会优先显示图标，其次显示表情符号，为用户提供更直观的切换方式。
  • item.IsCurrent：一个布尔值，表示当前循环到的语言是否是用户正在访问的语言，可以用于给当前语言链接添加active样式。
  • item.Nofollow：一个布尔值，表示是否为该链接添加rel="nofollow"属性，这对于SEO控制某些不希望传递权重的链接非常有用。

通过这段代码，网站前端就能根据后台配置自动生成一组语言切换的链接，并能灵活地展示语言名称、国旗图标或表情符号。

多语言与SEO：Hreflang标签

为了帮助搜索引擎更好地理解网站的多语言版本，并将其展示给正确的用户，配置hreflang标签是至关重要的。hreflang标签可以告诉搜索引擎，不同URL下的内容是同一内容的替代版本，只是面向不同的语言或地域。

在AnQiCMS中，我们可以结合languages标签，轻松地在网站的<head>部分生成这些hreflang标签。

Hreflang标签示例：

将以下代码片段放置在网站模板的<head>区域（通常是base.html）：

{%- languages websites %}
{%- for item in websites %}
<link rel="alternate" href="{{item.Link}}" hreflang="{{item.Language}}">
{%- endfor %}
{%- endlanguages %}
  • item.Language：这个字段会输出该语言站点的语言代码（例如“zh-CN”或“en”），搜索引擎会根据这个代码来判断语言和目标地区。

这样一来，网站的每个语言版本都会包含指向其他所有语言版本的hreflang链接，确保搜索引擎能够准确索引和展示。

实现步骤

要实现上述功能，通常需要进行以下配置：

  1. 后端站点配置：

    • 创建多语言站点： 在AnQiCMS后台的“多站点管理”模块中，为每一种目标语言创建一个独立的站点。例如，你可以创建一个中文站点（www.example.com）和一个英文站点（en.example.com或www.example.com/en/）。在创建站点时，请务必设置好站点名称、网站地址以及最重要的“默认语言包”（可在“全局设置”->“系统设置”中选择）。
    • 配置语言信息： 在每个站点的“全局设置”->“系统设置”中，除了设置好“默认语言包”外，还可以为该语言站点上传“语言图标”（国旗等）或选择一个“语言Emoji”，这些信息会通过languages标签自动提供给前端使用。

  2. 前端模板集成：

    • 编辑模板文件： 找到你网站当前使用的模板文件，例如，位于/template/你的模板目录/base.html。
    • 插入语言切换代码： 将上述的语言切换链接代码（第一段languages标签示例）粘贴到你希望显示语言切换器的地方，例如在<header>标签内或<footer>标签内。
    • 插入Hreflang代码： 将上述的hreflang标签代码（第二段languages标签示例）粘贴到<head>标签内，通常放在<title>标签之后或所有<meta>标签之后。

完成这些步骤后，清除网站缓存，访问你的网站，就可以看到配置好的语言切换链接，并且搜索引擎也能更好地理解你的多语言网站结构了。

常见问题 (FAQ)

  1. Q: 网站内容的翻译是自动完成的吗？还是需要手动处理？ A: AnQiCMS本身不会自动翻译内容。你需要在每个语言站点下，手动创建或导入对应语言版本的内容。例如，如果你有一个中文版的“关于我们”页面，那么在英文站点下，你需要再创建一个英文版的“About Us”页面，并确保其内容是英文。AnQiCMS的多站点管理提供了便利，你可以针对每个语言版本独立编辑内容。

  2. Q: 我可以使用国旗图标来表示语言，而不是文字吗？ A: 完全可以。在上面