wordpress标签说明,wp:post-title

云游道人 2026-02-08 5 阅读 0评论

这段代码  是 WordPress 块编辑器（Gutenberg）的核心块标记，用于动态显示当前文章或页面的标题，并通过参数控制标题的 HTML 层级。以下是详细解析：

核心功能

自动输出当前内容标题

在文章/页面单页中：显示该内容的标题（如 <h1>Hello World</h1>）。
在文章列表（如博客首页）中：显示每篇文章的标题（通常包裹在 <h2> 中，需配合 wp:query-loop 使用）。

"level":1 参数的作用

强制指定标题的 HTML 标签为 <h1>（最高层级），覆盖默认逻辑。
若省略此参数，WordPress 会根据上下文自动选择标签（如单页用 h1，列表项用 h2）。

代码分解

部分	说明
`wp:post-title`	块类型，表示「文章标题」块，数据来自当前文章/页面。
`{"level":1}`	参数：强制使用 `<h1>` 标签渲染标题（SEO 优化时常用）。
`/-->`	自闭合标签，无需嵌套内容。

输出示例

单篇文章页（single.html）

渲染为：

<h1 class="wp-block-post-title">我的第一篇文章</h1>

文章列表（home.html）

渲染为每篇文章标题：

适用场景

单页模板优化

确保文章主标题始终为 <h1>（SEO 最佳实践）。
示例（single.html）：

<article>   </article>

自定义列表布局

在归档页中控制标题层级（如设为 <h2> 避免与页面主标题冲突）。

动态标题样式

通过 CSS 类 .wp-block-post-title 统一设计标题样式。

参数选项

`level` 值	输出标签	典型用途
`0`	无	仅文本（用 `<div>` 包裹）
`1`	`<h1>`	文章/页面主标题（SEO 关键）
`2`	`<h2>`	次级标题（如相关文章列表）
...	...	...
`6`	`<h6>`	最低级标题

SEO 注意事项

单页必须有一个 <h1>：若页面已有其他 h1（如站点标题），需避免重复。可通过以下方式解决：

列表页避免滥用 <h1>：在文章列表（如首页）中，通常应为每篇文章标题使用 <h2>。

自定义样式

通过 CSS 控制标题外观：

/* 全局文章标题样式 */ .wp-block-post-title { color: #333; font-family: "Georgia", serif; margin-bottom: 0.5em; } /* 单页标题特殊样式 */ .single .wp-block-post-title { border-bottom: 2px solid #0073aa; }

与其他标题块对比

块名称	作用	数据来源	典型 HTML 标签
`wp:post-title`	当前文章/页面标题	文章内容	`<h1>`-`<h6>`
`wp:site-title`	网站标题	后台「常规设置」	`<h1>` 或自定义
`wp:query-title`	分类/搜索页标题	当前查询类型	`<h1>`（如“分类：科技”）