When using AnQiCMS to build a website, the organization and naming of template files are key to flexible content display, improving website maintenance efficiency and scalability.A well-structured and clear-named template system, which not only allows you to easily handle various content types, but also lays a solid foundation for future functional expansion.

Storage and basic conventions of template files

AnQiCMS's template system adopts a syntax similar to Django's template engine, which makes you feel very close to front-end development. All template files are uniformly used.htmlAs a file suffix, and placed in the root directory of the website/templateIn the folder. While the images, JavaScript scripts, and CSS styles involved in the template have their own respective/public/static/Directory management. This separated management helps maintain the purity of the template code and also facilitates the deployment and optimization of static resources.

On writing template content, AnQiCMS follows a set of intuitive syntax rules. Variable output uses double curly braces, for example{{变量名}}Where conditional judgments, loop control, and other logical tags are used, such as{% if 条件 %}And these tags must appear in pairs, with{% endif %}or{% endfor %}End. It is recommended to use UTF-8 encoding format for all template files to avoid garbled characters.

Two types of organization modes for template directories.

AnQiCMS provides two main template file organization modes, you can choose according to the scale of your project and personal preference:

  1. Folder organization mode:In this mode, template files are placed in different folders according to their function or content type. For example, the home page template may be inindex/index.html, and the article detail page is inarticle/detail.html, Product list page is inproduct/list.html. The advantage of this method is that the structure is clear and it is easy to manage large projects.

    • Public code:Like the header (header), footer (footer) these parts that are almost referenced on every page, can be extracted and placed in a public file, such asbash.htmlor more specificpartial/header.html.
    • code snippet: Sidebar, breadcrumbs, and other reusable UI components can be stored inpartial/catalogs for easy access{% include "partial/sidebar.html" %}in this manner.
    • Content pages:
      • Home:index/index.html
      • Model homepage (for example, the homepage of all articles):{模型table}/index.htmlFor example,article/index.html)
      • Document Details Page:{模型table}/detail.htmlFor example,article/detail.html)
      • Document List Page:{模型table}/list.htmlFor example,article/list.html)
      • Single page detail page:page/detail.html(such as the "About Us" page)
    • Special feature page:Comment list page(comment/list.html)Online message page(guestbook/index.html)Search page(search/index.html）、label-related pages（tag/index.html,tag/list.html）、error page（errors/404.html,errors/500.html) and so on.
    • Mobile end template:If you choose the 'code adaptation' or 'PC + mobile end' mode, you can create a directory next to the main templatemobile/The subdirectory maintains the same structure as the main template directory and is used to store exclusive template files for the mobile end.

  2. Flattened file organization mode:This pattern places most template files directly at the root level of the main template directory, distinguishing functions by filenames.It is more suitable for small and medium-sized websites with relatively simple content structure and a small number of pages.

    • Common code and code snippets:The same as the folder organization mode, it is still recommended to usebash.htmlandpartial/Directory.
    • Content pages:
      • Home:index.html
      • Model Home:{模型table}_index.htmlFor example,article_index.html)
      • Document Details Page:{模型table}_detail.htmlFor example,article_detail.html)
      • Document List Page:{模型table}_list.htmlFor example,article_list.html)
      • Single page detail page:page.html
    • Special feature page: comment_list.html,guestbook.html,search.html,tag_index.html,tag_list.html,errors_404.htmletc.
    • Mobile end template:Similarly, inmobile/Stored in a flattened way in the subdirectories.

Achieve more fine-grained custom content display

The strength of AnQiCMS lies in its support for highly customized template applications.In addition to the above general naming rules, it also allows you to use completely independent templates for specific content items (such as an article, a category, or a single page).

  • Customization of the document detail page:You can create a dedicated detail template for a specific article or product. The naming format is{模型table}/{文档id}.html. For example, if you have an article modelarticle), where the ID is10The article needs a unique layout, you can createarticle/10.html. The system will automatically use this template when accessing the article with ID 10.
  • Customization of category list page:Similarly, a list page for a specific category can also have its own template. The naming format is{模型table}/list-{分类id}.htmlFor example,product/list-5.htmlIt will be applied to the product category list page with ID 5.
  • Customization of single-page detail pages:For single pages such as "About Us", "Contact Information", you can createpage/{单页面id}.htmlor more semantically meaningfulpage/about.html. When editing single pages in the background, select the "Document Template" field to fill inabout.htmlJust do it.

This flexible naming mechanism means that you can provide a customized user experience for any细分 content unit according to your business needs, without modifying the core logic, greatly enhancing the freedom of content display.

Associate the template file with the background content

After you have created these custom templates in the file system, the next step is to associate them with specific content in the AnQiCMS backend. When editing articles, categories, or single pages in the backend, you will see an option for 'Document Template' or 'Category Template', which is where you enter the name of the custom template file (without the path, just fill in as follows In the AnQiCMS backend, you will see an option for 'Document Template' or 'Category Template', which is where you enter the name of the custom template file (without the path, just fill in as followsabout.htmlSuch a filename). The system will intelligently search and apply the corresponding template based on the name you enter.

Summary

AnQiCMS template organization and naming strategy aims to provide high flexibility and convenience.By understanding the folder organization mode and flat mode, and making good use of the customized naming rules of specific content items, you can build an efficient and creative website content display system according to the complexity and personalized needs of the website.Rational planning of template structure not only allows you to implement design intentions faster, but also brings great convenience to the long-term development and maintenance of the website.

Frequently Asked Questions (FAQ)

Q1: I want to design a completely independent layout for the 'About Us' single page, how should I operate? A1:You can create a folder named under the template directory you are currently using,page/about.htmlThe file, design the unique layout of your "About Us" page. Then in the AnQiCMS backend, find "Page Resources" under "Page Management", edit the "About Us" page, and fill in the "Single Page Template" field.about.htmlSave and it will automatically apply the template you customized.

Q2: What are the advantages and disadvantages of folder organization mode and flat file organization mode, and how should I choose? A2:The folder organization mode has the advantage of clear structure, suitable for websites with a lot of content and complex functions, facilitating team collaboration and modular management, but the path may be a bit long.The advantages of the flattened mode are that the structure is simple, file search is intuitive, and it is suitable for small websites or personal blogs, but it may become cluttered as the number of files increases.Choose which mode depends on the scale of your project, the complexity of the content, and your preference for file management.It is usually recommended to start with folder mode because it has more advantages when expanding the project.

Q3: I created a new article detail templatearticle/special-detail.htmland selected it on the background article editing page, but it still displays the default template when accessed on the front end, what's the matter? A3:Please check the following points:

  1. Is the file path correct:Ensurespecial-detail.htmlThe file is indeed located in the directory where you are using the templatearticle/In the subdirectory.
  2. Is the filename accurate:Is the template name filled in the background exactly the same as the file name (including case, if the system distinguishes case).
  3. Is the template cached:Try to clear the AnQiCMS system cache or refresh the browser cache, sometimes old template information may be cached. 4