In AnQiCMS (AnQiCMS), the organization of template files is directly related to the correct loading, display efficiency, and subsequent maintenance convenience of website content.A clear and reasonable template structure that allows you to handle complex content display needs with ease and greatly improve team collaboration efficiency.

The AnqiCMS uses Go language as the development foundation, and its template engine syntax is similar to Django, which provides powerful and flexible tools for template developers.Understanding its core principles and following certain organizational standards will make your website operation twice as efficient.

The foundation of the template files:/templateTable of contents

First, all custom templates must be stored in the root directory of the website/templateIn the folder. This directory is the starting point for AnQi CMS to identify and load templates. Each independent website theme or template set should be in/templateA dedicated subdirectory is available under the directory. For example, you can create a folder nameddefaultormythemeto store your theme files.

Inside this theme folder, there is an indispensable configuration fileconfig.json.It acts like an 'ID card' for your template, containing the template name, version, author, description, and the most important template type (such as adaptive, code adaptation, PC + mobile terminal) and the current usage status.The Anqi CMS will identify and manage different templates based on this file.

Core principle: Clear separation of HTML and static resources

When organizing template files, a crucial principle is: to completely separate HTML template files from static resources (such as CSS style sheets, JavaScript scripts, images, etc.).

  • HTML template fileThese files are.htmlsuffix, and are stored in a subdirectory of your theme (for example/template/mytheme/). They are responsible for the structure and data rendering of the page.
  • Static resourcesThese files should be stored separately/public/static/Below the directory.The benefits of doing this are multifaceted: it helps with browser caching, reduces the server burden, and allows for the reuse of common static resources when switching between different themes, making management more convenient.{% system with name="TemplateUrl" %}The label gets the static file path of the current template, for example<link href="{% system with name="TemplateUrl" %}/css/style.css" rel="stylesheet">.

Choice of template organization mode

AnQi CMS provides users with two mainstream template file organization modes, you can choose the most suitable one for your website according to its scale and complexity:

  1. Folder Organization ModeIn this mode, template files are categorized into different sub-folders according to their functions or content models, forming a hierarchical structure.

    • Public code: Like page header (header.html) and the footer (footer.htmlThese are the parts that may be included on each page, which can be placed in the root directory of the theme orpartial/in the subdirectorybash.htmlor in a file with a similar name, through{% include "partial/header.html" %}By means of reference.
    • code snippets: Sidebar, breadcrumb navigation, etc., reusable code blocks, usually placed inpartial/directory.
    • specific page type: Home (index/index.html) Model home ({模型table}/index.html) Document detail page ({模型table}/detail.html), Document List Page ({模型table}/list.html) etc. For example, the detail page of the article model might bearticle/detail.html.
    • Other feature pages: Comment List Page (comment/list.html), Online留言页 (guestbook/index.html) of single page detail pagepage/detail.html) of search pagesearch/index.html) of tag homepagetag/index.html) of error pageerrors/404.html) Etc. This model has the advantage of clear structure, easy to manage large projects and team collaboration, and can see at a glance what each file is for.

  2. Flat File Organization ModeThis pattern structure is relatively simple, all major template files are placed directly in the root directory of the theme, and their functions are distinguished by the prefix of the filenames.

    • Home:index.html
    • Model homepage:{模型table}_index.html(For example)article_index.html)
    • Document detail page:{模型table}_detail.html(For example)article_detail.html)
    • Document list page:{模型table}_list.html(For example)article_list.html)
    • Other pages:comment_list.html/guestbook.html/page.html/search.html/tag_index.htmlSuch patterns have the advantage of short file paths, which may make it easier to find files for small or simple websites.

No matter which mode you choose, if your website needs to support mobile devices, you should create one in the theme directorymobile/Subdirectory, and repeat the above structure within it according to the organization mode you choose. For example, if you choose the folder organization mode, thenmobile/index/index.htmlwill be the mobile home page template.

Custom template with specific content loading

The strength of AnQi CMS lies in its high flexibility.In addition to the default general template file, you can also specify a unique template file for specific content (such as an article, a category, or a single page).

  • Document details/list page: You can select a specific document ID ({模型table}/{文档id}.html) or category ID ({模型table}/list-{分类id}.htmlCreate an independent template. For example, if you have an article with an ID of 10, you can createarticle/10.htmlto completely customize its display.
  • single page: For "About Us" type of single-page, in addition to the default,page/detail.htmlyou can also create a template for a specific single-page ID, such as,page/5.htmlor more semantically meaningful,page/about.html.This is configured in the background page management, just specify the template used by the page.This custom mechanism allows you to provide unique display effects for a few special contents without affecting the overall site structure.

ensure the correct loading and display of content

A well-organized template is the foundation, and the correct loading and display of content depend on the following key points:

  1. Tag syntax and variable naming: Anqi CMS template uses double curly braces{{变量}}Output a variable, using a single curly brace followed by a percent sign{% 逻辑 %}To implement conditional judgment, loop control, etc. Variable names usually follow camel case naming (for examplearchive.Title)，must strictly follow. Spelling and capitalization errors will cause the data to be output incorrectly.
  2. Matching of content modelEach document and category is bound to a content model. The template needs to understand which fields these models define in order to pass correctlyarchiveDetail/categoryListTags extract and display data. For example, the article model may haveTitle/Contentfields, the product model may havePrice/Stockfield.
  3. URL static rulesThe AnQi CMS supports flexible pseudo-static rules.The path of the template file is complementary to these rules, ensuring that the URL accessed by the user can correctly map to the corresponding template file and load the content.
  4. UTF-8 encodingAll template files must use UTF-8 encoding. If other encoding is used, the page content may appear as garbled text, affecting user experience.
  5. Cache managementAfter developing or modifying a template, if the front-end page does not update immediately, please be sure to clear the system cache.The AnQi CMS provides convenient backend functionality to update the cache to ensure that the latest modified template files and data can be loaded correctly.

In summary, whether adopting a hierarchical folder mode or a simple flat mode, the key is to establish a set of consistent organizational standards suitable for your project and make full use of the template customization capabilities and data call tags provided by Anqi CMS.This will greatly enhance your website development and operation efficiency, ensuring the correct and efficient loading and display of content.

Frequently Asked Questions (FAQ)

Q1: Why did the website front end not take effect immediately after I modified the template file?This is likely due to system cache.The AnQi CMS aims to improve website performance by caching page content and template files.After you modify the template file, you need to log in to the backend, find the "Update Cache" feature, manually clean up the relevant cache, so that the website front-end can display the latest modifications.

Q2: I have a 'Contact Us' page on my website with special content. I want to use a completely different layout for it. How should I do that?A2: AnQi CMS allows custom templates to be specified for individual pages. You can create a new template file in your theme folder, for examplepage/contact_us.htmlThen log in to the backend, go to 'Page Management', edit the single page 'Contact Us', and fill in the 'Single Page Template' setting itemcontact_us.htmlThis page will use the custom template you have set.

Q3: Why do Chinese characters display as garbled text in my template?A3: Chinese characters are usually garbled due to incorrect encoding format of the template file.The AnQi CMS requires all template files to be saved in UTF-8 encoding format.Please check the tool you use to edit the template, make sure to save the file in UTF-8 encoding, then clear the system cache and refresh the page to solve the problem.