In the era where content is king, companies and self-media operators all understand the importance of establishing an effective connection with users.While social media, especially WeChat, is undoubtedly an efficient channel for connecting users, sharing information, and providing services.安企CMS（AnQiCMS）as a system designed for efficient content management naturally understands this well and provides powerful and convenient support for users to flexibly display WeChat QR codes or links to various social media accounts in website templates.
This article will delve into the perspective of a website operations expert to naturally and smoothly integrate these key social elements into the AnQiCMS template, helping your website better serve visitors and improve interaction rates.
Social media, the bridge connecting users
In content marketing and brand building, simply publishing high-quality content is not enough; it also requires providing users with convenient interaction entry points.Whether it is guiding users to pay attention to the official account to get the latest news, joining communities for in-depth communication, or linking to other social platforms to expand influence, WeChat QR codes and social media account links play a crucial role.They can effectively shorten the distance between users and you, transforming website traffic into a real user community.
Advantages and Implementation Path of AnQiCMS
AnQiCMS with its concise and efficient Go language architecture and flexible template mechanism, makes content display extremely convenient.It provides a set of intuitive 'contact settings' features for integrating social media elements, allowing you to manage these information centrally in the background without touching complex code, and call them at any time in the frontend template.
The system is built-in with a series of commonly used social media fields, such as WeChat account, WeChat QR code, QQ, WhatsApp, Facebook, Twitter, and so on.The better part is, if your business has special requirements, AnQiCMS also supports custom contact method parameters to ensure your social media strategy is fully covered.This information can be easily presented at any location on the website using the simple tags of AnQiCMS's powerful Django-style template engine once it is properly configured in the background.
Practice: Skillfully Using Contact Information Tags in Templates
In AnQiCMS template files, all social media contact information is unified through a singlecontactLabel to get. This label is very flexible, you just need to specify the field name you need to retrieve, and you can easily retrieve the corresponding data.
Display WeChat QR code: Make scanning and following accessible at your fingertips.
The WeChat QR code is the key to connecting with the WeChat ecosystem.In the 'Background Settings' -> 'Contact Information Settings' of AnQiCMS background, you can directly upload a WeChat QR code image.Once uploaded, it becomes very simple to call it in the template.
{# 获取并显示微信二维码图片 #}
{% contact qrcodeUrl with name="Qrcode" %}
{% if qrcodeUrl %}
<div class="wechat-qrcode">
<p>扫描微信二维码，获取更多精彩内容</p>
<img src="{{ qrcodeUrl|safe }}" alt="微信二维码" class="responsive-img">
</div>
{% endif %}
Here,qrcodeUrlIt is a temporary variable defined for the WeChat QR code image address obtained.name="Qrcode"Clearly tell the system that we need the WeChat QR code field configured on the back end.|safeThe use of the filter here is to ensure that the image path string is not unexpectedly escaped, although it is not usually necessary, but it is good practice to use the filter for outputs that may contain special characters,srcattributes are not required, but it is good practice to use the filter for outputs that may contain special characters,safeThe good habit, can effectively avoid potential rendering problems.{% if qrcodeUrl %}Such a judgment ensures that only when the background is configured with a QR code, the relevant elements will be displayed on the page, avoiding the embarrassment of an empty picture frame.
Integrate multiple social platform links: Expand your online footprint
In addition to WeChat, AnQiCMS also presets fields for links to various mainstream social media platforms, such as Facebook, Twitter, Instagram, LinkedIn, YouTube, and so on.You can selectively display these links on the website based on your brand strategy.
<div class="social-media-links">
{% contact wechatAccount with name="Wechat" %}
{% if wechatAccount %}
<a href="https://weixin.qq.com/r/{{ wechatAccount }}" target="_blank" rel="nofollow">
<i class="icon-wechat"></i>
<span>微信</span>
</a>
{% endif %}
{% contact facebookLink with name="Facebook" %}
{% if facebookLink %}
<a href="{{ facebookLink }}" target="_blank" rel="nofollow">
<i class="icon-facebook"></i>
<span>Facebook</span>
</a>
{% endif %}
{% contact twitterLink with name="Twitter" %}
{% if twitterLink %}
<a href="{{ twitterLink }}" target="_blank" rel="nofollow">
<i class="icon-twitter"></i>
<span>Twitter</span>
</a>
{% endif %}
{# 您可以根据需要，继续添加其他社交媒体链接，如： #}
{% contact instagramLink with name="Instagram" %}
{% if instagramLink %}
<a href="{{ instagramLink }}" target="_blank" rel="nofollow">
<i class="icon-instagram"></i>
<span>Instagram</span>
</a>
{% endif %}
{% contact whatsappNumber with name="WhatsApp" %}
{% if whatsappNumber %}
<a href="https://wa.me/{{ whatsappNumber }}" target="_blank" rel="nofollow">
<i class="icon-whatsapp"></i>
<span>WhatsApp</span>
</a>
{% endif %}
</div>
Here we have created a link for each social platform and used it in the same way{% if ... %}Perform judgment. Please note that you may need to adjust according to the actual situation for WeChat official account links.hrefThe format of the attribute, for example.https://weixin.qq.com/r/{{ wechatAccount }}This form.target="_blank" rel="nofollow"It is the standard practice for web page links, the former ensures that the link opens in a new tab, and the latter informs the search engine not to pass weight, commonly used for external links.<i>Labels are typically used to display font icons, and you may need to integrate icon libraries such as Font Awesome to display corresponding social media icons.
Custom social media link: meet your personalized needs
If the social media field built-in AnQiCMS does not meet your needs, for example, you want to add a Telegram group link or Xiaohongshu account, the "Custom Parameters" feature in the "Contact Information Settings" of AnQiCMS can come in handy.You can add a parameter named “Telegram” in the background and fill in its link address.
{# 调用自定义的Telegram链接 #}
{% contact telegramLink with name="Telegram" %}
{% if telegramLink %}
<a href="{{ telegramLink }}" target="_blank" rel="nofollow">
<i class="icon-telegram"></i>
<span>Telegram</span>
</a>
{% endif %}
Through this method, you can infinitely expand the social media connection capabilities of your website, making your website truly become a hub for connecting the world's content.
Image Resource Management: Uploading and Optimization of QR Codes
It is worth mentioning that whether it is a WeChat QR code or other possible images, such as custom social media icons, they can all be centralized uploaded and managed in the "Page Resources" -> "Image Resource Management" of AnQiCMS backend.Here you can not only upload images conveniently, but also compress them, generate WebP format (enabled in "Content Settings"), and process thumbnails, all of which help optimize website loading speed and enhance user experience.
Tips for Content Operation
It's not about having more social media links on the website, but about reasonable layout and strategy.
- Footer（页脚）：is a common location to place social media icons, as users typically expect to find this type of information here.
- Sidebar (Sidebar)：For content-rich pages, the sidebar can effectively attract users' attention to social media while browsing content.
- “Contact Us” pageThis is a dedicated area to display all contact methods, social media links are essential here.
- Content insideFor certain specific articles or products, naturally embedding relevant social media links or QR codes in the content can effectively guide users to engage in specific interactions.
Through the flexible configuration and template tags of AnQiCMS, you can easily adjust the display position and style of these social elements, presenting them in an **English** way to visitors, thereby maximizing the effect of your content operation.
Summary
The AnQi CMS provides a solution for website operators to easily display WeChat QR codes and links to various social media accounts, with its powerful content management capabilities and flexible template mechanism. From centralized management in the backend to convenient calls to front-end templates, every