AnQiCMS, with its high efficiency and flexibility, has become a powerful assistant for many small and medium-sized enterprises and content operation teams.In today's digital marketing era, a website is not only a platform for information release, but also an important window for connecting users and showcasing the brand image.While social media platforms like LinkedIn and Instagram play a crucial role in professional communication and visual marketing.As an expert who has been deeply involved in website operation for many years, I know that closely integrating these social media channels with your AnQiCMS website can significantly enhance your brand influence.
Today, we will focus on a question that many users are concerned about: 'How can I add LinkedIn or Instagram personal profile links to the contact information on the AnQiCMS website?'Don't worry, the powerful customizability of AnQiCMS makes this operation very simple.
The importance of social media links and the flexibility of AnQiCMS
Before delving into the operational steps, let's quickly review why it's important to integrate social media links on the website.LinkedIn represents a professional image and industry connection, it is the ideal platform for business professionals to expand their network and showcase their career achievements.While Instagram showcases its powerful visual expression, it has become an effective way for brands to tell stories and attract young audiences.Provide these links directly in the contact information on the website, which not only makes it convenient for users to quickly find you, but also subtly enhances your brand's credibility and activity.
AnQiCMS was designed from the beginning with full consideration of the flexibility of website content and functions.Among them, the 'Contact Settings' module is a microcosm of its high customizability.In addition to basic contact information such as phone, email, and address, AnQiCMS also allows you to easily add any additional information you wish to display based on your actual needs through the "Custom Setting Parameters" feature, which is the foundation for us to add LinkedIn and Instagram links.
Step by step: Add LinkedIn and Instagram links in AnQiCMS
To add your LinkedIn or Instagram profile link to the contact information on the AnQiCMS website, you usually just need a few simple steps.
Step 1: Go to the "Contact Information Settings" in the background
First, you need to log in to the AnQiCMS admin interface.In the left navigation menu, find and click on "Backend Settings", then select "Contact Information Settings".This is the core area where you manage all website contact information.
Step 2: Understand the existing contact information fields and template calls
On the "Contact Information Settings" page, you will see a series of default contact information fields, such as "Contact Person", "Contact Phone", "Contact Email", "WeChat ID", and so on.These field values will be called through specific tags in the front-end template.{% contact with name="Cellphone" %}Such a label. Here isnameThe parameter is the field name corresponding to the background settings.
AnQiCMS integrated mainstream social media such as WhatsApp, Facebook, Twitter, and so on.nameParameters, you can use them directly. While the document mentions LinkedIn and Instagram, although it is in the documenttag-contact.mdhas listedLinkedinandInstagramTwo fields, but to ensure that your AnQiCMS version supports or to facilitate the understanding of the customization process, we still operate according to the custom field method, which can give you a deeper understanding of the flexibility of AnQiCMS.Of course, if your AnQiCMS version has built-in these fields, you can skip step three, directly fill in the link in step two, and then call it directly in step four.
Step 3: Add custom social media fields (LinkedIn and Instagram)
Below the "Contact SettingsThis is the place where we add LinkedIn and Instagram links.
- Click 'Add custom parameters':Click the button, a new line will pop up, allowing you to enter parameter information.
- Enter your LinkedIn link:
- Parameter name:Suggested
Linkedin。AnQiCMS will automatically convert the parameter name you enter to camel case (i.e., the first letter of each word is capitalized, with no spaces in between), solinkedin/LinkedInit may be used in templates in the endLinkedinThe format is quoted. For clarity, it is used directlyLinkedinJust do it. - Parameter value:Paste the full URL of your LinkedIn personal profile, for example
https://www.linkedin.com/in/yourprofile/. - Note:Fill in
LinkedIn个人主页链接for easy identification in the future
- Parameter name:Suggested
- Enter your Instagram link:
- Parameter name:Similarly, it is recommended to fill in
Instagram. - Parameter value:Paste the complete URL of your Instagram personal homepage, for example
https://www.instagram.com/yourusername/. - Note:Fill in
Instagram个人主页链接.
- Parameter name:Similarly, it is recommended to fill in
After filling out, please make sure to click the "Save" button to ensure that your changes have been recorded by the system.
Step 4: Call the newly added link in the front-end template.
This is the most critical step, we need to modify the front-end template file so that these newly added links can be displayed on your website. The AnQiCMS template files are usually located/templateUnder the directory, and use syntax similar to the Django template engine. For specific template file location and structure, refer todesign-director.mdThe description. Common contact information is usually placed in the footer or on a separate 'Contact Us' page.
Assuming your contact information is inpartial/footer.htmlorguestbook/index.htmlIn the template file, you can call the newly added social media link in the following way:
{# 调用 LinkedIn 链接 #}
{% contact linkedinLink with name="Linkedin" %}
{% if linkedinLink %} {# 判断链接是否存在 #}
<a href="{{ linkedinLink }}" target="_blank" rel="noopener noreferrer">
<img src="{% system with name="TemplateUrl" %}/images/icons/linkedin.png" alt="LinkedIn"> LinkedIn
</a>
{% endif %}
{# 调用 Instagram 链接 #}
{% contact instagramLink with name="Instagram" %}
{% if instagramLink %} {# 判断链接是否存在 #}
<a href="{{ instagramLink }}" target="_blank" rel="noopener noreferrer">
<img src="{% system with name="TemplateUrl" %}/images/icons/instagram.png" alt="Instagram"> Instagram
</a>
{% endif %}
Code analysis:
{% contact linkedinLink with name="Linkedin" %}This line of code will retrieve the contact information settings from the background according toname="Linkedin"Extract the corresponding parameter value (i.e., your LinkedIn link) and assign it tolinkedinLinkVariable.{% if linkedinLink %}：This is a conditional judgment to ensure that the LinkedIn link is set on the back end before it is displayed on the front end. This helps to avoid displaying empty links or errors.<a href="{{ linkedinLink }}" target="_blank" rel="noopener noreferrer">...</a>This is a standard HTML link tag,hrefthe attribute refers to the one we obtained,linkedinLinkThe value of the variable.target="_blank"to ensure that the link opens in a new window,rel="noopener noreferrer"which is for security and SEO considerations.<img src="{% system with name="TemplateUrl" %}/images/icons/linkedin.png" alt="LinkedIn">: Assume there is a path to store the icon in your template.{% system with name="TemplateUrl" %}The static resource path of your current template will be dynamically retrieved to ensure that the images can be loaded correctly. You can replace it with text or an appropriate icon based on the actual situation of your template.
After modifying the template, save the file, and according to your server configuration (such as using Baota panel or Docker), you may need to clear the AnQiCMS cache (click "Update Cache" in the background) so that the changes take effect immediately.
Content operation strategy extension
Adding these social media links is not just a technical operation, but also an important part of your content operation strategy.
- Unified brand image: Ensure that the visual style and brand information of your LinkedIn and Instagram profiles are consistent with your AnQiCMS website, forming a unified brand image.
- Content Interconnectivity and引流:When publishing new content on your AnQiCMS website, consider promoting it on social media and directing users to your website for more information.On the contrary,精彩 moments or professional insights on social media can also be integrated and displayed on websites.
- Professionalism and Interactivity:LinkedIn can help you establish industry authority and expand business cooperation; Instagram can get closer to users through high-quality images and videos, enhancing interactivity.Effectively utilizing these platforms can enrich your content marketing strategy in multiple dimensions.
- Continuous Updates and Maintenance:The value of social media lies in continuous interaction and fresh content.Regularly update your LinkedIn and Instagram posts to ensure that users can see active and valuable content when they visit your website via your website link.
Summary
AnQi CMS with its excellent flexibility and scalability, allows you to easily customize every detail of the website.By using the "Contact Settings" and the "Custom Settings Parameters" feature, combined with simple template modifications, you can quickly integrate social media links such as LinkedIn and Instagram into your website, providing users with more comprehensive contact information and adding strength to your brand building.This not only optimizes the user experience, but also turns your website into a digital hub connecting all four sides.
Frequently Asked Questions (FAQ)
Q1: If I add a custom field but it does not display in the front-end template, what should I do?
A1: First, make sure you have added custom parameters in the background "Contact Information Settings" and clicked the "Save" button. Second, check the correctness of the front-end template code, especiallynameIs the parameter consistent with the 'parameter name' set in the background (note the case and camel case naming).Finally, try to clear the AnQiCMS system cache because template changes may require cache refresh to take effect.If the problem still exists, it may be due to an incorrect template file path, or the template on the current page is not the one you are editing.
Q2: Besides LinkedIn and Instagram, which other social media links can I add?
A2: In theory, you can add any social media link using the "Custom settings parameters" feature. As long as you can provide the URL of the corresponding social media platform homepage and define a unique "parameter name" (for example:TikTok/PinterestAs per the method described in this article, you can add it in the background and call it in the front-end template.AnQiCMS's "Contact Information Settings" is already built-in with fields such as QQ, WhatsApp, Facebook, Twitter, Tiktok, Pinterest, and Youtube, you can consider using these built-in fields directly.
Q3: The field name of the custom field is in English or Chinese? How does it manifest in the template?
A3: In the background "Contact Information Settings", it is recommended to use English or pinyin for the "parameter name" of the custom field, AnQiCMS will automatically convert it to camel case format (for example, you enterlinkedinorlink_in, it is recommended to use when calling in the templateLinkedin）。This 'parameter name' is the key identifier you use in the front-end template throughnameto refer to the field value. For example, if you set the 'parameter name' in the back-end tolinkedinIn the template, you will use{% contact yourLinkedinVar with name="Linkedin" %}to call. The "note" field can be used in Chinese, which is only used for the identification of the background management interface and will not affect the call of the front-end template.