How to dynamically display the company contact information for the contact label `contact`?

In the operation of a website, clear, accurate, and easy-to-update business contact information is a crucial element.Imagine if you need to update your contact phone number or email, do you have to manually modify every web page that contains this information?This not only takes time and effort, but may also lead to inconsistent information due to omissions, affecting user experience and brand image.

AnQiCMS is well-versed in this field, and to address this pain point, it has specially providedContact Information Tagcontact.The cleverness of this tag lies in its ability to dynamically display your business contact information, meaning all contact information displayed on the website is centrally managed and updated with a single click, completely saying goodbye to繁琐的手动修改.

Core Advantages: Why ChoosecontactTags?

UsecontactLabel to manage enterprise contact information, mainly has the following significant advantages:

  1. Centralized management, one-click updateAll contact information is stored in a unified location in the background.No matter how many pages on your website reference this information, you only need to modify it once in the backend, and all front-end pages will be synchronized updated, greatly enhancing operational efficiency.
  2. Ensure information consistencyThrough centralized management, it can effectively avoid inconsistent information issues caused by manual modifications, ensuring that users can obtain the latest and most accurate contact information at any corner of the website.
  3. Independence of topics and templates[en] Your contact information is no longer hard-coded in the template file. This means you can freely change the website theme without worrying about losing contact information or needing to reconfigure, as long as the new template correctly calls it.contactTags, information can be automatically adapted.
  4. High scalability【en】Besides the preset contact methods in the system, you can also customize more contact fields according to your business needs and easily call them in the template.

【en】Background Configuration: Information Source Management

To dynamically display contact information, you first need to configure it in the AnQiCMS backend.Navigate to the 'Contact Settings' page under 'Background Settings', where you will see an intuitive management interface.

System provides a series of commonly used fields, such as: contact person (UserName) contact number (Cellphone) contact address (Address) contact email (Email) WeChat ID (Wechat）、WeChat QR code（Qrcode）etc. These fields can be filled in with your company information.

It is even more powerful that when the default fields cannot meet your personalized needs, Anqi CMS allows you toCustomize settings parametersFor example, if your business still needs to display WhatsApp contact information, you can add a parameter named "WhatsApp contact information" in the custom parameters.WhatsAppFill in your WhatsApp account. This way, this custom contact method can be called like an integrated field.

Template call:contactUse of tags

Once the background configuration is completed, it becomes very simple to call these contact information in the website template.contactThe basic format for using tags is:

{% contact 变量名称 with name="字段名称" %}

Here are some key points:

  • 变量名称[en]Is optional, if you do not set the variable name, the label will directly output the value of the field. If a variable name is set (for examplemyPhone), then the value of this field will be assigned tomyPhoneVariable, you can use it in the template code later{{myPhone}}to use.
  • name="字段名称"This is the specific contact method field you want to call.This field name must match the parameter name set in the background (whether built-in or custom) and must be case-sensitive.
  • siteIdParameters are usually not required, but in the multi-site management scenario, if you need to call contact information from other sites,siteIdSpecify it.

Let's look at some practical examples to see how to apply:

1. Call the built-in contact information:Suppose you want to display the company's contact phone number, email, and address in the footer:

<p>
    联系电话：<a href="tel:{% contact with name='Cellphone' %}">{% contact with name='Cellphone' %}</a><br>
    联系邮箱：<a href="mailto:{% contact with name='Email' %}">{% contact with name='Email' %}</a><br>
    公司地址：{% contact with name='Address' %}
</p>

If you want to call the WeChat QR code, it is usually an image link that needs to be combined with<img>Tags:

{% contact wechatQrcode with name='Qrcode' %}
{% if wechatQrcode %}
    <img src="{{wechatQrcode}}" alt="微信二维码" style="width: 100px; height: auto;">
{% endif %}

Here, we first assign the QR code image address towechatQrcodeVariable, then check if the variable exists to avoid displaying a broken image icon when the image address is empty.

2. Call the custom contact information:If you have customized a field named in the background,WhatsAppused to display the WhatsApp account, you can call it like this:

<p>
    WhatsApp：<a href="https://wa.me/{% contact with name='WhatsApp' %}" target="_blank">{% contact with name='WhatsApp' %}</a>
</p>

In practical applications, you can embed these tags into the header, footer, contact us page, sidebar, or even the article content of the website. No matter where you usecontact[en]Tags, it will dynamically fetch the latest information from the background and display it.

Useful Tips and Considerations

  • [en]HTML Link Protocol[en]: For phone numbers, you can usetel:Protocol implementation for click-to-dial; for email addresses, one can usemailto:Protocol implementation for click-to-send email, all of these can be embedded directlycontactThe output value of the tag.
  • Ensure information securityAlthoughcontactTags facilitate information management, but please ensure that the information you fill in is accurate when configuring the background, especially the contact information that is publicly disclosed.
  • Template design and user experienceContact information is usually the key content that users look for. Please place them in a prominent position on the website and use clear and understandable text and icons.

Through the Anqi CMScontactTags, the contact information management on corporate websites has become unprecedentedly simple and efficient.It not only ensures the accuracy and consistency of information, but also allows website operators to invest their valuable energy into more important content creation and market promotion, thereby enhancing overall operational efficiency and customer satisfaction.

Common Questions (FAQ)

Q1: If my website is multilingual or has multiple sites,contacthow can tags distinguish the contact information for different languages/sites?

A1: contacttag supportsiteIdParameters, theoretically can call the contact information of the specified site.However, the "Contact Settings" in Anqi CMS is usually site-level.In multilingual websites, a better practice is to set up contact information separately for each language site.contactTags will automatically retrieve the current site's information.If it is a multi-site feature under the same AnQiCMS instance, you need to selectively display through the judgment of the current site ID in the template, or configure it separately for each site.

Q2: Can I directly usecontactSet link style in tags, such as dialing a phone number directly when clicked?

A2: contactThe tag itself only outputs text content or image links with contact information. To add a click-to-dial feature (such astel:agreement), or to add a click-to-email feature (such asmailto:protocol), you need to manually write the corresponding HTML link structure in the template.contactthe output value of the tag as the link's.hrefattribute content. For example:<a href="tel:{% contact with name='Cellphone' %}">{% contact with name='Cellphone' %}</a>.

Q3: What will be displayed if I have not set up a contact method in the background, but call it in the template?

A3:If a contact method is not set in the background but is called in the templatenamefield,contactThe tag will not output any content.This helps keep the website interface neat, without displaying empty fields or error messages.defaultto implement the filter).