In content operation, creating unique visual and functional experiences for different parts of the website is crucial for enhancing brand image, optimizing user experience, and accurately conveying information.AnQiCMS (AnQiCMS) fully understands this and provides flexible template customization capabilities, allowing us to set personalized display templates for specific articles, categories, and even independent single pages, thus realizing differentiated content presentation.

The core of this feature lies in its ability to allow us to break free from the limitations of the global template of the website, to design and apply specific layouts or styles targetedly, in order to better match the content theme or operational objectives.For example, an important promotional article may need a striking full-screen layout, a product category page may require a specific product display card layout, and a single-page "About Us" page may need a concise and professional introduction template.

Overview of AnQi CMS template mechanism

The AnQi CMS template system is based on a template engine syntax similar to Django, using.htmlfiles as template carriers, and are stored uniformly in the root directory of the website./templateIn the folder. Each website theme has its own template directory, for example/template/default/. This structure is clear and easy to manage, laying a foundation for our subsequent personalized template settings.

To achieve personalized content display, there are mainly two ways: first, by using the template naming rules built into Anqi CMS, allowing the system to automatically identify and apply; second, manually specifying the template file for the content in the background.

The first method: using built-in template naming rules (automatically applied)

AnQi CMS has a smart template search mechanism. If we create template files according to a specific naming convention, the system will automatically apply it to the corresponding content without any additional settings.This provides great convenience for some routine personalized needs.

The following are the default custom template naming formats supported by Anqi CMS:

  • Document (article/product) detail page: {模型table}/{文档id}.htmlFor example, if the article model table name isarticleThere is an article with ID is123, then you can create a namedarticle/123.htmltemplate file. When accessing this article, the system will automatically use this template.
  • Document list page (category page): {模型table}/list-{分类id}.htmlSimilarly, for the article category with ID5you can create aarticle/list-5.htmlThe template, the system will use it to render the article list page of the category.
  • Single page detail page: page/{单页面id}.htmlIf there is a single page ID of10, then createpage/10.htmlto achieve automatic application.

Further, we can also use custom URL aliases to name template files, making the template names more readable. For example, if the custom URL alias for the single-page "About Us" isabout-usSo, you can create onepage/about-us.htmlThe template will be applied automatically by the system.

The second way: specify the template manually through the background (flexible customization)

When our personalized needs cannot be met through naming rules, or when we want to control the application of templates more accurately, Anqi CMS allows us to specify template files directly in the background for articles, categories, or single pages.

Before making any background settings, we need to create our customized.htmltemplate file in the directory of the current template theme. For example, if you are usingdefaultTopic, you can in/template/default/Create one under the directoryspecial-article.htmlorproduct-promo.htmletc. files.

Next, we will introduce how to manually specify according to content types:

  1. For single articles or products:

    • Log in to the AnQi CMS backend, navigate to the 'Content Management' module, and select 'Document Management'.
    • Find the article or product you want to apply a custom template to, and click the "Edit" button on the right.
    • At the bottom of the edit page, there is usually a field called "Document Template".
    • Enter the name of the custom template file you created, for examplespecial-article.htmlPlease note that you only need to fill in the file name, not the path or file extension.
    • After saving the changes, the article or product will use the one you specified when accessed on the front end.special-article.htmlto display the template.
  2. For specific categories and their documents:AnQi CMS provides two-level granularity control in the category template settings:

    • Category list page template:
      • Navigate to the "Content Management" module in the background and select "Document Category."}
      • Find the category you want to apply the custom template to, click the 'Edit' button on the right.
      • In the editing page, there is a field named "Classification Template". This template is usually used to render the list page of the category, for examplelist-with-sidebar.html.
      • You can also check the option 'Apply to subcategories'. If checked, all subcategories under this category will inherit this template setting.
    • Template for articles/products detail page under the category:
      • In the same category editing page, there is also a "Document Template" field.
      • This field allows you to set up for the category underAll articles or product detail pagesStandardize a template. For example, if you want all products in a certain product category to useproduct-detail-v2.htmldisplay, you can fill it in here.
      • This setting is also affected by the 'Apply to child categories' option, if checked, the documents under the child categories will also inherit this template.

    Through these two template settings, we can achieve dual personalized control over the category page and its document detail pages.

  3. For the single page:

    • Log in to the AnQi CMS backend, navigate to the 'Page Resources' module, and select 'Page Management'.
    • Find the single page you want to apply a custom template to, and click the 'Edit' button on the right.
    • At the bottom of the editing page, there will be a field named 'Single Page Template'.
    • Enter the name of the custom template file you created, for exampleabout-us-style.html.
    • After saving the changes, the single page will use the one you specified when accessed on the front endabout-us-style.htmlto display the template.

The template file placement and structure

All custom template files should be placed in the theme directory you are currently using. For example, if your theme folder isdefault, then the path to your template file should be/template/default/. You can place it directly in this directoryspecial-article.html, you can also create subdirectories based on content models or other logic, such as/template/default/article/special-article.html.

AnQi CMS encourages modular design, you can createpartial/Store reusable code snippets (such as sidebars, breadcrumb navigation), or createbash.htmlas a common header and footer, through{% include "partial/header.html" %}or{% extends "base.html" %}tags to reuse code, keeping the template neat and efficient.

注意事项 when designing a custom template

  • Start from an existing template:The simplest way is to copy an existing one (for examplearticle/detail.htmlThe template file, then modify it on this basis. This ensures that you have a complete and correct starting point.
  • Familiarize yourself with the template tags:AnQi CMS provides rich template tags (such asarchiveDetail/categoryDetail/systemetc.), used to obtain various data. In a custom template, you need to flexibly use these tags to display the required content. For example, using{{archive.Title}}to display the article title, or{% archiveList ... %}Call related article list.
  • Ensure the file exists and is named correctly:Whether automatically applied or manually specified, it must be ensured that the template file actually exists in the correct path and that the filename matches the set or naming rules in terms of case sensitivity.
  • Test and debug:After modifying the template, be sure to visit the corresponding page on the front end to test and confirm that the display effect meets expectations.If an error occurs, you can check the background logs or the error information on the front-end page for troubleshooting.

By using the above method, you can fully utilize the template customization capabilities of Anqi CMS, for each content module of the website