In today's highly competitive online environment, making your website content stand out on search engine results pages (SERP) is crucial to attracting user clicks.And JSON-LD structured data is an important tool to achieve this goal.By embedding Json-LD in a page, you can provide explicit information about the page content to search engines, thereby giving you the opportunity to display in search results in a richer form (such as star ratings, product prices, article thumbnails, etc.), which is what we often refer to as 'rich media results'.

AnQiCMS (AnQiCMS) took full consideration of the needs of search engine optimization (SEO) from the very beginning of its design, providing a comprehensive solution from content publishing to advanced SEO tools, aiming to help users improve the visibility and ranking of their websites.Its flexible template mechanism and support for custom tags make it particularly convenient and efficient to integrate JSON-LD structured data into web pages.

Understand the integration of AnQi CMS and Json-LD

AnQiCMS's template system uses syntax similar to the Django template engine, which means you can output various data on the website through concise tags.To facilitate the integration of structured data, AnQiCMS has built-in tags specifically for Json-LD, which greatly simplifies the operation process.This tag allows you to flexibly extend and override the default Json-LD data output based on specific requirements, ensuring that your structured data is both standard-compliant and tailored to the content of the page.

The system may automatically output some basic Json-LD structured data when generating pages.And by customizing Json-LD tags, you can check, improve, or even override these default outputs to achieve more accurate and richer multimedia result display.

Basics of Json-LD: Core Elements and Common Types

Json-LD is a lightweight data format that uses JSON syntax to describe data and combines with the Schema.org vocabulary to define the type and properties of the data.Understanding its core structure helps better integration:

  • @contextSpecifies the vocabulary used by Json-LD, usuallyhttp://schema.org.
  • @type: Defined the entity type you are describing, for exampleArticle(Article),Product(Product),Organization(Organization) orWebSite(Website).

Choose the appropriate one based on the different page content,@typeDescribe your entity and fill in the corresponding properties. The strength of AnQi CMS lies in its ability to help you easily embed the required dynamic data into Json-LD code.

Apply Json-LD in Anqi CMS template

To embed Json-LD in Anqi CMS pages, we mainly use{% jsonLd %}This custom tag. This tag is usually placed in the HTML page.<head>Because it allows search engines to faster discover and understand structured data during crawling and rendering.

{% jsonLd %}
<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "您要描述的实体类型",
  "name": "实体名称",
  "url": "实体URL",
  // 其他属性...
}
</script>
{% endjsonLd %}

The following will demonstrate how to dynamically fill Json-LD data in the AnQi CMS using several common scenarios.

Scenario one: The structured data of the article page (Article)

For blog posts or news pages, we can useArticletype to describe. This helps display article titles, publication dates, authors, thumbnails, and other information in search results.

Assuming we want to embed in the article detail pageArticleof the Json-LD type:

{# 确保在文档详情页中才能正确获取archive数据 #}
{% archiveDetail currentArchive with name="Id" %} {# 确保archiveDetail标签已获取当前文档数据 #}
<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "Article",
  "headline": "{% tdk with name="Title" %}", {# 文章标题，使用TDK标签获取 #}
  "image": [
    "{% archiveDetail with name="Logo" %}" {# 文章封面图 #}
  ],
  "datePublished": "{{ stampToDate(archive.CreatedTime, "2006-01-02T15:04:05-07:00") }}", {# 发布日期，注意时间格式 #}
  "dateModified": "{{ stampToDate(archive.UpdatedTime, "2006-01-02T15:04:05-07:00") }}", {# 修改日期 #}
  "author": {
    "@type": "Person",
    "name": "安企CMS小编" {# 示例作者名，可替换为动态获取 #}
  },
  "publisher": {
    "@type": "Organization",
    "name": "{% system with name="SiteName" %}", {# 网站名称 #}
    "logo": {
      "@type": "ImageObject",
      "url": "{% system with name="SiteLogo" %}" {# 网站Logo #}
    }
  },
  "description": "{% tdk with name="Description" %}", {# 文章描述，使用TDK标签获取 #}
  "mainEntityOfPage": {
    "@type": "WebPage",
    "@id": "{% archiveDetail with name="Link" %}" {# 文章链接 #}
  }
}
</script>
{% endjsonLd %}

Please note,{% archiveDetail with name="Id" %}This line is a placeholder to ensure that the subsequentarchiveThe variable is available. In the actual template, if the page is already the document detail page, thenarchiveThe object can usually be accessed directly.stampToDateThe filter is used to format the timestamp into the ISO 8601 format required by Json-LD, while|safeThe filter is used to ensure that the output HTML or JSON content is not escaped.

Scenario two: Structured data of product pages (Product)

For product display pages,ProductThe type can provide product name, image, price, reviews, and other information, which is particularly important for e-commerce or product display websites.The 'Flexible Content Model' feature of AnQi CMS plays a huge role here, you can customize various properties of the product.

`twig {# Assuming in the product detail page, the archive variable represents the current product #} {% archiveDetail currentProduct with name=“Id” %} {# Ensure that the archiveDetail tag has obtained the document data #}