How to configure and display the global contact information of the website, such as phone number, address, and WeChat QR code?

In website operation, clearly and accurately displaying contact information is a key link in building user trust and improving service efficiency.Whether it is a phone number, address, email, or the popular WeChat QR code at present, AnQiCMS provides a flexible and convenient way to configure and manage these global information, ensuring they can be presented efficiently on the website.

Backend configuration: Centralize your global contact information

To manage these information centrally, you need to log in to the AnQiCMS backend management interface. After logging in, please navigate to the left menu bar of theBackend settings" option, then select "Contact information settings”Option. This is the collection point for all external contact information of your website.

In the "Contact Information Settings" area, you will see a series of preset contact information input boxes, such as contact person, contact phone number, contact address, contact email, as well as WeChat ID and WeChat QR code, etc.This field is intended to meet the basic needs of most websites, and you can fill in each one according to the actual situation.For example, fill in your customer service phone number in the "Contact Phone

It is worth mentioning that if the default fields provided by the system do not fully meet your website needs, such as when you need to add WhatsApp contact information, Telegram group links, or other specific social media accounts, AnQiCMS also provides flexible “Customize settings parameters功能。您可以点击“添加自定义参数”,为新参数定义一个清晰的“参数名”(建议使用英文或拼音,如WhatsAppThen enter the corresponding contact information or link in the "Parameter Value" and add a "Remark" for future management.Configuration complete, be sure to click the save button at the bottom of the page to ensure that all your changes take effect in a timely manner.

Front-end display: Make contact information easily accessible on the website

Once the background contact information is configured, the next step is to display them on the frontend pages of the website.AnQiCMS's powerful template tag system makes this process very intuitive, allowing you to easily access this information without complex code development.

The core is to use a name calledcontactThe template tag. This tag is specifically used to extract the information you fill in the "Contact Information Settings" in the background. Its basic usage is{% contact 变量名称 with name="字段名称" %}If you do not need to assign information to a variable, you can also write{% contact with name="字段名称" %}to output the content directly.

The following are some common contact information display examples:

  • Display contact phone number:To facilitate direct dialing for users, especially mobile users, you can use it like thiscontactUse labels to display phone numbers and make them clickable:

    <a href="tel:{% contact with name='Cellphone' %}" rel="nofollow">
        {% contact with name='Cellphone' %}
    </a>
    

    Here,name='Cellphone'It will call the contact phone number you filled in the background.

  • Display the contact address:The company's physical address is usually displayed in the footer or contact us page, and can be directly accessed:

    <span>地址:{% contact with name='Address' %}</span>
    
  • Display the WeChat QR code:The WeChat QR code as an image needs to be placed in<img>TagssrcProperty inside. Please make sure you have uploaded the QR code image in the background:

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

    If you need to add explanatory text below the image, you can also call the微信号 field at the same time:

    <img src="{% contact with name='Qrcode' %}" alt="微信二维码" />
    <p>微信号:{% contact with name='Wechat' %}</p>
    
  • Display custom parameters:If you have added custom parameters in the background, such as one namedWhatsAppYou can also call it in the same way:

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

The global contact information is usually placed at the header, footer of the website, or an independent "Contact Us" page. In the template file, you just need to place the correspondingcontactLabel can be embedded into the HTML structure, AnQiCMS will automatically replace it with the specific content set in the background during page rendering.

Tips to improve user experience and SEO friendliness

Some small details in configuring and displaying contact information can further enhance the user experience and SEO friendliness of your website:

  • Maintain consistency:Ensure that the contact information you display at all key positions on the website (such as the header, footer, and contact us page) is consistent. This can enhance user trust and avoid confusion.
  • Mobile optimization:For phone numbers and email addresses, it is recommended to use HTML'stel:andmailto:links. For example<a href="tel:1234567890">1234567890</a>, which is convenient for mobile users to directly click to dial or send an email.
  • Image quality and speed:WeChat QR code and other image information should ensure that the images are clear and load quickly.The AnQiCMS content settings provide the functionality to convert webp image formats and automatically compress large images, which can help optimize your images.
  • Regular review:Regularly check whether these contact details are still valid and up-to-date to avoid user loss or a decline in trust due to outdated information.Accurate contact information also helps search engines better understand and display your business information, such as in local search results.

through the 'Contact Information Settings' function of AnQiCMS,contactTemplate tags, you can efficiently manage and display the global contact information of the website, providing your users with a convenient communication channel, and also contributing to the professional image of the website.


Common Questions (FAQ)

1. Why didn't the contact information I set in the background display on the website front end?This is usually because you haven't added the corresponding information to the website template files.contactTag to call this information. Please check the corresponding template file for the page where you want to display contact information (such as the header, footer, or contact us page) and ensure that it has been correctly embedded according to the examples in the documentation.{% contact with name='字段名' %}Label.

2. I uploaded a WeChat QR code image, but it is not clear or loads very slowly on the front end. What are the solutions?If the QR code image is not clear, it may be due to insufficient resolution of the original image.Suggest using high-resolution original images for upload.If the loading is slow, you can consider enabling the "Whether to start Webp image format" and "Whether to automatically compress large images" functions in the "Background Settings" -> "Content Settings" of AnQiCMS background, which helps to optimize the image volume and improve the loading speed.

3. I want to add a link to a Telegram group, but there is no corresponding field in the background. What should I do?In this case, you can use the "Contact Information Settings" page at the bottom to access the "Custom Setting Parameters" feature. Click "Add Custom Parameter", and set the "Parameter Name" to such asTelegramLinkThen, in the 'Parameter Value', enter your Telegram group link and add an appropriate note. After saving, you can use this link in the template.{% contact with name='TelegramLink' %}to call this link.