The contact information of the website is an important part of building user trust and providing convenient services.Whether it is displaying a simple phone number at the bottom of the website or providing detailed address and social media links on the 'Contact Us' page, Anqi CMS offers a flexible and efficient way to manage and present these key information.This article will delve into how to set up and display all the contact information for your website in the Anqi CMS, ensuring that your customers can easily find you.
Backend Management: Set your contact information uniformly
In the Anqi CMS, all websites' contact information is centrally managed in one place.You just need to enter the background management interface, find the "Contact Information Settings" option under the "Background Settings" menu.
Here, you will see a series of preset common contact information fields, such as 'Contact Person', 'Contact Phone', 'Contact Address', 'Contact Email', 'WeChat ID', and 'WeChat QR Code' and so on.This field covers most basic contact needs for most corporate or personal websites.You only need to enter your information in the corresponding input box, and the system will automatically save these contents and prepare for the call of the front-end page.
The strength of AnQi CMS lies in its flexibility.If the preset fields cannot fully meet your needs, for example, if you need to display the enterprise QQ number, WhatsApp link, or phone number of a specific department, the system also provides the function of 'Custom Setting Parameters'.Here, you can easily add new parameters, name them (the 'parameter name' will be the identifier called in the template, it is recommended to use English or pinyin for readability), and fill in the specific values.For example, you can set a parameter named "WhatsApp" with the value being your WhatsApp number or link.Thus, even if the default list does not have a contact method, it can be expanded through simple customization.
Front-end display: call the template tags flexibly
An easy-to-use template tag system allows for effortless display of these contact information on the website frontend. The core call tags are{% contact %}This tag can help you accurately present the contact information in the background settings to the user.
The most direct way of using it is{% contact with name="字段名称" %}Here,字段名称This is the parameter name you see in the "Contact Information Settings" on the backend or the one you customize. For example, if you want to display the company's phone number, you can write the template code like this:
<!-- 显示联系电话 -->
<p>联系电话：{% contact with name="Cellphone" %}</p>
Similarly, if you need to display the company's detailed address or contact email, just setnamethe attribute value toAddressorEmailas follows:
<!-- 显示公司地址 -->
<p>公司地址：{% contact with name="Address" %}</p>
<!-- 显示联系邮箱 -->
<p>邮箱：<a href="mailto:{% contact with name="Email" %}">{% contact with name="Email" %}</a></p>
For image information like WeChat QR codes,{% contact %}The label will directly return the URL path of the image file. You need to embed it into<img>the label to display it correctly:
<!-- 显示微信二维码 -->
<p>微信二维码：<img src="{% contact with name="Qrcode" %}" alt="微信二维码"></p>
If you have added a custom parameter in the background, such as a parameter named “WhatsApp”, calling it in the template is also simple:
<!-- 显示 WhatsApp 联系方式 -->
<p>WhatsApp：{% contact with name="WhatsApp" %}</p>
In order to make the template code cleaner and easier to maintain, you can alsocontactLabel the output and assign it to a variable, then use this variable elsewhere in the template. This method is particularly suitable for situations where you need to refer to the same contact information multiple times on the same page:
{% contact companyPhone with name="Cellphone" %}
<p>拨打热线：<a href="tel:{{companyPhone}}">{{companyPhone}}</a></p>
This way, you can directly convert a phone number into a clickable dialing link, enhancing the mobile user experience.
These contact details can be flexibly placed at any position on the website.The most common and recommended practice is to display your contact information in the header (Header), footer (Footer), a dedicated 'Contact Us' page, or sidebar, etc., ensuring that users can easily find your contact information no matter where they browse.
Tips for improving user experience and SEO
When displaying contact information, it is not only important to ensure the accuracy of the information, but some tips can also significantly improve the user experience and the website's search engine optimization (SEO) effectiveness: English
- Maintain consistency:Ensure that all contact information on the website is up to date and consistent. Inconsistent information may reduce users' trust in the website and could also affect search engine judgments.
- Improve accessibility:For phone numbers, use
tel:The link of the protocol (for example:<a href="tel:1234567890">1234567890</a>）Can facilitate users to click and make direct calls for mobile devices. For addresses, consider adding links to map services for user navigation. - Beneficial for local SEO:Display address, phone number, and other information clearly and structurally on the website, which helps search engines better understand your local business and may improve your local search rankings, attracting more potential customers nearby.
The AutoCMS provides high flexibility and convenience in managing and displaying contact information.Through simple backend configuration and template tags, you can easily present important contact information to users, effectively enhancing the user experience and business conversion rate of the website.
Common Questions (FAQ)
Q1: If I need to display multiple phone numbers (such as the Sales Department, Customer Service Department), can Anqi CMS achieve this?
A1:Can be fully realized.You can add multiple phone numbers using the "Custom Setting Parameters" feature on the "Contact Information Settings" page in the "Background Settings" of the Anqi CMS backend.SalesPhoneThe parameter value is the Sales Department phone number; then add anotherServicePhoneThe parameter value is the customer service department phone number. In the template, use them separately.{% contact with name="SalesPhone" %}and{% contact with name="ServicePhone" %}to call it.
Q2: Is it possible to display a separate contact method for a specific page (such as a product details page) rather than a generic one for the entire site?
A2：Anqi CMS'scontactThe label is mainly used to call the universal contact methods of the entire site. If a specific page requires independent contact information, you can consider adding custom fields (such as:) in "Content Management" -> "Content Model" for the corresponding model (such as "Product Model").ProductContactPhone）。In editing the product details, enter the exclusive