In AnQiCMS, the display form of your website content has high flexibility.Whether it is an article, product details, or an independent page, you can tailor the display layout and template file path for them according to the brand image, content characteristics, or specific operational needs.This design concept of AnQiCMS aims to help users break free from the constraints of traditional CMS, allowing for more freedom in controlling the visual presentation and user experience of the website.

Flexible template mechanism: The foundation of AnQiCMS

AnQiCMS uses a template engine syntax similar to Django, which makes the creation and management of template files intuitive and efficient. All template files are stored in the project's directory./templateUnder the directory, while CSS, JavaScript, images, and other static resources have their own/public/static/directory for management. Understanding this basic structure is the first step in custom layout.

In the writing of template files, variables are used with double curly braces{{变量}}to define, while logical tags such as condition judgment and loop control use single curly braces and percentage signs{% 标签 %}And these logical tags all need corresponding end tags. To ensure the page displays normally, all template files should use UTF-8 encoding.

AnQiCMS supports various website modes, such as adaptive, code adaptation, and independent PC and mobile site modes. If you choose code adaptation or PC + mobile mode, the system will allow you to in/templatethe directory.mobileIn the subdirectory, a separate template set is designed for mobile devices.

Two template file organization modes

In order to adapt to different development habits, AnQiCMS provides two template file organization modes: English

  1. Folder organization mode:In this mode, different types of content will have their own separate folders to store template files, such as:

    • Home Page：index/index.html
    • Details page of article (or other model):{模型table}/detail.html
    • List page of article (or other model):{模型table}/list.html
    • Single Page Details Page：page/detail.html
    • Public Code (such as header, footer):bash.html
    • Code Snippet (such as sidebar, breadcrumb):partial/

  2. Flattened file organization mode:In this mode, all template files are directly stored in the template root directory, and the file names are distinguished by type with underscores, for example:

    • Home Page：index.html
    • Article detail page:{模型table}_detail.html
    • Article list page:{模型table}_list.html
    • Single Page Details Page：page.html

No matter which mode you choose, the key is that the system will automatically match the template according to the preset naming rules.

Intelligent default template matching

The intelligence of AnQiCMS lies in its ability to automatically match some default-named template files based on the type and ID of the content. This means that if you follow specific naming conventions, even without manually specifying the template in the background, the system can automatically apply them:

  • Document (article, product, etc.) detail page:The system will try to find and apply a template file with the path format of{模型table}/{文档id}.htmlFor example, the system may look for the article with ID 10 under the article model,article/10.html.
  • Document List Page：For a list of documents under a certain category, the system will try to find{模型table}/list-{分类id}.htmla template in the format. For example, the list of categories under the article model with ID 5, the system may look forarticle/list-5.html.
  • Single Page Details Page：For the single page with ID 123, the system will try to findpage/123.htmlsuch template file.

These default matching mechanisms greatly simplify the template management of general content, allowing you to focus only on customizing the display of special content.

Custom template path: fine-tune the display of your content

When the default template fails to meet your personalized needs, AnQiCMS allows you to specify a custom template file for specific content through backend settings.This allows you to achieve highly customized page layouts, such as designing a unique visual style for the "About Us" page, or creating a dedicated display template for a marketing campaign page.

  1. For a single article (or a single document under another content model):When you edit a specific article or product in the background "Content ManagementAfter expansion, there is a field named "Document Template".Here, you can enter the path of a custom template file.product/download.htmlEnter it in the "Document Template" field of the product article.download.html(relative to the model folder path, orproduct/download.htmlThe path relative to the template root directory, depending on your organization model and system configuration). When the user accesses this product article, AnQiCMS will use the one you specifyproduct/download.htmlto render the content.

  2. List page for specific categories:In the "Content Management" settings, when editing a category, you will also find the "Category Template" field under the "Other Parameters". By default, the category list will use{分类模型}/list.htmlAs a template. But if you want to provide a completely different layout for a specific category page, for example, a product category list that includes a large slideshow, you can specify a custom template file here, such asproduct/fancy_list.html. Further, this setting also has an option for 'Apply to subcategories'.Select this option, and the custom category template will be applied to the list page of the current category and all its subcategories, saving the trouble of repeating the settings for each subcategory.

  3. For all articles (or documents under other content models) under a certain category:Adjacent to the aforementioned 'Classification Template' field, there is also a 'Document Template' field (in the classification settings).The purpose of this field is that you can set a default detail template for all articles under a category.article/case_detail.htmlThe template, even if these articles themselves do not have a separate "document template" set, they will still inherit this custom template from the category settings.This is very useful for maintaining visual consistency of specific content groups.

  4. For a single independent page:Under the "Page Resources" and "Page Management", when you edit a single page, you will also see a "Single Page Template" field. For example, if you want to create a unique layout with a map and a form for the "Contact Us" page, you can create it in the template directory.page/contact.htmlThen enter the 'Single Page Template' field on this pagecontact.html.

How to specify and apply a custom template

The overall operation process is very intuitive:

  1. Prepare the template file:Firstly, in your AnQiCMS project/templateUnder the directory, organize and design your HTML template files according to your template structure and design requirements. For example, if you want to create a custom template for an article with ID 10 under the article model, you may