How to configure the AnQiCMS multilingual feature to ensure correct switching and display of content on the front end?

AnQiCMS as an efficient and customizable content management system, provides strong multilingual support to help websites face global users.To effectively configure and use this feature, make sure the content switches and displays correctly on the front-end. We need to make detailed adjustments step by step from the back-end to the front-end template.

The core concept: understand the multilingual management method of AnQiCMS

When using the multilingual feature of AnQiCMS, an important core concept is that it does not provide automatic translation functionality, but rather managescontent in different language versionsTo implement multilingual support. This means that you need to create and maintain a separate set of content (articles, products, pages, etc.) for each target language, and provide corresponding translation files for static text.The system will display the corresponding language version of content and interface text when the user switches language.

In terms of technical implementation, AnQiCMS usually treats each language version as an independent "site", managing and configuring it in the background to achieve isolation of content and settings.

Step 1: Basic Backend Configuration and Content Preparation

Firstly, ensure that your AnQiCMS environment is ready for multilingual setup.

  1. Set default language package.In the AnQiCMS backend, you will find a 'Default Language Pack' option in the 'Global Feature Settings'.Here you can set the default language of the current site. This setting mainly affects the display of system built-in text information (such as background interface prompts, certain default system messages, etc.) under the current site.For example, if your Chinese site needs to display some system messages in Chinese, you should select 'Chinese' here.For your English site, choose 'English'.

  2. Create and configure language version sitesThe multilingual implementation of AnQiCMS often depends on its powerful 'multi-site management' feature. To support multiple languages, you need to create an independent site for each language version.

    • Create through multi-site management:In the "Multi-site Management" area in the background, click "Add New Site". Here, you can configure independent domains for different language versions (for example, the Chinese site useswww.yourdomain.comEnglish site usageen.yourdomain.com), or configure subdirectory through reverse proxy(www.yourdomain.com/en/)
    • Site root directory and database:Ensure that each language site is configured with an independent "site root directory" and "database name" to achieve physical isolation and management of content. If you are using Docker deployment, the site root directory is typically set to/app/Start, it is also recommended to distinguish the database name according to the language, for exampleyourdomain_com_cnandyourdomain_com_en.
    • Default language package settings:When creating each language site, or in the "Global Feature Settings" of each site, set the corresponding language package to the corresponding language respectively, for example, select "English" for English sites.
  3. Enter and manage multilingual contentThis is a key step in the operation of a multilingual website. You need to enter and manage content separately under each language version site.For example, publish Chinese articles on Chinese sites, and corresponding English articles on English sites.

    • Documents, categories, tags, etc:Whether it is an article, product, single page, or category, tag, it needs to be created and maintained under the corresponding language site.The association between them (such as the category of the article) should also be completed in their respective language environments.
    • Content Model:If you use a custom content model, you also need to ensure that the configuration of these models and their fields is correct and consistent in each language version.

Step two: Implementing multi-language switching and display in the front-end template

After the content is ready, the next step is to implement language switching and correct content display in the front-end template.

  1. Static text translation:localesDirectory andtrTagFor fixed text on the website interface (such as navigation menu items, copyright information, form prompts, etc.), AnQiCMS useslocalesTable of contents andtrThe (translate) tag for management.

    • Createlocalesdirectory:Create a folder named under the template directory you are using.locales.
    • Language folder:InlocalesInside the folder, create a subfolder for each language, such aszh-CNrepresenting Simplified Chinese,en-USRepresents English.
    • Translate file:Create in each language subfolder,default.yml(or another name) file, written in YAML format, with key-value pairs, where the key is the identifier you use in the template, and the value is the translation text in that language. For example,locales/zh-CN/default.ymlIn:
      
      "yourLocation": "您的位置"
      "contactUs": "联系我们"
      
      Inlocales/en-US/default.ymlIn:
      
      "yourLocation": "Your Location"
      "contactUs": "Contact Us"
      
    • UsetrTags:In your template files (such asheader.html,footer.htmletc), using{% tr "键名" %}The form to call the translation text. For example:<div>{% tr "yourLocation" %}</div>When the user accesses the Chinese site, it will display 'Your Location'; when accessing the English site, it will display 'Your Location'.
  2. Dynamic content display: associated with the current site languageFor the articles, products, and other dynamic content you enter in the background, AnQiCMS will automatically load the corresponding language version of the content based on the current visited "language site".

    • For example, when a user visitsen.yourdomain.comthen,archiveList/categoryList/pageDetailThese tags will automatically retrieve and display English content from the database of the English site. You do not need to specify any language parameters in these tags.
    • Make sure your template tags (such asarchiveList,categoryList) do not have fixedsiteIdparameters when called, so that they can automatically identify the current site's ID. Usually, these tags are not specifiedsiteIdWhen, it will default to operate the data of the current site.
  3. Front-end language switcherIn order for users to be able to switch language versions freely, you need to add a language switcher in the front-end template. AnQiCMS provideslanguagesLabel to get the list of all language sites.

    • UselanguagesTags:
      
      {%- languages websites %}
      {%- if websites %}
      <nav class="language-switcher">
          <span>切换语言:</span>
          {%- for item in websites %}
          <a href="{{ item.Link }}" {% if item.Nofollow == 1 %}rel="nofollow"{% endif %}>
              {%- if item.LanguageIcon %}
              <img src="{{ item.LanguageIcon }}" alt="{{ item.LanguageName }}" />
              {%- else %}
              {{ item.LanguageEmoji }}
              {% endif %}
              {{ item.LanguageName }}
          </a>
          {%- endfor %}
      </nav>
      {%- endif %}
      {%- endlanguages %}
      
      This code will traverse all configured language sites and generate links to them. You can adjust the display style as needed, for example, using flag icons (LanguageIcon) or language codes (LanguageEmoji).
  4. SEO Optimization:hreflangTagTo help search engines understand your multilingual content and display it to users in the correct language regions, add in each page<head>the tag withhreflangthis attribute.

    • Inbase.htmlor at the top of the page:“`twig {%- languages websites %} {%- for item in websites %}{%-