How to set up independent display templates for articles, products, or single pages?
How to set up independent display templates for articles, products, or single pages in Anqi CMS?
In website operation, we often encounter such needs: a special article needs a unique layout to highlight its importance, a product needs a dedicated display page to improve conversion rates, or a core single-page like "About Us" needs a distinctive design to strengthen the brand image.AnQi CMS understands the importance of this flexibility for content operation, and therefore it provides a very convenient way for us to set independent display templates for articles, products, and even single pages.
The core of this feature is to decouple content from its presentation.That is to say, you can edit the content in the background without worrying about its final display style, as the style can be easily implemented according to your needs by switching templates.
Understanding the template mechanism of Anqi CMS
The Anqi CMS template system uses syntax similar to Django, template files are usually named with.htmlsuffix and stored in the root directory of the website./templateIn the folder. Each set of templates has its own independent directory.When we set an independent template for specific content, in fact, it is telling the system: 'When accessing this content, do not use the default style, but use the template file I specify to render it.'
This flexibility not only allows designers to express themselves freely, but also enables operation personnel to quickly adjust the page layout according to the strategy of content marketing, to adapt to different promotional activities or content types.
Set independent display templates for articles and products
Articles and products in Anqicms are all under the document under the 'Content Model', and their template setting logic is similar.
Imagine you have an annual report that you want to have a more professional, illustrated dedicated page; or you have a flagship product that needs a special layout with modules including videos, user reviews, etc.At this point, it can be specified with an independent template.
Specific operation steps:
Create or prepare a custom template file:First, you need to be in the directory of the currently used template theme (for example:
/template/default/)，According to your content model, create a new HTML file.- If your content is "article", you can create a similar
article/special-report.html. - If your content is "product", you can create a similar
product/flagship-showcase.htmlfile. Make sure the content of this file includes the unique layout and style you want.
- If your content is "article", you can create a similar
Specify the template in the background:Next, enter the Anqi CMS backend, find the settings you need.article or product:
- Click on the left menu 'Content Management' -> 'Document Management'.
- Find the target article or product and click "Edit".
- Scroll down to the "Other Parameters" section on the edit page, and you will see a field named "Document Template" input box.
- Here, enter the relative path and filename of the custom template file you just created. For example, if you created
article/special-report.htmljust fill inspecial-report.htmlit will be recognized automatically by the system)articledirectory). - Save your changes.
After completing these steps, when the user visits this specific article or product detail page, Anqi CMS will automatically call the one you specifiedspecial-report.htmlorflagship-showcase.htmltemplate to display the content.
Set an independent display template for the category list page
Sometimes, you may want a specific category, such as "News Updates" and "Success Stories", which, although both are article categories, have very different list display formats.News may need concise titles and publication times, while successful cases may need to highlight thumbnails and short descriptions.
Specific operation steps:
Create or prepare a custom template file:Similarly, create a list page template under your theme directory based on the content model.
- For example, you may create one for the “news” category.
article/list-news.html. - Create a category for "Successful Cases".
article/list-cases.htmlThese template files will be responsible for rendering the style of the article list under this category.
- For example, you may create one for the “news” category.
Specify the template in the background:Enter the Anqi CMS backend and find the settings you need to set up.Category:
- Click on the left menu "Content Management" -> "Document Category".
- Find the target category and click "Edit".
- Scroll down to the "Other Parameters" section on the edit page, and you will see a field named "category template" input box.
- Enter the relative path and file name of the custom category list template file you created. For example, if you created
article/list-news.html, then fill inlist-news.html. - Additionally, there is also a “Apply to subcategoryThe option. If you want this custom list template to also apply to all subcategories of the current category, you can check it.
- Save your changes.
After setting this, when visiting the list page of the category, the page will use the one you specifiedlist-news.htmlorlist-cases.htmlto display the content.
A little tip:In the category settings, in addition to the 'Category Template', there is also an 'Document Template' option.
- The 'Category Template' controlsthe display style of the category list page.
- The 'Document Template' controlsAll documents under this categoryThe display style of the detail page. For example, you can set a special display style for the list page of "Product Category A".
product/list-grid.htmlThe template specifies that all product detail pages in this category should use itproduct/detail-fancy.htmlThe template. This hierarchical control makes content display more refined
Set an independent display template for a single page
Web pages such as "Contact UsTailor-made unique designs can effectively improve user experience.
Specific operation steps:
Create or prepare a custom template file:Create a new HTML file in your template theme directory.
- For example, you may create one for the "About Us" page.
page/about-us.html. - Create one for the "Contact" page.
page/contact-page.html.
- For example, you may create one for the "About Us" page.
Specify the template in the background:Enter the Anqi CMS backend and find the settings you need to set up.single page:
- Click on the left menu "Page Resources" -> "Page Management".
- Find the target single page and click "Edit".
- In the edit page, you will see a field named "Single page template" input box.
- Enter the relative path and filename of the custom single-page template file you created. For example, if you created
page/about-us.html, then fill inabout-us.html. - Save your changes.
After that, when accessing this single page, the system will use the one you specifiedabout-us.htmlorcontact-page.htmltemplate to display the content.
Tips for naming template files
The AnQi CMS also supports some default template naming conventions. If you create template files that comply with these conventions, you even do not need to specify them manually in the background, the system can automatically apply them:
- Document default custom template:Name format is
{模型table}/{文档ID}.html. For example, if your article model isarticle, there is an article with ID 10, you can createarticle/10.html. - Document list default custom template:Name format is
{模型table}/list-{分类ID}.htmlFor example, if you have a category with ID 5, you can createarticle/list-5.html. - Default custom template for single page:Name format is
page/{单页面ID}.htmlFor example, a single page with ID 20 can be createdpage/20.html.
Although these default conventions are convenient, in actual use