In the world of Anqi CMS templates, efficiently and flexibly displaying content is the key to successful website operation.We often need to determine the display of page elements based on the existence or absence of data, as well as the state of truth.{% if not 变量 %}Such a negative judgment is a seemingly simple but extremely powerful tool in template development, which can help us build more intelligent and user-friendly website interfaces.
As an experienced website operations expert, I know that every detail of a template may affect user experience and operational efficiency. Today, let's delve into it in depth.{% if not 变量 %}In the specific application scenarios of AnQiCMS templates, see how it boosts our website operations.
I. Gracefully handle content defaults and alternative display
In website content operation, data missing is a common thing.It is possible that a document does not have an uploaded thumbnail, a category does not have a detailed description, or a list is temporarily empty.At this point, if the template is not handled properly, it may result in empty blocks, even displaying error messages, greatly damaging the user experience.{% if not 变量 %}Here played the role of 'Content Gatekeeper'.
Imagine that we are building a document detail page, and we need to display the article thumbnail and summary.If the article does not upload a thumbnail, we do not want it to display a broken image icon, but rather to display a default placeholder image.Similarly, if the article does not have a summary, we can display a general description.
Example: Alternate display of article thumbnails
AnQiCMS'archiveDetailTags can get document details. We can judge byarchive.Thumb(Thumbnail) Whether it exists determines the content to be displayed:
{# 获取当前文档的详情,假设变量名为archive #}
{% archiveDetail archive with name="Id" %} {# 确保archive变量被赋值 #}
{% if not archive.Thumb %}
{# 如果缩略图不存在,显示一个默认的占位图 #}
<img src="/static/images/default-thumb.png" alt="{{ archive.Title }} 暂无图片" />
{% else %}
{# 如果缩略图存在,正常显示 #}
<img src="{{ archive.Thumb }}" alt="{{ archive.Title }}" />
{% endif %}
This pattern also applies toarchive.Description(Document description),archive.Logo(Cover main image) and other fields. Ifarchive.Descriptionis empty, we can display a custom default description.
Example: Prompt when the list is empty
When displaying document lists, category lists, and other collection data, when the query results are empty, AnQiCMS provides{% for ... empty %}Grammar, this is itself an elegant negative judgment for an empty list. However, sometimes we need to judge whether a variable is an empty array or undefined elsewhere.
{% archiveList archives with type="page" limit="10" %}
{% if not archives %}
<p>抱歉,当前分类或搜索条件下暂无任何文档。</p>
{% else %}
<ul>
{% for item in archives %}
<li><a href="{{ item.Link }}">{{ item.Title }}</a></li>
{% endfor %}
</ul>
{% endif %}
{% endarchiveList %}
Although{% for ... empty %}More suitable for loops, but the above{% if not archives %}Also plays a role in some scenarios where it is necessary to independently judge whether the list variable is empty.
II. Display of smart control configuration items and function switches
AnQiCMS provides rich backend configuration options, such as website name, Logo, contact information, etc., these are throughsystemandcontactThe tags are called in the template. In actual operation, administrators may not fill in all the configuration items. Use{% if not 变量 %}These unconfigured items can be flexibly controlled.
Example: Display the website logo or name as needed
If the administrator uploads the website logo, we will display the logo; if not uploaded, we will display the website name as an alternative.
{# 获取系统配置,假设变量名为system_config #}
{% system system_config with name="SiteLogo" %} {# 确保system_config变量被赋值 #}
<header>
{% if not system_config.SiteLogo %}
{# 如果未设置Logo,显示网站名称 #}
<h1><a href="/">{% system with name="SiteName" %}</a></h1>
{% else %}
{# 如果设置了Logo,显示Logo图片 #}
<a href="/">
<img src="{{ system_config.SiteLogo }}" alt="{% system with name="SiteName" %}" />
</a>
{% endif %}
</header>
The same logic also applies to contact information. For example, QQ contact information is only displayed when the number is filled in the background, otherwise the icon or link is not displayed to avoid unnecessary empty links.QQ
Example: Conditionally display contact information
{# 获取联系方式配置 #}
{% contact qq_number with name="QQ" %}
{% if not qq_number %}
{# 如果未设置QQ号,不显示QQ图标 #}
{# 或者显示一个通用的联系方式提示 #}
{% else %}
{# 显示QQ图标和链接 #}
<a href="tencent://message/?uin={{ qq_number }}" target="_blank" rel="nofollow">
<img src="/static/images/icon-qq.png" alt="QQ联系" />
</a>
{% endif %}
3. Optimize user navigation and interaction experience
In the design of the website's navigation, links to the previous/next articles, related article recommendations, and other elements are important for improving user experience.{% if not 变量 %}Can help us determine whether these functional elements are available and make corresponding adjustments.
Example: Control the display of the previous/next link.
When the user is browsing the first or last article in a series, there is usually no 'Previous' or 'Next' to click. At this time, we can useprevArchiveandnextArchiveLabel collaboration{% if not ... %}To handle.
<nav class="article-navigation">
{% prevArchive prev_article %}
{% if not prev_article %}
<span>← 没有上一篇了</span>
{% else %}
<a href="{{ prev_article.Link }}">← 上一篇: {{ prev_article.Title }}</a>
{% endif %}
{% nextArchive next_article %}
{% if not next_article %}
<span>没有下一篇了 →</span>
{% else %}
<a href="{{ next_article.Link }}">下一篇: {{ next_article.Title }} →</a>
{% endif %}
</nav>
By such a judgment, we avoid displaying invalid links when there is no previous or next article, making navigation clearer and the user experience smoother.
Four, the flexibility of multi-site and multi-language adaptation
AnQiCMS supports multi-site and multi-language, which provides strong support for building globalized or multi-brand websites. At the template level,{% if not 变量 %}Can be used to determine whether the data for a specific site or language version exists, thereby implementing a flexible fallback mechanism.
Example: Fallback mechanism for mobile end addresses.
Assuming we want the mobile end to access when, if the sub-site has not set an independent mobile end address, it will automatically use the main site's configuration.
{# 获取当前站点的移动端地址 #}
{% system current_mobile_url with name="MobileUrl" %}
{% if not current_mobile_url %}
{# 如果当前站点未配置移动端URL,可以考虑显示一个通用的移动端提示或跳转链接 #}
<p>当前站点无独立移动端地址,请访问PC版。</p>
{% else %}
{# 正常显示移动端切换链接或标识 #}
<link rel="alternate" media="only screen and (max-width: 640px)" href="{{ current_mobile_url }}" />
<p>您正在访问PC版,<a href="{{ current_mobile_url }}">切换至移动版</a></p>
{% endif %}
This logic can effectively improve the robustness and adaptability of templates in multi-site and multi-language scenarios, reducing functional anomalies caused by incomplete configuration.
Summary
{% if not 变量 %}In AnQiCMS template, it is a seemingly basic but ubiquitous judgment logic.It is not only a conditional branch at the code level, but also a specific embodiment of website operation strategy in technical implementation.
- Improve user experience:Avoid displaying empty content, broken images, or invalid links, and provide a smooth navigation experience.
- Increase the robustness of the template:Gracefully handle data missing and prevent page errors caused by incomplete backend configuration.
- Implement flexible content display:Dynamically adjust page layout and element visibility based on data status.
- Simplify content maintenance:Allow the template to better adapt to content changes, reducing the need for frequent template modifications.
Reasonable use{% if not 变量 %}Combine the various tags provided by AnQiCMS and its powerful template engine, and you will be able to build high-quality websites that are more flexible and tailored to user needs.
Frequently Asked Questions (FAQ)
Q1:{% if not 变量 %}and{% for ... empty %}What is the difference when judging an empty list?
A1: {% for ... empty %}It is an AnQiCMS template engine (Django style) specially designed for loops. WhenforThe list being traversed in the loop (such asarchivesAn emptyemptyThe content in the statement block will be executed, whileforThe loop itself will not be executed. This is a very concise and intuitive syntax for handling empty lists.{% if not 变量 %}It is a more general conditional judgment. It can judge any type of variable, including boolean values, strings, numbers, objects, and lists. When变量Withnil/falseWhen a string, empty array, or empty object is,{% if not 变量 %}the condition will be true. When checking if a list is empty, `{% if not list_variable %}`