How to customize the display layout of the website page in AnQiCMS?

AnQiCMS provides very flexible and powerful custom capabilities for website page display layout.Whether you want to quickly build a corporate website with a unique style or need to operate multiple site contents with precision, AnQiCMS can give you the freedom to control everything from the 'skeleton' to the 'flesh' of the website.

Core concept: Comprehensive control from skeleton to detail

The customization capabilities of AnQiCMS are mainly reflected in the use of the Django template engine syntax, which is natural and smooth, easy to learn, and even if you are not a professional backend developer, you can control the display of page elements through simple tag labels.It decouples the display logic of the website from the data content, allowing you to focus on frontend design without worrying about the complexity of the underlying code.

AnQiCMS template files are unified in use.htmlas a suffix, and stored in the root directory/templatefolder. Each template package has aconfig.jsonFile used to define the template name, version, author, and other basic information, the most critical of which istemplate_typefield, which determines whether your website is usingAdaptive/Code AdaptationOrPC+mobile independentThe display mode. This means you can choose the most suitable layout strategy based on the target audience and device type.At the same time, the static resources such as CSS, JS, and images required by the template also have clear storage paths./public/static/It facilitates management and maintenance.

Organization and refinement of template files: the foundation for creating exclusive pages.

In AnQiCMS, the organization structure of template files is very clear, which can be adopted.Folder organization modeorFlat file organization modeThese two patterns are designed to help you efficiently manage and search for templates.

For example, you can place common code segments that all pages need to inherit, such as page headers and footers.bash.htmlChinese; Place reusable code snippets such as sidebars and breadcrumb navigation inpartial/the directory for easy reference between pages.

For common page types, AnQiCMS also presets some default template file names, as long as you create these files, the system can automatically recognize and apply them:

• Home: index/index.htmlorindex.html
• Document Details Page: {模型table}/detail.htmlFor example, the article model isarticle/detail.html)
• Document List Page: {模型table}/list.html
• Single page detail page: page/detail.html
• Search Page: search/index.html
• Error page: errors/404.htmlorerrors/500.html

It is especially worth mentioning that AnQiCMS allows you to specify a unique template for specific content (such as a category, an article, or a single page). For example, if you want the 'About Us' single page to have a completely independent design, you just need to name its template file aspage/about.htmlThen, when creating a single page in the background, specify the use of this custom template. Similarly, category pages can also be accessed through{模型table}/list-{分类ID}.htmlor specify a category template in the background to achieve personalized layout.

If you select code adaptation or PC + mobile mode, the system also supports in/templatecreating in the template folder under the directorymobile/Subdirectory, and copy the template structure consistent with the PC end. In this way, when the mobile device accesses, the system will automatically loadmobile/Ensure the mobile experience of the templates under the directory.

Deep customization: Content model and flexible fields

The website layout is not only static design, but also closely integrated with the content.The 'Flexible Content Model' feature of AnQiCMS is the key to deep customization.It allows you to customize different types of content according to your actual business needsData structure.

For example, an "article" model may only need a title, content, and publication time;And a 'product' model may need product name, price, inventory, image group, detailed parameters, etc.Through the backend settings, you can add various types of custom fields to each model, including single-line text, numbers, multi-line text, single selection, multiple selection, and dropdown selection, etc.These fields directly determine which information you need to fill in when publishing content, and also determine how this information is displayed on the front-end page.

In the template, you can usearchiveDetailtags to get detailed data of a single document througharchiveListtags to get a list of documents, even througharchiveParamsLabel to display custom field data. This means that you can design completely different display modules and styles for each content type.For example, on a product detail page, you can easily loop through the various custom parameters of the product to make the information display more organized.

Precise control: classification, single page and URL layout

The structure and accessibility of a website largely depend on its categorization method, single-page management, and URL structure. AnQiCMS provides a wealth of customization options in these areas:

• Category template:You can not only set a unified list template for all categories under a certain model, but also fora specific categorySpecify a dedicated template. For example, your 'Downloads' category may need a simple list, while the 'News' category requires an abstract and thumbnail.When setting categories in the background, just enter the name of the template file you designed (for exampledownload.htmlThe category will automatically apply the new layout. It can also set template inheritance for child categories to simplify management.
• Single page template: For independent pages such as "About Us", "Contact Us", and others, you can set their display layouts separately. Similar to category templates, in single page management, you can specify an independent template file (such aspage/about.html)，let each single page have a unique design style.
• URL layout (pseudo-static):The URL structure of the website is crucial for SEO and user experience.AnQiCMS provides powerful pseudo-static rule management functions.In addition to built-in number patterns, model naming patterns, and classification naming patterns, etc., you can also customize the URL structure.By flexibly applying the rules{id}（Data ID）、{filename}（Custom data link name）、{catname}（Custom category link name）、{module}(Model table name) variables, you can build personalized URLs that comply with specific SEO strategies and user habits. For example, set the article detail page URL to/article/{filename}.htmlor set the product list page to/product/{catname}-{page}.htmlcan make your website URL more semantically and friendly.

Navigation and blocks: flexible construction of website structure

A good website layout cannot do without clear navigation and reusable page blocks.

• Navigation management:AnQiCMS allows you to create and manage multiple navigation categories (such as top main navigation, footer navigation, sidebar navigation, etc.) in the background "Website Navigation Settings".Each navigation item supports multi-level nesting, you can link to built-in pages, specific categories, single pages, or even external links.In the template, throughnavListLabel, you can easily retrieve and render these navigation menus, implementing complex dropdown menus or multi-level navigation layouts.
• Reusable block: AnQiCMS advocates code reuse, throughincludeandmacroLabel, you can encapsulate commonly used code snippets (such as page headers, footers, sidebar ad slots, general article/product display styles, etc.) and then introduce them where needed.This can reduce redundant development and ensure the consistency of the website style. Especiallyextendstags, allowing you to define a basicbase.htmlAs a "master template", it contains the overall structure and common elements of the website, and other pages inherit this master template and rewrite specific