How to display the complete content and all fields of a single page?

In the Anqi CMS, a single page is the basis for building static content pages such as "About Us" and "Contact InformationFully display the complete content of these pages and all field information, which is crucial for website customization and user experience.The AutoCMS provides intuitive and powerful template tags, allowing you to easily display single-page data configured on the backend on the website front end.

To display the full content of a single page and all related fields, we mainly usepageDetailThis core template tag. This tag helps us get detailed data of a specified single page and display it flexibly in the template.

UnderstandingpageDetailBasic usage of the tag

pageDetailThere are two main ways to use tags.You can choose to get the value of a specific field on a single page, or you can assign the entire single page object to a variable and then access its various fields through this variable.

If your page is already a single page detail page and you want to display the information of the current page, usually no additional ID needs to be specified,pageDetailLabels will automatically identify the context of the current page. Of course, if you need to display information of a specified ID or URL alias on a single page, you can also do so by addingidortokenParameters to achieve precise calls.

For example, to directly display the title of the current single page, you can write like this:{% pageDetail with name="Title" %}.currentPageThe variable can be operated as follows:{% pageDetail currentPage %}. Next, you can access the data of this single page through:currentPage.Title/currentPage.Contentand other forms to access the various data items of this single page.

Displays the core content and basic information of the single page.

An English single page usually contains title, description, content, and other basic constituent elements. The Anqi CMS provides a clear calling method for these core fields.

• Page Title (Title)This is the main title of the single page, usually displayed at the top of the page or in the browser tab. You can use{% pageDetail with name="Title" %}to get.
• Page content (Content)This is the main content of a single page, which often includes rich text, images, videos, and other rich media information. When using{% pageDetail with name="Content" %}be sure to coordinate|safeFilter usage to ensure that HTML content is correctly parsed by the browser rather than escaped as plain text. If your content is written in Markdown format, you can also add extrarender=trueparameter, such as{% pageDetail with name="Content" render=true %}English version: In order to convert it correctly to HTML.
• DescriptionEnglish version: This is usually a brief summary of the page, which is helpful for SEO optimization. It can be accessed through{% pageDetail with name="Description" %}retrieved.
• English version: Page Link (Link)：Get the complete URL of a single page, convenient for creating jump links in templates. The calling method is{% pageDetail with name="Link" %}.

In addition to these, you can display the unique identifier of a single pageId({% pageDetail with name="Id" %}), and used for customizing pseudo-static URLs自定义URL (token).

Handle image and multimedia fields

The single page may also include images, such as banner images at the top of the page or as thumbnails.

• Page Thumbnail (Thumb / Logo)If a thumbnail is set for a single page, you can access it through{% pageDetail with name="Thumb" %}or{% pageDetail with name="Logo" %}Get image address. These fields are usually used for list display or as representative images on the page.
• Page slideshow (Images)：Some single-page applications may need to display a set of images as a carousel or gallery.Imagesfield will return an array of image addresses. You need to combineforloop tags to iterate over and display these images.

  
  {% pageDetail pageImages with name="Images" %}
  {% for item in pageImages %}
      <img src="{{ item }}" alt="图片描述" />
  {% endfor %}
  

  If you only want to get the first picture, you can use array indexing to do so:{% set firstImage = pageImages[0] %}.

Custom template related to SEO fields

The Anqi CMS allows for independent templates to be set for single pages, as well as for detailed SEO optimization.

• Single Page TemplateAn independent template file has been specified for a specific single page in the background (for example,download.htmlAfter that, the system will use this template first. This means you cantemplate/page/directory createdownload.htmla file, and write unique layout and style for this single page.

• SEO Title (SeoTitle)/Keywords (Keywords)These fields are used to optimize search engine crawling and ranking. AlthoughpageDetailtags can be used to retrieve this information separately, but it is more recommended to usetdkLabels to unify management and output of the pagetitle/keywordsanddescriptionbecausetdkLabels will intelligently combine and display these information according to the current page type (including single page) and can also attach the website name and so on.

  For example, in yourbase.htmlTemplate file's<head>Area, you may have set similar TDK tags as these, which will intelligently retrieve and display relevant information based on the type of the current page:

  <title>{% tdk with name="Title" siteName=true %}</title>
  <meta name="keywords" content="{% tdk with name="Keywords" %}">
  <meta name="description" content="{% tdk with name="Description" %}">
  

Summary

PasspageDetailTags, you can easily access and display various information of the Aigle CMS single page, whether it is basic content, images, or SEO-related metadata.In practical operation, the key is to selectively call these fields according to your design requirements, and combine them with the loop, conditional judgment, and filter of the template engine to build a single page that is both beautiful and practical.Effectively utilizing these tools will make your website content management and display more efficient.

---

Common Questions (FAQ)

1. Why does my single-page content (Content) display a pile of HTML code instead of formatted text?This is usually because you directly output in the templateContentField, instead of using|safeFilter.The default auto CMS will escape the output HTML content to prevent XSS attacks.Contentwhen adding the field|safeFilter, for example:{{ currentPage.Content|safe }}. If the content is in Markdown format, ensure that Markdown rendering is enabled and userender=trueParameter.

2. How to set a unique layout for a specific "About Us" single page that differs from other single pages?You can find the 'Single Page Template' setting option in the 'Other Parameters' section when editing the 'About Us' single page in the AnQi CMS backend. Here, fill in the custom template filename you want, for example,about.html。Then, in your theme template folder (usually/template/您的主题名/page/directory) createabout.htmlThis file, and write its content according to your design requirements. In this way, only this specific single page will use the specifiedabout.htmltemplate, while other single pages will still follow the defaultpage/detail.htmltemplates.

3. How to ensure that the images in my single-page content are displayed correctly and support lazy loading?Single-page content images are usually inserted through a content editor, by default they are stored as part of HTML.ContentThe first step to ensure that these images are displayed correctly is to use them correctly as mentioned in question 1.|safeFilter. If you need lazy loading functionality, you may need to include a JavaScript library that supports lazy loading in your template. When callingContenta field, you can try addinglazy="data-src"Parameters such as{% pageDetail with name="Content" lazy="data-src" %}This will notify the security CMS to render content accordinglysrcattribute in the content withdata-src(or any other attributes required by the lazy loading library you specify), thus coordinating with the front-end lazy loading script to achieve the effect.