In website operation, we often need to create some relatively fixed, information-rich independent pages, such as "About UsThese pages are usually referred to as single-page content, which is an indispensable part of a website, used to provide core information to visitors, build trust, or guide operations.

AnQiCMS provides a straightforward and flexible solution for managing and displaying such single-page content.It treats the single page as a special content type, allowing us to easily create, edit, and publish it, and achieve diverse display effects through templates.

一、AnQiCMS 中单页面内容管理概览

AnQiCMS focuses the management of single-page content under the "Page ResourcesAfter opening, you will see a clear list that displays all the single pages created, along with their basic information.This interface is the starting point for creating, editing, and deleting single-page content, and the entire process is very smooth and convenient.

The main difference between a single-page and a regular article or product is that they usually do not have the concept of categories, or they themselves represent a kind of independent 'category'.This makes the management logic of a single page simpler, we do not need to set up a complex classification structure for them.

二、创建与编辑单页面内容：字段详解与实践

When you click "Add Single Page" or edit an existing page in "Page Management", you will see a series of intuitive fields that together make up the complete information of a single page:

  1. Page Name:This is the most direct identifier for a single-page, such as 'About Us'. It will be displayed in the backend management list and is also an important source of front-end page title or navigation name.
  2. Customize URL:To facilitate user memorization and search engine optimization (SEO), AnQiCMS allows you to set a friendly, pseudo-static URL for a single page. For example, set the URL of the "About Us" page to/about.html.The system will automatically generate a pinyin URL based on the page name, but you can also manually modify it to ensure its uniqueness.An clear, concise URL helps to improve the accessibility and SEO performance of the page.
  3. Single page content:This is the core of the single page, a rich text editor with rich features that allows you to easily edit text, insert images, embed videos, set formats, and more.Even, AnQiCMS also supports Markdown editor, which means you can conveniently use Markdown syntax to write content and render beautiful formatting on the front end.For static information pages, this is where you display all the details.
  4. SEO title, keywords and description:These fields are crucial for search engine optimization.
    • SEO titleUsed to tell search engines the core theme of this page, which will usually be displayed in the search results.
    • KeywordsThen is the search term you hope to obtain through this page, separated by English commas between multiple keywords.
    • Single page introductionProvide a summary description of the page, often used by search engines as a summary of search results. Filling in this information reasonably can effectively improve the visibility of a single page in search engines.
  5. Banner image and thumbnail:These are the visual elements of the page.
    • Banner imageSuitable for situations where a large background image or carousel is needed at the top of the page, adding visual appeal to the page.
    • ThumbnailIt may be used as a preview image on some list pages or when shared on social media.
  6. Display Order:When you need to display multiple single pages in a specific order on the front end (for example, in the footer navigation), this field can help you adjust their order, with lower numbers appearing earlier.
  7. Single Page Template:This is a powerful and flexible feature of AnQiCMS in single-page display. By default, all single pages will usepage/detail.htmlThis template file is for display. However, if a single page (such as "Contact Us") requires a unique layout or style, you can:
    • Create a file named in your template directorypage/contact.html(Assuming your custom URL alias iscontact) orpage/{单页ID}.htmltemplate file.
    • Then, when editing the single page in the background, enter the value in the "Single Page Template" field.contact.html. So, the page will load automatically and use the one you specifiedcontact.htmlinstead of the default templatepage/detail.htmlThis provides great freedom for designers and developers, allowing for a custom appearance for each important single page.

Section 3: Display and template calling strategy for single-page content.

In the AnQiCMS front-end template, you can call and display these single-page contents through specific tags. This mainly depends onpageDetailandpageListtwo tags.

  1. Display detailed content of a single page (pageDetail):This is the most commonly used method, usually usedpage/detail.htmlor in a custom single-page template. For example, to display the title and content of the "About Us" page:

    <h1>{% pageDetail with name="Title" %}</h1>
<div class="page-content">
    {# 注意：如果内容是HTML格式，需要使用 |safe 过滤器防止被转义 #}
    {% pageDetail pageContent with name="Content" %}{{ pageContent|safe }}
</div>

    You can also useidortokenparameters to specify the content of a specific single page, not just the content of the current page. For example, to call the introduction of "About Us" on the homepage of a website:

    {% pageDetail aboutUs with name="Description" token="about-us" %}
<p>{{ aboutUs }}</p>

  2. List multiple single-page information ("),pageList):When you need to list multiple single-page links in the footer, sidebar, or other navigation areas of a website,pageListThe label comes in handy. For example, display links such as 'About Us', 'Contact Us', and 'Privacy Policy' in the footer:

    <ul>
{% pageList pages %}
    {% for item in pages %}
        {# 可以根据页面ID或自定义URL别名排除不需要的页面 #}
        {% if item.Id != 999 and item.Link != "/some-excluded-page.html" %}
        <li><a href="{{ item.Link }}">{{ item.Title }}</a></li>
        {% endif %}
    {% endfor %}
{% endpageList %}
</ul>

    This tag will get all the single pages created, and you can filter and sort according toitem.Idoritem.Linkthese fields to meet the needs of front-end display.

Through the above management and calling methods, AnQiCMS provides us with a powerful and flexible platform that can efficiently handle all kinds of single-page content on the website. Whether it is a simple information display or a special page requiring unique design, it can handle it with ease.

Common Questions (FAQ)

1. Can I design a completely different layout for each single page?Yes, AnQiCMS provides high flexibility. You can specify a custom template file in the "Single Page Template" field when editing a single page in the backend (for exampledownload.htmlormy-unique-about-page.html）。Only if this template file exists in your theme directory (such astemplate/your_theme/page/my-unique-about-page.htmlThis single page will be loaded and rendered using the template you specify. This allows you to implement fully customized designs for each important single page.

2. Does the single-page content editor support image upload and formatting?Of course, it supports.AnQiCMS Back-end single page content editor is a rich text editor.You can directly upload images, insert videos, and perform various formatting operations such as bold, italic, lists, and quotes in the editor.In addition, if the Markdown editor is enabled, you can also use Markdown syntax to quickly write and format content.The editor also supports referencing images that have been uploaded to the image resource management.

3. If my single-page content is not displayed correctly or the style is messed up, what should I check?Firstly, confirm that the template name you entered in the "Single Page Template" field in the background is correct, and that the template file indeed exists in your theme directory. Secondly, if the content is in HTML format, make sure to use in the template.{% pageDetail pageContent with name="Content" %}{{ pageContent|safe }}This way of calling, in which|safeThe filter is required, it tells AnQiCMS not to escape the content with HTML.If the style is混乱, it is likely that the CSS file has not been loaded correctly. Check whether the path to the CSS file referenced in the template is correct, or whether there are conflicting rules with the global style in the custom template.