As a website operator who has been deeply involved in AnQiCMS for many years, I am well aware of the importance of clearly and effectively displaying key information, especially contact information, on the website front-end template.This is not only about user experience, but also the key to building trust and promoting communication.AnQiCMS was designed with this in mind from the start, providing intuitive and flexible template tags to allow developers to easily retrieve and display this information.
I will elaborate in detail on how to obtain and display contact information in the AnQiCMS template, such as phone and email.
Configure contact information in the AnQiCMS backend.
Before displaying contact information on the website front-end, we first need to ensure that this information is correctly configured in the AnQiCMS backend.After entering the AnQiCMS backend management interface, you will find the "Contact Information Settings" option under the "Backend Settings" area.Here, you can manage a series of default contact information fields, such as "Contact
These default fields are sufficient to meet the needs of most enterprises.However, AnQiCMS also provides high flexibility, allowing you to add more exclusive contact information fields through "custom setting parametersFor example, if your business involves international customers, you may need to add 'WhatsApp contact information', 'Facebook homepage link', or 'LinkedIn profile' etc.When adding custom parameters, you need to specify a "parameter name" (for template calls), a "parameter value" (actual content), and a "note" (for convenience of management and identification).Once this information is saved in the background, it can be easily called through template tags.
Core template tag:contactapplication
AnQiCMS provides a special interface for obtaining contact information.contactTemplate tag, its design philosophy is simplicity and efficiency. This tag allows you to directly obtain the corresponding contact information by specifying the field name.
contactThe basic format of the tag is:{% contact 变量名称 with name="字段名称" %}.
变量名称is an optional parameter.If you wish to store the retrieved value in a variable for reuse or additional processing in the subsequent parts of the template, you can specify a variable name.nameThe parameter is mandatory, it tells AnQiCMS which specific contact information field you want to retrieve. You need to use the field name configured in the background (such asCellphone/Email/Wechatetc) as its value.- For users deploying across multiple sites,
contactTags also supportsiteIdparameters to obtain contact information from a specific site. However, for most single-site users, this parameter is usually not required.
Get the commonly used contact information: phone and email
To get the contact phone number of the website, you can usename="Cellphone":
<p>联系电话：{% contact with name="Cellphone" %}</p>
This code will directly output the phone number you configured in the "Contact Settings" on the backend. If you need to store the phone number in a variable for further processing, such as creating a phone link, you can do it like this:
{% contact phoneNumber with name="Cellphone" %}
<p>联系电话：<a href="tel:{{ phoneNumber }}">{{ phoneNumber }}</a></p>
Likewise, to obtain the contact email addressname="Email":
<p>联系邮箱：{% contact with name="Email" %}</p>
For the convenience of users clicking to send an email, we can also encapsulate it into a mail link:
{% contact contactEmail with name="Email" %}
<p>联系邮箱：<a href="mailto:{{ contactEmail }}">{{ contactEmail }}</a></p>
Access custom contact information and other fields
The strength of AnQiCMS lies in its scalability. If you have customized contact fields such as "WhatsApp" or "QQ" in the background, you can also use them.contactLabels are used in conjunction with the corresponding parameter names to obtain them.
For example, if you have customized a parameter namedWhatsAppin the background, the way to obtain this value in the template is as follows:
<p>WhatsApp：{% contact with name="WhatsApp" %}</p>
Or obtain the WeChat QR code image:
{% contact wechatQrcode with name="Qrcode" %}
{% if wechatQrcode %}
<p>微信扫码：<img src="{{ wechatQrcode }}" alt="微信二维码" /></p>
{% endif %}
HereQrcodeIt is the built-in WeChat QR code field name of AnQiCMS.
The layout strategy of contact information in the template
When integrating contact information into a website template, consider its visibility and accessibility in the user journey.The header (Header), footer (Footer) and independent "Contact Us" page are ideal locations to display this information.
In the header, you can display the phone number or email icon succinctly, making it convenient for users to click quickly.The footer can include a more comprehensive contact address, phone number, email, and social media links.The 'Contact Us' page should provide the most detailed information, including maps, online forms, etc., to ensure that users can contact you in various ways.
By using the above method, you can flexibly and efficiently obtain and display various contact information in the AnQiCMS template, thereby enhancing the professionalism and user interaction experience of the website.
Frequently Asked Questions (FAQ)
AnQiCMS'contactTags are the main way to get contact information.
In AnQiCMS backend settings, how can I add a 'Skype account' contact method and retrieve it in the template?
You can find the "Custom Setting Parameters" area on the "Contact Information Settings" page in the AnQiCMS backend. Click Add New Parameter, and set the "Parameter Name" toSkypeFill in your Skype account and add a note for identification. Save it and you can use it in the template{% contact with name="Skype" %}Get and display your Skype account.
Why did I use it in the template?{% contact with name="Cellphone" %}But the phone number is not displayed on the page?
This is usually because you have not filled in the 'Contact Phone' field in the 'Contact Information Settings' of the AnQiCMS backend.Please check the background settings to ensure that the 'Contact Phone' field has been filled in with a valid value.If the background has been filled in but the front-end is not displayed, please try to clear the AnQiCMS system cache (there is a "update cache" function in the background) and the browser cache to ensure that the template has loaded the latest data.
I am managing a multilingual website, and I need to display different contact numbers in different language versions,contactCan tags be implemented?
The multi-site function and multi-language feature of AnQiCMS are usually used together.For a multilingual website, if you need to display different contact numbers for different language versions, you should independently configure the contact information for each language site in the AnQiCMS backend.contactThe tag will default to retrieving the contact information of the current site. If you need to explicitly retrieve specificsiteIdcontact information for the (site ID), you can use{% contact with name="Cellphone" siteId="X" %}(where X is the ID of the corresponding language site). However, it is usually not necessary to specify manually in the templatesiteIdBecause AnQiCMS will automatically load the contact information configured for the site being visited.