AnQiCMS模板中`contact`标签如何获取后台配置的联系方式信息？

作为安企CMS的资深网站运营人员，我深知内容在网站建设和用户互动中的核心地位。有效、便捷地展示联系方式，是网站功能不可或缺的一部分，它直接影响到用户与企业沟通的效率和意愿。在AnQiCMS中，我们为此提供了简洁而强大的模板标签——contact，让您能够轻松地将后台配置的联系方式信息呈现在网站前端。

在AnQiCMS模板中获取后台配置的联系方式信息

AnQiCMS提供了一个名为contact的模板标签，专门用于从后台管理系统中获取并展示您预设的联系方式信息。这个标签的设计理念是最大化灵活性和易用性，确保即使是非技术背景的运营人员也能轻松管理和更新网站的联系信息，而无需修改任何模板代码。

后台联系方式的配置

在AnQiCMS的管理后台，您可以通过导航至“后台设置”下的“联系方式设置”区域来配置您的联系信息。这里不仅包含了一系列默认的联系字段，如联系人、联系电话、联系地址等，还允许您根据实际需求自定义额外的联系参数。例如，如果您希望在网站上展示WhatsApp账号或Facebook主页链接，便可以在此区域添加自定义字段及其对应的值。

contact标签的基本用法

contact标签的通用使用方法是 {% contact 变量名称 with name="字段名称" %}。

  • 变量名称是一个可选参数，如果您提供，那么获取到的联系信息值将被存储在这个变量中，您可以在后续的模板代码中通过{{变量名称}}来引用。如果您省略变量名称，那么contact标签将直接输出对应字段的值。
  • name="字段名称"是指定您想要获取的联系信息字段的关键参数。这个“字段名称”需要与后台配置中的参数名精确匹配。

让我们通过一些具体的例子来了解如何获取这些信息。

获取内置的联系方式字段

AnQiCMS预设了多种常见的联系方式字段，可以直接通过name参数进行调用。

  • 联系人 (UserName)

    <p>联系人：{% contact with name="UserName" %}</p>
{# 存储到变量再使用 #}
{% contact contactPerson with name="UserName" %}
<p>我们的联系人：{{ contactPerson }}</p>

  • 联系电话 (Cellphone)

    <p>联系电话：{% contact with name="Cellphone" %}</p>
<a href="tel:{% contact with name="Cellphone" %}">立即致电</a>

  • 联系地址 (Address)

    <p>公司地址：{% contact with name="Address" %}</p>

  • 联系邮箱 (Email)

    <p>邮箱：{% contact with name="Email" %}</p>
<a href="mailto:{% contact with name="Email" %}">发送邮件</a>

  • 微信账号 (Wechat)

    <p>微信：{% contact with name="Wechat" %}</p>

  • 微信二维码 (Qrcode) 如果后台配置了微信二维码图片，您可以通过以下方式获取其URL并显示：

    <img src="{% contact with name="Qrcode" %}" alt="微信二维码" />

  • 社交媒体链接 (例如 QQ, WhatsApp, Facebook, Twitter, Tiktok, Pinterest, Linkedin, Instagram, Youtube) AnQiCMS也内置了常见的社交媒体字段，您可以按需调用：

    <p>我们的QQ：{% contact with name="QQ" %}</p>
<a href="https://wa.me/{% contact with name="WhatsApp" %}" target="_blank">WhatsApp联系</a>
<a href="{% contact with name="Facebook" %}" target="_blank">访问Facebook</a>

获取自定义的联系方式字段

AnQiCMS的强大之处在于其可扩展性。如果在后台的“联系方式设置”中，您通过“自定义设置参数”添加了新的联系字段（例如，您可能添加了一个名为“客服热线”的参数），那么在模板中，您也可以通过该参数名来获取其值。

假设您在后台自定义了一个参数名为 ServiceHotline，其参数值为 400-123-4567。

在模板中，您可以这样调用：

<p>客服热线：{% contact with name="ServiceHotline" %}</p>

请注意，自定义参数的名称在模板中调用时必须与后台设置中的“参数名”保持一致。

多站点环境下的siteId参数

对于那些运营多个AnQiCMS站点的用户，如果需要在一个站点的模板中显示另一个站点配置的联系方式，可以使用siteId参数。

例如，要获取ID为2的站点的联系电话：

<p>子站点联系电话：{% contact with name="Cellphone" siteId="2" %}</p>

通常情况下，如果您只管理单个站点，或只需要获取当前站点的联系信息，可以忽略siteId参数。

综合应用示例

在网站的页脚或“联系我们”页面，您可能需要统一展示所有联系信息。以下是一个简单的示例，演示如何将多个联系方式整合到一起：

<div class="contact-info">
    <h3>联系我们</h3>
    <ul>
        <li>
            <i class="fa fa-user"></i>
            <span>联系人：{% contact with name="UserName" %}</span>
        </li>
        <li>
            <i class="fa fa-phone"></i>
            <span>电话：<a href="tel:{% contact with name="Cellphone" %}">{% contact with name="Cellphone" %}</a></span>
        </li>
        <li>
            <i class="fa fa-envelope"></i>
            <span>邮箱：<a href="mailto:{% contact with name="Email" %}">{% contact with name="Email" %}</a></span>
        </li>
        <li>
            <i class="fa fa-map-marker"></i>
            <span>地址：{% contact with name="Address" %}</span>
        </li>
        {% contact wechatAccount with name="Wechat" %}
        {% if wechatAccount %}
        <li>
            <i class="fa fa-wechat"></i>
            <span>微信：{{ wechatAccount }}</span>
        </li>
        {% endif %}
        {% contact whatsappLink with name="WhatsApp" %}
        {% if whatsappLink %}
        <li>
            <i class="fa fa-whatsapp"></i>
            <span>WhatsApp：<a href="https://wa.me/{{ whatsappLink }}" target="_blank">{{ whatsappLink }}</a></span>
        </li>
        {% endif %}
        {# 假设您自定义了一个名为`BusinessHours`的字段 #}
        {% contact businessHours with name="BusinessHours" %}
        {% if businessHours %}
        <li>
            <i class="fa fa-clock-o"></i>
            <span>营业时间：{{ businessHours }}</span>
        </li>
        {% endif %}
    </ul>
</div>

通过这种方式，您可以创建一个结构清晰、易于维护的联系信息展示区域。当联系方式发生变化时，只需在AnQiCMS后台进行更新，前端页面便会自动同步显示，极大地提高了运营效率。

常见问题解答 (FAQ)

  1. 我修改了后台的联系方式，但是网站前台没有立即更新，这是为什么？ AnQiCMS为了提高网站性能，通常会使用缓存机制。在您修改后台配置后，可能需要手动清除系统缓存才能让前台立即显示最新的信息。您可以在AnQiCMS后台找到“更新缓存”或类似的选项进行操作。如果清除了缓存后仍未更新，请检查您是否在正确的站点（如果是多站点环境）修改了配置，或者浏览器缓存是否导致了旧内容的显示，尝试清除浏览器缓存或使用无痕模式访问。

  2. 我添加了一个自定义联系方式，但是在模板中调用时总是显示为空，我该如何排查？ 首先，请仔细核对您在模板中contact标签的name参数值，确保它与您在后台“联系方式设置”中添加的自定义参数的“参数名”完全一致，包括大小写。AnQiCMS的模板标签是区分大小写的。其次，确认该自定义参数在后台确实有值。如果仍然有问题，检查服务器日志或AnQiCMS的错误日志，可能会提供更详细的错误信息。

  3. contact标签可以获取除了文本之外的格式（比如HTML）吗？ contact标签主要用于获取纯文本或图片URL等简单数据。如果您在后台的自定义字段中输入了HTML内容，并且希望前端能够解析并渲染这些HTML，您可能需要在使用{{变量名称}}输出时加上|safe过滤器，例如{{ contactDescription|safe }}。但这需要谨慎操作，以防止潜在的XSS安全风险。对于微信二维码这类输出图片URL的字段，通常直接作为<img>标签的src属性值使用，不需要|safe过滤器。