尧图网页设计 
Zola 添加 Schema.org 结构化数据3 种页面的 JSON-LD 完整落地指南【免费下载链接】zolaA fast static site generator in a single binary with everything built-in. https://www.getzola.org项目地址: https://gitcode.com/GitHub_Trending/zo/zola搜索结果里你的站点只是一条素链接而别人的结果带着摘要、作者和发布时间。这是标记差异不是流量运气。Zola 没有内置 Schema.org 支持但它的模板系统足以让你补上这块在几个模板里嵌入 JSON-LD一种以 JSON 文本写进网页的结构化数据格式搜索结果就能升级成富媒体展示。本文按首页、文章页、产品页逐页给出现成脚本。先看效果搜索结果从一条链接变成一张卡片改动前搜索引擎给你的页面展示的是一行蓝色标题加一条灰字摘要信息量和其他站点没有差别。加上结构化数据后同一条结果可以附带文章主图、作者名、发布日期产品页还能挂出价格与库存状态——这就是富媒体展示。差别不在你的页面本身而在你给爬虫提供的机器可读信息。30 秒原理结构化数据是什么谁来读它结构化数据是嵌在 HTML 里的机器可读描述搜索引擎爬虫会读取它并据此决定搜索结果能否展示摘要、图片、作者、日期等富媒体字段。JSON-LD 是这类信息最常见的承载形式一个script typeapplication/ldjson标签里面写一段 JSON字段名遵循 Schema.org 的属性命名。它不影响页面在浏览器里的显示只影响爬虫怎么理解页面。所以写错字段的代价是展示缺失写对字段的收益是一次性投入、全站页面持续生效。动手前核对config 项、页面变量和模板文件开始改模板前先确认这 5 件事都成立脚本里用到的变量才有值可取。zola.toml里base_url已指向真实部署地址title、description已填写文章的 front matter 里有dateArticle 标记需要发布时间有修改时间就再填updated项目templates/目录存在index.html、page.html两个文件若你的站点装了主题且想保留主题样式这两个文件需要自己建同名文件会覆盖主题的对应模板站点 logo 的静态文件路径已确认脚本里要用get_url解析出它的完整 URL想好的config.extra键位author默认作者名、logologo 路径、search_path搜索页路径这三个键会被脚本引用page变量自带的字段title、description、date、updated、assets、authors 等在官方文档有完整列表见 页面与 section 变量说明。按页面类型落地哪类页面用哪种 Schema 类型首页在 index.html 插入 WebSite 类型首页用WebSite类型。脚本放在index.html的head标签内script typeapplication/ldjson { context: https://schema.org, type: WebSite, name: {{ config.title }}, url: {{ config.base_url }}, description: {{ config.description }}, publisher: { type: Organization, name: {{ config.title }}, logo: {{ get_url(pathconfig.extra.logo) }} }, potentialAction: { type: SearchAction, target: {{ config.base_url }}{{ config.extra.search_path }}?q{search_term_string}, query-input: required namesearch_term_string } } /scriptWebSite标记只放首页不需要也不应该出现在page.html里。如果你的站点没有搜索页把potentialAction整段删掉其余字段保留。文章页在 page.html 插入 Article 类型文章页用Article类型位置在page.html的head标签内。这份脚本可以直接作为templates/schema/article.html片段使用下一节会用它做封装演示script typeapplication/ldjson {% set article_images page.assets | regex_replace(pattern^((?!\\.(?:png|jpe?g|webp|avif|gif)).*)$, rep, multilinetrue) %} { context: https://schema.org, type: Article, headline: {{ page.title }}, description: {{ page.description | default(valueconfig.description) }}, keywords: {{ page.taxonomies.tags | default(value[]) | join(sep, ) }}, author: {{ page.authors | first }}, publisher: { type: Organization, name: {{ config.title }}, logo: {{ get_url(pathconfig.extra.logo) }} }, image: [ {% for img in article_images %}{{ get_url(pathimg) }}, {% endfor %} ], datePublished: {{ page.date | date(format%Y-%m-%dT%H:%M:%S) }}, dateModified: {{ page.updated | default(valuepage.date) | date(format%Y-%m-%dT%H:%M:%S) }}, mainEntityOfPage: { type: WebPage, id: {{ current_url }} } } /script几个变量值得说明。page.assets是文章同目录资源的路径列表脚本先用regex_replace筛出图片扩展名再逐个交给get_url解析成完整 URL。page.authors继承自 front matter 的authors或配置的author取第一个即可。current_url是模板全局变量指向当前页完整 URL无需 front matter 声明。其他类型页产品页用 Product活动页用 Event产品页、活动页等不属于文章的内容各自选对应类型产品页用Product活动页用Event标记放在渲染该页面的模板里。产品页建议单独建模板在 front matter 声明template字段 title 示例产品 template product.html price 199 priceCurrency CNY availability https://schema.org/InStock templates/product.html的head内放 Product 类型脚本script typeapplication/ldjson { context: https://schema.org, type: Product, name: {{ page.title }}, description: {{ page.description | default(valueconfig.description) }}, image: {{ get_url(pathpage.assets | first) }}, brand: { type: Brand, name: {{ config.title }} }, offers: { type: Offer, price: {{ page.extra.price }}, priceCurrency: {{ page.extra.priceCurrency }}, availability: {{ page.extra.availability }} } } /script活动页把type换成Event补上startDate、location字段即可思路与上面一致不再重复代码。让它可维护把标记拆成模板片段再按页面 include三种标记都写进主模板后page.html会越来越长。建议把每段脚本挪进独立片段再按页面类型 include。建templates/schema/目录放三个片段website.html、article.html、product.html各自只装一个script标签内容就是上一节对应的脚本。在主模板的head里用注释标记插入点再按条件 include{% include schema/website.html %} {# schema 脚本统一放在这里 #} {% include schema/article.html %}渲染的页面模板文件include 的片段首页index.htmlschema/website.html文章页page.htmlschema/article.html产品页product.htmlschema/product.html活动页各自的页面模板自建的schema/event.html判断规则一句话首页永远带WebSite带date的文章页带Articlefront matter 声明了template的页面按其类型 include 对应片段。以后加新页面类型只需多建一个片段文件不碰已有模板的主体结构。自测与验收本地预览加在线校验各做一次本地自测在站点根目录运行zola serve打开浏览器进入任一文章页查看页面源码确认head里存在application/ldjson脚本且内容是合法 JSON。这一步查不出字段级问题只查语法。上线前校验把页面 URL 粘进 Google 官方的 Rich Results Test富媒体搜索结果测试工具查看它解析出的富媒体类型和警告列表。工具能识别你声明的Article、Product等类型也能直接指出具体哪个字段不合法。⚠️ 容易踩的坑6 个报错形态和对应的修法JSON 语法错误——字段之间漏逗号、数组尾部多逗号、值没加引号报错形态通常是整段 JSON 被标记无效。修正把渲染后的脚本内容粘进任意 JSON 格式化校验器定位具体行生成数组时保持每行一个值、行尾逗号的写法不要手写换行。模板变量输出空值——{{ page.description }}这类变量缺省时输出搜索引擎不接受空串字段。修正给可选值套default过滤器或在外层用{% if %}判断后再输出。没有日期的页面输出datePublished——page.date为空时date过滤器会直接构建失败构建中断而不是静默跳过。修正确认该页 front matter 有date对可能没有日期的页面用{% if page.date %}包住整个 Article 脚本没有日期就不打标。标记放错模板层级——把 Article 脚本写在index.html等于只有首页带文章标记所有文章页都没有。修正WebSite只进index.htmlArticle只进page.html或文章专属模板产品、活动标记进各自模板。Tera 自动转义破坏 JSON——标题里带时{{ page.title }}输出的是amp;放进 JSON-LD 后搜索引擎拿到的是转义串。修正这是 Tera 的默认行为不要给 JSON-LD 里的值加| safe来修它如果标题必须含等特殊字符确认输出内容本身不含 HTML 实体让转义发生在渲染之后、解析之前保持原文即可或把特殊字符改写成普通文本。potentialAction指向不存在的搜索页——target 里的路径在你的站点 404这段声明就是无效声明。修正config.extra.search_path填真实存在的搜索页路径没有搜索页就删掉整个potentialAction字段。另外提醒一个静默失败JSON-LD 字段名必须与 Schema.org 属性名大小写完全一致datePublished写成datepublished不会报错但字段会被忽略。【免费下载链接】zolaA fast static site generator in a single binary with everything built-in. https://www.getzola.org项目地址: https://gitcode.com/GitHub_Trending/zo/zola创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Zola 添加 Schema.org 结构化数据：3 种页面的 JSON-LD 完整落地指南
Zola 添加 Schema.org 结构化数据3 种页面的 JSON-LD 完整落地指南【免费下载链接】zolaA fast static site generator in a single binary with everything built-in. https://www.getzola.org项目地址: https://gitcode.com/GitHub_Trending/zo/zola搜索结果里你的站点只是一条素链接而别人的结果带着摘要、作者和发布时间。这是标记差异不是流量运气。Zola 没有内置 Schema.org 支持但它的模板系统足以让你补上这块在几个模板里嵌入 JSON-LD一种以 JSON 文本写进网页的结构化数据格式搜索结果就能升级成富媒体展示。本文按首页、文章页、产品页逐页给出现成脚本。先看效果搜索结果从一条链接变成一张卡片改动前搜索引擎给你的页面展示的是一行蓝色标题加一条灰字摘要信息量和其他站点没有差别。加上结构化数据后同一条结果可以附带文章主图、作者名、发布日期产品页还能挂出价格与库存状态——这就是富媒体展示。差别不在你的页面本身而在你给爬虫提供的机器可读信息。30 秒原理结构化数据是什么谁来读它结构化数据是嵌在 HTML 里的机器可读描述搜索引擎爬虫会读取它并据此决定搜索结果能否展示摘要、图片、作者、日期等富媒体字段。JSON-LD 是这类信息最常见的承载形式一个script typeapplication/ldjson标签里面写一段 JSON字段名遵循 Schema.org 的属性命名。它不影响页面在浏览器里的显示只影响爬虫怎么理解页面。所以写错字段的代价是展示缺失写对字段的收益是一次性投入、全站页面持续生效。动手前核对config 项、页面变量和模板文件开始改模板前先确认这 5 件事都成立脚本里用到的变量才有值可取。zola.toml里base_url已指向真实部署地址title、description已填写文章的 front matter 里有dateArticle 标记需要发布时间有修改时间就再填updated项目templates/目录存在index.html、page.html两个文件若你的站点装了主题且想保留主题样式这两个文件需要自己建同名文件会覆盖主题的对应模板站点 logo 的静态文件路径已确认脚本里要用get_url解析出它的完整 URL想好的config.extra键位author默认作者名、logologo 路径、search_path搜索页路径这三个键会被脚本引用page变量自带的字段title、description、date、updated、assets、authors 等在官方文档有完整列表见 页面与 section 变量说明。按页面类型落地哪类页面用哪种 Schema 类型首页在 index.html 插入 WebSite 类型首页用WebSite类型。脚本放在index.html的head标签内script typeapplication/ldjson { context: https://schema.org, type: WebSite, name: {{ config.title }}, url: {{ config.base_url }}, description: {{ config.description }}, publisher: { type: Organization, name: {{ config.title }}, logo: {{ get_url(pathconfig.extra.logo) }} }, potentialAction: { type: SearchAction, target: {{ config.base_url }}{{ config.extra.search_path }}?q{search_term_string}, query-input: required namesearch_term_string } } /scriptWebSite标记只放首页不需要也不应该出现在page.html里。如果你的站点没有搜索页把potentialAction整段删掉其余字段保留。文章页在 page.html 插入 Article 类型文章页用Article类型位置在page.html的head标签内。这份脚本可以直接作为templates/schema/article.html片段使用下一节会用它做封装演示script typeapplication/ldjson {% set article_images page.assets | regex_replace(pattern^((?!\\.(?:png|jpe?g|webp|avif|gif)).*)$, rep, multilinetrue) %} { context: https://schema.org, type: Article, headline: {{ page.title }}, description: {{ page.description | default(valueconfig.description) }}, keywords: {{ page.taxonomies.tags | default(value[]) | join(sep, ) }}, author: {{ page.authors | first }}, publisher: { type: Organization, name: {{ config.title }}, logo: {{ get_url(pathconfig.extra.logo) }} }, image: [ {% for img in article_images %}{{ get_url(pathimg) }}, {% endfor %} ], datePublished: {{ page.date | date(format%Y-%m-%dT%H:%M:%S) }}, dateModified: {{ page.updated | default(valuepage.date) | date(format%Y-%m-%dT%H:%M:%S) }}, mainEntityOfPage: { type: WebPage, id: {{ current_url }} } } /script几个变量值得说明。page.assets是文章同目录资源的路径列表脚本先用regex_replace筛出图片扩展名再逐个交给get_url解析成完整 URL。page.authors继承自 front matter 的authors或配置的author取第一个即可。current_url是模板全局变量指向当前页完整 URL无需 front matter 声明。其他类型页产品页用 Product活动页用 Event产品页、活动页等不属于文章的内容各自选对应类型产品页用Product活动页用Event标记放在渲染该页面的模板里。产品页建议单独建模板在 front matter 声明template字段 title 示例产品 template product.html price 199 priceCurrency CNY availability https://schema.org/InStock templates/product.html的head内放 Product 类型脚本script typeapplication/ldjson { context: https://schema.org, type: Product, name: {{ page.title }}, description: {{ page.description | default(valueconfig.description) }}, image: {{ get_url(pathpage.assets | first) }}, brand: { type: Brand, name: {{ config.title }} }, offers: { type: Offer, price: {{ page.extra.price }}, priceCurrency: {{ page.extra.priceCurrency }}, availability: {{ page.extra.availability }} } } /script活动页把type换成Event补上startDate、location字段即可思路与上面一致不再重复代码。让它可维护把标记拆成模板片段再按页面 include三种标记都写进主模板后page.html会越来越长。建议把每段脚本挪进独立片段再按页面类型 include。建templates/schema/目录放三个片段website.html、article.html、product.html各自只装一个script标签内容就是上一节对应的脚本。在主模板的head里用注释标记插入点再按条件 include{% include schema/website.html %} {# schema 脚本统一放在这里 #} {% include schema/article.html %}渲染的页面模板文件include 的片段首页index.htmlschema/website.html文章页page.htmlschema/article.html产品页product.htmlschema/product.html活动页各自的页面模板自建的schema/event.html判断规则一句话首页永远带WebSite带date的文章页带Articlefront matter 声明了template的页面按其类型 include 对应片段。以后加新页面类型只需多建一个片段文件不碰已有模板的主体结构。自测与验收本地预览加在线校验各做一次本地自测在站点根目录运行zola serve打开浏览器进入任一文章页查看页面源码确认head里存在application/ldjson脚本且内容是合法 JSON。这一步查不出字段级问题只查语法。上线前校验把页面 URL 粘进 Google 官方的 Rich Results Test富媒体搜索结果测试工具查看它解析出的富媒体类型和警告列表。工具能识别你声明的Article、Product等类型也能直接指出具体哪个字段不合法。⚠️ 容易踩的坑6 个报错形态和对应的修法JSON 语法错误——字段之间漏逗号、数组尾部多逗号、值没加引号报错形态通常是整段 JSON 被标记无效。修正把渲染后的脚本内容粘进任意 JSON 格式化校验器定位具体行生成数组时保持每行一个值、行尾逗号的写法不要手写换行。模板变量输出空值——{{ page.description }}这类变量缺省时输出搜索引擎不接受空串字段。修正给可选值套default过滤器或在外层用{% if %}判断后再输出。没有日期的页面输出datePublished——page.date为空时date过滤器会直接构建失败构建中断而不是静默跳过。修正确认该页 front matter 有date对可能没有日期的页面用{% if page.date %}包住整个 Article 脚本没有日期就不打标。标记放错模板层级——把 Article 脚本写在index.html等于只有首页带文章标记所有文章页都没有。修正WebSite只进index.htmlArticle只进page.html或文章专属模板产品、活动标记进各自模板。Tera 自动转义破坏 JSON——标题里带时{{ page.title }}输出的是amp;放进 JSON-LD 后搜索引擎拿到的是转义串。修正这是 Tera 的默认行为不要给 JSON-LD 里的值加| safe来修它如果标题必须含等特殊字符确认输出内容本身不含 HTML 实体让转义发生在渲染之后、解析之前保持原文即可或把特殊字符改写成普通文本。potentialAction指向不存在的搜索页——target 里的路径在你的站点 404这段声明就是无效声明。修正config.extra.search_path填真实存在的搜索页路径没有搜索页就删掉整个potentialAction字段。另外提醒一个静默失败JSON-LD 字段名必须与 Schema.org 属性名大小写完全一致datePublished写成datepublished不会报错但字段会被忽略。【免费下载链接】zolaA fast static site generator in a single binary with everything built-in. https://www.getzola.org项目地址: https://gitcode.com/GitHub_Trending/zo/zola创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考