如何获取并显示网站的联系人、电话、地址和邮箱等联系方式？

在网站运营中，清晰、易于查找的联系方式是建立用户信任、促进沟通转化的关键要素。无论是寻求合作的伙伴，还是需要帮助的用户，都能通过网站上提供的联系方式快速找到您。安企CMS（AnQiCMS）在联系方式的管理和展示上提供了灵活且便捷的功能，让您可以轻松地获取并显示包括联系人、电话、地址、邮箱等各类联系信息。

一、在后台集中管理您的联系方式

安企CMS将网站的联系方式集中管理，方便您统一配置和更新。所有与网站相关的联系信息都可以在后台的“后台设置”菜单下的“联系方式设置”页面进行配置。

在这个页面中，您会看到一系列预设的常用联系字段，例如：

  • 联系人（UserName）：通常是您希望对外展示的联系姓名。
  • 联系电话（Cellphone）：您的主要联系电话，用户可以通过点击拨打。
  • 联系地址（Address）：公司的详细地址，方便用户导航或寄送物品。
  • 联系邮箱（Email）：用于接收用户邮件的地址。
  • 微信号（Wechat）：方便用户添加您的个人或企业微信。
  • 微信二维码（Qrcode）：直接展示二维码，用户扫码即可添加。
  • 此外，还有QQ、WhatsApp、Facebook、Twitter、Tiktok等多种社交媒体联系方式。

如果这些默认字段无法满足您的业务需求，安企CMS还提供了强大的“自定义设置参数”功能。您可以根据需要添加任何新的联系方式，比如“客服热线”、“在线咨询链接”或特定业务负责人等。在添加自定义参数时，您需要设置一个“参数名”作为在模板中调用的标识（建议使用英文或拼音，例如ServiceHotline），并填写对应的“参数值”（实际的联系信息）。这极大地提升了联系方式展示的灵活性。

二、在前台模板中调用并展示联系方式

当您在后台完成了联系方式的设置后，接下来便是在网站的前端页面上进行调用和展示。安企CMS为此提供了一个专门的模板标签——contact标签，它的使用方式非常直观和灵活。

contact标签的基本语法是：{% contact [变量名称] with name="字段名称" %}。

  • name参数是您需要关注的核心，它对应着后台“联系方式设置”中字段的英文标识（例如UserName、Cellphone、Address、Email等），或者是您自定义参数时设置的“参数名”。
  • 您可以选择性地为获取到的联系信息指定一个“变量名称”（例如myContactPerson），这样在后续的模板代码中，就可以通过{{myContactPerson}}来多次引用这个值，使代码更整洁。如果不需要重复引用，也可以省略变量名称，直接在标签内部获取并输出。

让我们看几个常用的例子：

  1. 展示联系人姓名： 如果想在页面上显示联系人姓名，您可以这样调用：

    {% contact with name="UserName" %}

    或者将其赋值给一个变量后输出：

    {% contact myContactPerson with name="UserName" %}
<span>联系人：{{ myContactPerson }}</span>

  2. 显示联系电话并添加拨号链接： 联系电话不仅要显示出来，通常还需要方便用户直接点击拨打。

    {% contact contactPhone with name="Cellphone" %}
电话：<a href="tel:{{ contactPhone }}" rel="nofollow">{{ contactPhone }}</a>

    这里，rel="nofollow"属性有助于告诉搜索引擎这是一个用户可点击但非推荐的链接。

  3. 展示公司地址： 直接在页面上显示您的详细地址：

    {% contact with name="Address" %}

  4. 显示联系邮箱并添加发邮件链接： 与电话类似，邮箱也常被设置为可点击的mailto链接。

    {% contact contactEmail with name="Email" %}
邮箱：<a href="mailto:{{ contactEmail }}" rel="nofollow">{{ contactEmail }}</a>

  5. 展示微信二维码： 如果您上传了微信二维码，可以通过以下方式显示：

    {% contact wechatQR with name="Qrcode" %}
{% if wechatQR %} {# 建议添加判断，如果后台未上传二维码则不显示 #}
微信扫码：<img src="{{ wechatQR }}" alt="微信二维码" style="width: 120px; height: 120px;">
{% endif %}

  6. 调用自定义联系方式（以WhatsApp为例）： 假设您在后台自定义了一个WhatsApp字段。

    {% contact whatsappNumber with name="WhatsApp" %}
{% if whatsappNumber %}
WhatsApp：<a href="https://wa.me/{{ whatsappNumber }}" target="_blank" rel="nofollow">{{ whatsappNumber }}</a>
{% endif %}

    这里通过{% if whatsappNumber %}判断，确保只有在后台设置了WhatsApp号码时，前端才会显示这部分内容，避免空内容显示。

三、将联系方式整合到网站页面

通常，网站的联系方式会显示在页脚、顶部导航栏的“联系我们”页面中，或者单独的侧边栏模块。您可以根据网站的整体设计和用户习惯，将上述标签组合起来。

这是一个将多种联系方式整合在一个“联系我们”区域的示例：

<div class="contact-info-block">
    <h3>联系我们</h3>
    <ul>
        <li>
            <strong>联系人：</strong> {% contact with name="UserName" %}
        </li>
        <li>
            <strong>电话：</strong> <a href="tel:{% contact with name="Cellphone" %}" rel="nofollow">{% contact with name="Cellphone" %}</a>
        </li>
        <li>
            <strong>地址：</strong> {% contact with name="Address" %}
        </li>
        <li>
            <strong>邮箱：</strong> <a href="mailto:{% contact with name="Email" %}" rel="nofollow">{% contact with name="Email" %}</a>
        </li>
        {% contact wechatAccount with name="Wechat" %}
        {% if wechatAccount %}
        <li>
            <strong>微信号：</strong> {{ wechatAccount }}
        </li>
        {% endif %}
        {% contact wechatQR with name="Qrcode" %}
        {% if wechatQR %}
        <li>
            <strong>微信扫码：</strong>
            <img src="{{ wechatQR }}" alt="微信二维码" style="width: 100px; height: 100px;">
        </li>
        {% endif %}
        {% contact customHotline with name="ServiceHotline" %} {# 假设后台自定义了"ServiceHotline" #}
        {% if customHotline %}
        <li>
            <strong>客服热线：</strong> {{ customHotline }}
        </li>
        {% endif %}
    </ul>
</div>

通过上述方法，您可以轻松地在安企CMS中管理和展示网站的各项联系信息，为用户提供便捷的沟通渠道。灵活的后台配置和简单的模板调用标签，使得网站维护者能够高效地应对业务变化，随时更新联系方式，保持网站信息的准确性。

常见问题 (FAQ)