如何获取并显示后台设置的联系人、电话、邮箱、微信等联系方式?

大家好,作为一名资深的安企CMS运营人员,我深知网站上清晰、便捷的联系方式对于用户体验和业务转化至关重要。今天,我们就来详细探讨如何在安企CMS的后台配置联系信息,并将其灵活、准确地展示在网站前端的各个位置。

配置网站联系方式:后台操作指南

在安企CMS中,管理网站的联系方式是一个直观且功能强大的过程。首先,我们需要进入后台管理界面进行配置。

要访问联系方式设置,请登录安企CMS后台,通过左侧导航栏找到“后台设置”菜单,然后点击“联系方式设置”子菜单。在这里,您会看到一系列默认的联系信息设置项,包括联系人、联系电话、联系地址、联系邮箱、微信号和微信二维码等。这些字段旨在满足大多数企业网站的基本需求。

您只需在相应的输入框中填入您的联系信息即可。例如,在“联系人”字段中填写您的联系姓名,在“联系电话”中输入您的业务电话。如果您的微信二维码已准备好,可以直接点击上传按钮上传图片。

值得一提的是,安企CMS还提供了高度的灵活性,允许您根据网站的特定需求添加自定义联系方式。在“自定义设置参数”区域,您可以点击“添加”按钮,创建新的联系方式字段,例如“WhatsApp联系方式”、“Skype账号”或“备用邮箱”等。您需要为每个自定义参数设定一个“参数名”作为模板调用的标识(建议使用英文),并填写对应的“参数值”。最后,您可以添加“备注”以方便日后管理和理解该参数的用途。完成所有信息的填写和调整后,务必点击保存按钮,确保更改生效。

在网站前端显示联系方式:模板调用实战

一旦联系方式在后台配置完毕,下一步就是在网站模板中正确地引用并展示这些信息。安企CMS为此提供了专门的“联系方式标签”(contact),使得模板开发者可以轻松地获取这些数据。

调用默认联系方式字段

contact 标签的使用方式非常简洁,您可以使用 {% contact 变量名称 with name="字段名称" %} 的形式来获取特定字段的值。如果省略变量名称,标签会直接输出字段内容。

以下是几个常用联系方式字段的调用示例,您可以将其放置在网站的页眉、页脚、“联系我们”页面或任何需要展示联系信息的位置:

要显示联系人姓名,您可以使用:

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

如果需要显示联系电话,可以这样编写:

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

这里我们额外添加了 tel: 协议,方便移动设备用户点击直接拨号,并使用了 rel="nofollow" 属性。

显示联系邮箱:

<span>联系邮箱:<a href="mailto:{% contact with name="Email" %}">{% contact with name="Email" %}</a></span>

同样,mailto: 协议能够让用户点击直接发送邮件。

展示微信号:

<span>微信号:{% contact with name="Wechat" %}</span>

对于微信二维码这类图片资源,您需要将其作为图片的 src 属性来引用,并注意使用 safe 过滤器以确保HTML代码的正确输出:

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

通过这种方式,后台上传的微信二维码图片就能在前端正常显示了。

调用自定义联系方式字段

如果您在后台自定义了新的联系方式字段,例如之前提到的“WhatsApp联系方式”,其“参数名”为 WhatsApp,那么在模板中调用它的方式与默认字段类似,只需将 name 参数值替换为您的自定义参数名即可:

<span>WhatsApp联系方式:{% contact with name="WhatsApp" %}</span>

多站点环境下的联系方式调用

对于部署了多个站点的安企CMS系统,如果您希望在某个站点的模板中调用其他站点的联系方式,可以使用 siteId 参数来指定站点ID。例如,调用ID为2的站点的联系电话:

<span>其他站点电话:{% contact with name="Cellphone" siteId="2" %}</span>

然而,在大多数情况下,您会在当前站点的模板中显示当前站点的联系信息,此时无需指定 siteId 参数。

内容优化与实践建议

在展示联系方式时,除了确保技术上的正确调用,内容的呈现方式也同样重要。

首先,请确保您的联系信息是最新的、准确无误的。过期或错误的联系方式会让用户感到困惑和沮丧,严重影响用户体验。定期检查这些信息,特别是在业务调整或人员变动之后。

其次,将联系方式放置在用户易于找到的位置。网站的页眉和页脚是常见的首选,因为它们在每个页面都可见。同时,创建一个独立的“联系我们”页面,提供更详细的联系表单、地图和所有联系渠道,会进一步提升用户的信任感和便利性。

最后,考虑到不同用户群体的需求,尽可能提供多样化的联系方式。例如,除了电话和邮箱,微信、WhatsApp、在线客服等都能满足不同用户的使用习惯。确保这些链接都可点击,并能引导用户到正确的沟通渠道。

常见问题解答 (FAQ)

1. 为什么我在后台设置了联系方式,但前端页面没有显示?

这通常是由于模板中未正确使用 contact 标签进行调用,或者模板缓存未及时更新所致。请检查您的模板文件是否包含了相应的 {% contact ... %} 标签,并确保 name 参数与后台设置的字段名称(包括自定义字段)完全匹配。如果标签使用无误,请尝试清除安企CMS的系统缓存,确保最新的数据能够被加载。

2. 我能否让不同的页面显示不同的联系方式?

contact 标签获取的是全站通用的联系方式设置,无法直接根据页面动态变化。如果您需要在特定页面展示独特的联系方式,可以考虑在页面的内容编辑器中直接插入文字或图片,或者通过“单页面”功能创建独立的联系页面,并在内容中嵌入所需信息。另一种高级方法是利用自定义字段,针对特定页面在后台内容模型中添加额外的联系方式字段,并在该页面的模板中调用。

3. 如何在联系电话或邮箱上添加点击拨号/发送邮件的功能?

您可以在模板中使用HTML的 tel:mailto: 协议来实现。例如,对于电话:<a href="tel:{% contact with name="Cellphone" %}" rel="nofollow">{% contact with name="Cellphone" %}</a>。对于邮箱:<a href="mailto:{% contact with name="Email" %}">{% contact with name="Email" %}</a>。这些协议能够让用户在支持的设备上点击链接后直接拨打电话或启动邮件客户端。