What templates' code can AnQiCMS backend template editing feature allow us to modify online?In simple terms, it supports modifying almost all code files that constitute the front-end interface of your website, which together define the visual presentation and interaction logic of the website.
The skeleton and soul of the website interface: various HTML template files
The template system of Anqi CMS is.htmlAs the suffix of template files, and store them uniformly in/templateThe template folder means that you can modify all HTML files that define the layout and content of different web pages online. This includes but is not limited to:
- Core page template：As the homepage of the website(
index/index.htmlorindex.html), it is the first impression of the website for users;{模型table}/detail.html), defines the display method of articles or product content; as well as the document list page({模型table}/list.html)，decided the layout of the content list. - Special function page template: For example, a single-page detail page(
page/detail.html) used for independent pages such as "About Us", "Contact Us"; Comment list page(comment/list.html)；English留言页(guestbook/index.html)；English搜索结果页(search/index.html)；English以及标签相关的首页(tag/index.html)English和列表页(tag/list.html). - 系统级提示页面：如常见的404错误页(
errors/404.html)、500错误页(errors/500.html)和站点关闭提示页(errors/close.html)，这些页面的内容和样式也都可以被个性化定制。 - 公共代码片段：To improve code reusability, Anqi CMS encourages the extraction of common modules such as header(
bash.html), footer, sidebar, navigation, and so on, and store them inpartial/The catalog. These "code snippets" also support online editing, ensuring consistency of the global style of the website and easy maintenance. - Template configuration file: Each template theme contains a
config.jsonFile, used to define the name, version, author, and other metadata of the template. Although it is not the code displayed on the page, it is also an important configuration item that can be edited online in the template package. - Mobile Exclusive TemplateIf your website uses code adaptation or PC + mobile independent site mode, Anqi CMS also supports in
mobile/The directory contains a set of independent mobile template files, which can also be edited online to provide an English mobile user experience.
It is worth mentioning that, AnQi CMS also supports customizing the template file names, for example, you can specify a unique one for a specific article, category, or single page..htmlTemplate, these custom template files can be modified online as long as they are in the corresponding directory.
Template code composition elements: HTML, CSS, JS and AnQiCMS exclusive language
When you are online editing these.htmlWhen you are dealing with a file, you are actually manipulating a mix of the following code:
Standard HTML, CSS, and JavaScriptThis is the foundation for building any webpage. You can write HTML structure, embed CSS styles (whether inline, internal style sheet or through
<link>Tagging external style sheet import) and adding JavaScript scripts (whether inline or through<script>Tags refer to external JS files to achieve rich visual effects and dynamic interactions.AnQiCMS template language (Django-like syntax)This is the core of AnQi CMS template, it adopts the syntax style similar to Django template engine, making the display of dynamic content intuitive and powerful.
- Variable output：Through double curly braces
{{ 变量名 }}to output dynamic data, for example{{ archive.Title }}to display the article title. Variable names follow camel case naming conventions. - Control logic: Use
{% ... %}tags to handle logic, for example{% if 条件 %}Perform conditional judgment,{% for item in 列表 %}Perform loop traversal. These logic labels usually need{% endif %}or{% endfor %}end tags. - Rich built-in tags：Security CMS is built-in with up to 38 commonly used tags, which are powerful tools for obtaining and displaying various types of website data. For example:
systemtags：Obtain the website name, Logo, filing number, and other global system configurations.contacttags：Obtain contact information such as contacts, phone numbers, and addresses.tdktags：Get the SEO title, keywords, and description of the page.navListtags：Dynamically generate the website navigation menu.categoryListandcategoryDetailtags：Get the category list and category details.archiveListandarchiveDetailtags：Get the list and details of articles/products.tagListandtagDataListtags：Get the list of tags and associated documents.commentListandguestbooktags：Handle the comment and message form.linkListtags：Get the list of friend links.paginationtags：Generate pagination navigation. These tags allow you to flexibly display background data at any position on the website.
- Practical filters (Filters)To make the data more refined when displayed on the front end, AnQiCMS also provides various filters for processing and formatting variables. For example:
truncatecharsUsed to truncate strings and add an ellipsis;stampToDateUsed to format timestamps into readable dates;safeUsed to output HTML content without escaping;addConcatenating numbers or strings;replacePerform content replacement and so on. - Helper Tags (Helper Tags)For example:
includeUsed to import other template files for modular development;extendsUsed for template inheritance, defining the common layout of the website;macroUsed to define reusable code snippets to improve efficiency.
- Variable output：Through double curly braces