AnQiCMS is designed to be very clear and flexible in template file management, aiming to allow users to customize the appearance and functions of the website efficiently.If you are using AnQiCMS to build or maintain a website, understanding the location of template files and supported suffixes is the foundation for front-end development and customization.

The core home of template files:/templateDirectory

All AnQiCMS template files are stored in a central directory, which is under the root directory of your website,/templateFolder. This directory is the "home" of all your theme packages./templateUnder the directory, each independent theme package will have its own subdirectory, for exampledefault/my_custom_themeetc.

Each subdirectory of a topic package usually has oneconfig.jsonFile.This configuration file records the basic information of the theme, including the name, version, author, description, and the template types it supports (such as adaptive, code adaptation, or PC+mobile independent site mode).Through this structure, AnQiCMS can identify and manage different theme packages.

Suffix of template files: unified and clear.html

AnQiCMS uses a unified suffix for template files.htmlThis means that whether you are creating a home page template, an article detail page template, a category list page template, or any other page, they should be.htmlEnd.

This choice is highly compatible with the Django template engine syntax supported by AnQiCMS.It not only maintains the consistency of the file format, but also facilitates the recognition and highlighting by the editor.When editing template files, please make sure that the file encoding is in UTF-8 format, especially for Windows users, to avoid page garbled text issues.

Template file organization mode: flexible to adapt to different needs

In each topic package, AnQiCMS supports two main template organization modes to adapt to different development habits and project scales: English

  1. Folder organization mode:In this mode, template files are stored in different subfolders according to their functions or content types, with a clear structure and easy management. For example:

    • Public section:bash.html（Store general code for headers, footers, etc., for reference by other templates）。
    • Code snippets:partial/Table of contents (e.g.,)partial/sidebar.htmlFor sidebar,partial/breadcrumb.htmlFor breadcrumb navigation）。
    • Home Page:index/index.html.
    • Model-related pages:{模型table}/index.html(Model home page)、{模型table}/detail.html(Document detail page)、{模型table}/list.html(Document list page)。
    • single page:page/detail.html.
    • Special page:comment/list.html(Comment list page)、guestbook/index.html(Online留言页)、search/index.html(Search page)、tag/index.html(Tag homepage)、errors/404.html(404 Error page) 等。

  2. Flattened file organization mode:In this mode, all template files are directly stored in the root directory of the theme package, with file names that include their functionality or content type, suitable for small projects or users who prefer a simple file structure. For example:

    • Public section:bash.html.
    • Code snippets:partial/Index (same as above).
    • Home Page:index.html.
    • Model-related pages:{模型table}_index.html/{模型table}_detail.html/{模型table}_list.html.
    • single page:page.html.
    • Special page:comment_list.html/guestbook.html/search.html/tag_index.html/errors_404.htmletc.

It is worth mentioning that AnQiCMS also allows for the definition of specific contentCustom template nameFor example, if you have an article with an ID of 10, you can create one named{模型table}/detail-10.htmlan independent template; or for a single-page "About Us", you can name its templatepage/about.htmlAnd it will be associated in the background. This high degree of flexibility allows you to achieve personalized display for any specific content on the website.

Mobile template：mobile/Subdirectory

To support mobile adaptation or a separate mobile site, AnQiCMS provides a dedicated location for mobile templates. You can create amobile/Subdirectory. Thismobile/The directory structure and file naming conventions are consistent with the main site template, which can be folder-based or flat. When the system detects that the user is accessing through a mobile device, it will load the content in priority.mobile/The corresponding template under the directory.

Static resources: stored independently/public/static/

The style sheets (CSS), JavaScript scripts (JS), and images, etc. of the website required should not be mixed with the template files. AnQiCMS specifies that these static resources should be stored separately in the root directory of the website./public/static/In the catalog. This separation helps improve website performance, facilitates CDN acceleration, and makes the project structure clearer.

Mastered these about the storage location and naming rules of AnQiCMS template files, you can carry out website customization and frontend development in a more organized manner.

Common Questions and Answers (FAQ)

Q1: Besides.htmlCan I use other file extensions as template files?A1: No. AnQiCMS template engine only recognizes and processes.htmlThe file with the extension is used as a template. If you use another suffix, the system will not be able to parse it as a template.

Q2：If I place the template file in the wrong directory, what will happen to the website?A2：If the template file is not stored in the specified path, AnQiCMS will not be able to find the corresponding template.This usually results in the page displaying abnormally, or directly returning a 404 error.Please make sure to check the file path and name carefully when modifying or creating templates.

Q3：How should I reference CSS or JavaScript files within the topic?A3：You should place your CSS, JS files in the root directory of your website./public/static/In the catalog (or any of its subdirectories).When referencing in the template,you can use the absolute path relative to the website root directory,for example<link rel="stylesheet" href="/static/your_theme/css/style.css">provided by AnQiCMS,{% system with name="TemplateUrl" %}Tags can help you dynamically obtain the static file address of the current topic, thus making it more flexible to construct resource paths.