如何在网站上展示所有或部分单页面列表？

在网站运营中，我们经常需要展示一些独立的、内容相对固定不变的页面，例如“关于我们”、“联系方式”或者某些政策说明等。在安企CMS中，这些被称为“单页面”。有效管理和展示这些单页面，不仅能让网站结构更清晰，也能提升用户体验。

接下来，我们将一起探讨如何在网站上灵活地展示所有或部分单页面列表。

一、理解单页面的创建与管理（后台操作）

在开始前端展示之前，首先要确保已经在安企CMS的后台创建并完善了相应的单页面内容。

1. 进入页面管理： 登录安企CMS后台，您可以在左侧导航栏找到“页面资源”下的“页面管理”选项。
2. 创建或编辑单页面： 在这里，您可以添加新的单页面，也可以编辑已有的单页面。每个单页面都包含以下核心信息：
   • 页面名称： 这是单页面的标题，也会直接显示在前端。
   • 自定义URL： 为了SEO友好和链接美观，建议为每个单页面设置一个简洁有意义的自定义URL（例如，about-us、contact）。当您的伪静态规则中包含{filename}字段时，这个自定义URL就会生效。
   • 单页面内容： 这是页面的主体内容，您可以利用富文本编辑器进行编辑，支持图文混排。
   • SEO信息（标题、关键词、描述）： 针对每个单页面，您可以单独设置其SEO标题、关键词和描述，以帮助搜索引擎更好地理解和收录页面内容。
   • 显示顺序： 通过调整显示顺序的数字，可以控制单页面在列表中的默认排列。数字越小，越靠前。
   • 单页面模板： 这是一个非常强大的功能。默认情况下，单页面会使用page/detail.html这个通用模板。但如果您希望某个单页面拥有独特的设计，可以在后台指定一个自定义模板文件（例如，为“关于我们”页面指定about.html，只要该文件存在于您的模板page目录下）。

完成单页面的创建和内容填充后，我们就可以着手在网站前端展示它们了。

二、在网站上展示所有单页面列表

如果您希望在一个区域（比如页脚导航或者侧边栏）展示所有已发布的单页面，安企CMS提供了简洁的模板标签pageList来实现。

pageList标签会获取您所有已创建的单页面数据。在模板文件中，您可以这样使用它：

<ul>
{% pageList pages %}
    {% for item in pages %}
    <li>
        <a href="{{ item.Link }}">{{ item.Title }}</a>
    </li>
    {% endfor %}
{% endpageList %}
</ul>

代码解读：

• {% pageList pages %}：这是核心标签，它会从数据库中获取所有单页面数据，并将这些数据赋值给名为pages的变量。
• {% for item in pages %}：我们使用一个for循环来遍历pages变量中的每一个单页面，每个单页面的数据都会在循环中通过item变量访问。
• {{ item.Link }}：这会输出当前单页面的访问链接。
• {{ item.Title }}：这会输出当前单页面的标题。

通过这个简单的代码片段，您的网站就能动态地展示所有单页面的列表。

三、灵活展示部分单页面列表

有时候，我们并不需要展示所有的单页面，或者希望对某些单页面进行特殊的处理。安企CMS提供了多种灵活的方式来实现这一目的。

1. 通过模板逻辑进行筛选和排除

您可以在for循环中使用if条件判断来筛选或排除特定的单页面。例如，如果您想排除ID为1的单页面：

<ul>
{% pageList pages %}
    {% for item in pages %}
    {% if item.Id != 1 %} {# 假设ID为1的单页面不想展示 #}
    <li>
        <a href="{{ item.Link }}">{{ item.Title }}</a>
    </li>
    {% endif %}
    {% endfor %}
{% endpageList %}
</ul>

您还可以根据标题或其他字段进行筛选：

<ul>
{% pageList pages %}
    {% for item in pages %}
    {# 仅展示标题包含“关于”的单页面 #}
    {% if item.Title|contain:"关于" %} 
    <li>
        <a href="{{ item.Link }}">{{ item.Title }}</a>
    </li>
    {% endif %}
    {% endfor %}
{% endpageList %}

这里我们使用了contain过滤器（参考filter-contain.md），它能判断字符串是否包含特定关键词。

2. 展示特定单页面的详情内容

如果您想在网站的某个特定区域直接展示某个单页面的内容，而不是列表链接，可以使用pageDetail标签。这个标签允许您通过ID或自定义URL别名精确获取单个单页面的详细信息。

例如，在首页直接展示“关于我们”页面的简介：

<div class="about-us-summary">
    <h2>{% pageDetail with name="Title" token="about-us" %}</h2>
    <p>{% pageDetail with name="Description" token="about-us" %}</p>
    <a href="{% pageDetail with name="Link" token="about-us" %}">了解更多</a>
</div>

代码解读：

• {% pageDetail with name="Title" token="about-us" %}：通过自定义URL别名about-us获取该单页面的标题。
• {% pageDetail with name="Description" token="about-us" %}：获取该单页面的描述。
• {{ item.Content|safe }}：如果需要显示完整的内容（可能包含HTML），请务必使用|safe过滤器，以防止HTML内容被转义（参考filter-safe.md）。

3. 利用后台的“单页面模板”功能实现特定设计

如前文所述，在后台编辑单页面时，您可以为它指定一个独立的模板文件。这意味着，当用户访问这个单页面时，系统会自动加载您指定的模板，从而实现完全个性化的设计。

例如，为ID为5的“联系我们”页面指定模板文件contact.html，那么您只需要确保template/你的模板目录/page/contact.html文件存在，并且在后台的“页面管理”中，该单页面的“单页面模板”字段填写为contact.html即可。

四、重要提示与**实践

• 模板文件位置： 默认的单页面详情模板是template/你的模板目录/page/detail.html。如果您自定义了单页面模板（例如contact.html），它应该放在template/你的模板目录/page/目录下。
• 伪静态规则： 确保您的网站伪静态规则包含了单页面的规则，通常是page===/{filename}.html或类似的形式，这样才能生成友好的URL（参考help-plugin-rewrite.md）。
• SEO优化： 充分利用后台单页面的SEO标题、关键词和描述字段，为每个单页面做好独立的SEO优化。
• 显示顺序： 在后台的“页面管理”中，通过调整“显示顺序”字段，可以方便地控制单页面在列表中的默认排序。
• 多站点支持： 如果您使用了安企CMS的多站点管理功能，并且希望调用其他站点的数据，可以在pageList或pageDetail标签中添加siteId参数来指定（例如{% pageList pages with siteId="2" %}）。

通过上述方法，您可以灵活地在安企CMS网站上展示所有或特定部分的单页面列表，满足不同场景下的展示需求。

常见问题（FAQ）

1. 如何调整单页面在列表中的显示顺序？ 您可以在安企CMS后台的“页面资源”->“页面管理”中，编辑每个单页面，找到“显示顺序”字段。通过设置不同的数字来控制排序，数字越小，该单页面在列表中就会越靠前显示。

2. 我的单页面内容包含HTML代码，但前端显示时被转义了怎么办？ 当您在前端模板中输出单页面内容（例如{{ item.Content }}或{% pageDetail with name="Content" %}）时，如果内容中包含HTML标签，为了安全考虑，系统默认会对其进行转义。如果您确认这些HTML内容是安全的，并希望它们正常解析显示，请在输出时添加|safe过滤器，例如：{{ item.Content|safe }}。

3. 我想为某个单页面设计完全不同的布局，安企CMS能实现吗？ 当然可以。在后台编辑该单页面时，有一个“单页面模板”字段。您可以在这里填写一个自定义的模板文件路径（例如about_us_custom.html），并确保这个文件存在于您的模板page目录下（例如template/default/page/about_us_custom.html）。这样