How to implement the switching and display of multilingual content in AnQi CMS?

AnQiCMS plays an important role in global content promotion, and its multi-language content switching and display function can help your website easily meet the needs of users accessing in different languages.This not only expands your potential market, but also optimizes the browsing experience of users in different regions.

To implement multilingual content display in AnQiCMS, we first need to understand its core design philosophy: multilingual sites are usually treated as independent 'sites' for management.This means that if you need a Chinese version website and an English version website, they may be configured as two independent sites internally in AnQiCMS, but they can share the same AnQiCMS instance for centralized management.

The foundation for building multi-language content: site and content management

Firstly, AnQiCMS provides 'default language package support', you can set a default language for your website in the global settings of the background.This setting mainly affects the built-in text display of the system, such as the background interface or some general prompt information.However, to truly implement language switching for front-end content, you need to create and maintain the corresponding content for each target language.

This means that if you have a product page, such as “Product A”, to support Chinese and English, you need to create “Product A (Chinese)” under the Chinese site and “Product A (English)” under the English site.The multi-site management function of AnQiCMS provides convenience, allowing you to easily switch and manage the content of different language sites under the same AnQiCMS platform.When you post documents, create categories, or single pages on a site in a specific language, all content will be edited and stored in the language of that site.

Template language switching and display

AnQiCMS's template engine is designed flexibly, allowing you to achieve fine language control on the front-end page.主要有两种方式来处理多语言显示:一是针对模板中的固定文字进行翻译,二是提供多语言站点的切换入口。

For fixed and unchanging text in the template like "Your location", "Home page", you cantrLabel translation processing. Its working principle is to create alocalesfolder under the template root directory, and establish an independent subfolder for each language (for examplezh-cn/en-usEach subfolder contains an English translation of the textdefault.ymlIn this YML file, you associate the original text with the corresponding translated text in the form of key-value pairs. For example,"yourLocation": "您的位置"In the template, use.{% tr "yourLocation" %}The system will automatically display the corresponding translation text based on the language setting of the current site.

To allow users to easily switch between language versions on the website,languagesTags are indispensable.Through this tag, you can retrieve the list of all multilingual sites that have been configured.Link(site link)、LanguageName(language name) andLanguageIcon(language icon) etc. switch button or dropdown menu. For example:

{% 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 %}

This code snippet can dynamically generate a language selector, and the user can click to jump to the corresponding language version of the website.

Optimize the multilingual crawling of search engines

In multilingual website operation, Search Engine Optimization (SEO) is crucial. To avoid duplicate content penalties and ensure that search engines correctly identify your multilingual pages, usehreflangLabels are a standard practice. AnQiCMS also useslanguagesLabels to providehreflangimplementation. You can find it on the website's<head>In the block, use the loop to generate site data, add for each language version<link rel="alternate" href="..." hreflang="..." />Tags:

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

This tells search engines that your website has multiple language versions, and specifies the URL and corresponding language for each version. This helps search engines guide users to the page most suitable for their language and region.

In short, AnQiCMS integrates multilingual capabilities into its multi-site management framework, and combines flexible template tags to provide a comprehensive and easy-to-use multilingual content solution for the website.From backend content organization to frontend interface display and search engine optimization, comprehensive support is provided, helping your website spread efficiently worldwide.


Common Questions (FAQ)

Q1: AnQiCMS 中创建多语言站点是否意味着需要创建多个独立的数据库?

Q2: How do I add a new language to my website?

A2: Firstly, you need to create a new site in the AnQiCMS backend through the "Multi-site Management" feature, specify the corresponding domain name and administrator information for it, and usually also select a default language for this new site.Then, you need to manually translate and publish the content for the new language.localesCreate a new language in the catalog.default.ymlFile, and add the corresponding translation content. Finally, ensure that your language switcher (usinglanguagestags to build) can recognize and link to this newly created language site.

Q3: AnQiCMS 是否支持同一篇文章的不同语言版本之间的内部关联,以便快速切换查看?

A3: AnQiCMS 的设计理念是将不同语言版本视为独立的“站点”进行内容管理。This means that, in the background, the Chinese and English versions of the same article are treated as two separate documents and stored on their respective language sites.The system itself does not provide a built-in "link" function to automatically link different language versions of the same article.languagesLabel gets the links of other language sites, and builds a jump link to the corresponding language version. This requires certain knowledge of template development and content management standards.