如何隐藏WordPress页面和文章标题

如何隐藏WordPress页面和文章标题

您刚刚在 WordPress 中完成了一个页面的设计或一篇文章的撰写,在去预览您的作品时,您发现页面标题看起来完全不合适,完全破坏了您的设计。

遗憾的是,WordPress 并没有防止显示标题的简单方法。也没有简单的自定义方法,它看起来如何取决于你的主题。如果标题太大太碍眼,你该怎么办?这就是为什么在 WordPress 中隐藏页面标题的过程是必不可少的。

你的第一反应可能是直接删除页面上的标题,但在尝试之前请先等等,因为这样做实际上会影响搜索引擎优化。如果你想让标题永远消失,你有哪些选择呢?

WordPress 中可能没有一个简单的 “隐藏标题” 选项,但删除标题并不难。实际上,无论你是只想禁用一个标题还是隐藏所有标题,你都有很多选择。

以下是在 WordPress 中隐藏页面标题的五种可行方法。

为什么要隐藏页面标题?

并非网站上的每个页面都需要标题。虽然博客文章需要标题,但在其他页面上并不总是很好看。对于博客来说是好的设计,但对于网站的其他部分来说却并不总是可以接受的。

例如,在主页上使用 “主页 “标题是不必要的,甚至会显得有点不专业。与 “关于” 或 “服务” 类似,这样的页面本身就说明了问题,在顶部设置标题可能是多余的。

标题元素在整体设计中也可能显得格格不入。虽然你可以使用 CSS 来调整它的样式,让它更合适,但最好的选择也许是把它完全去掉。你可以利用这个空间添加一张英雄图片或其他样式元素。

大多数情况下,你甚至不想完全删除标题–也许只是它的位置或主题样式困扰着你。如果你的页面标题放在一个奇怪的地方,或者与你的设计不协调,你可以隐藏它,然后在其他地方插入一个 H1 标题。

但隐藏页面标题并不像删除图片或一段文字那么简单。标题确实会影响搜索引擎优化和搜索引擎对页面层次结构的解读。在隐藏所有标题之前,有几件事需要考虑。

搜索引擎优化注意事项

谷歌等搜索引擎使用名为 “爬虫” 的机器人访问网站,并对网站页面进行索引。在索引网站时,它们会阅读标题、页面文本和页面层次结构等元素,以了解页面的内容。

这个过程可以帮助它们向搜索特定词条的用户显示相关页面,遵循搜索引擎优化最佳实践的网站在排名上会有一些提升。
如果你在谷歌上搜索 “如何加快 WordPress 网站速度”,你会发现你看到的片段标题通常与文章标题一致。

网页标题由 HTML 标题标签决定,如果没有标题标签,则由 H1 标题决定。如果这两个标签都不存在,搜索引擎就会把找到的第一个标题或随机文本字符串作为标题。这在搜索引擎片段中会显得非常糟糕。

明白我们的意图了吗?移除 H1 标题,不留任何替代内容,可能会对搜索引擎优化和点击率产生负面影响

即使你只隐藏页面标题而不删除它,搜索引擎爬虫通常也会忽略隐藏的元素,所以这也无济于事。良好的层次结构–页面包含一个 H1 元素以及适当的 H2 或 H3 标题–也有助于爬虫(以及人们!)了解页面的内容。

不过,严格来说,H1 标题并不是搜索引擎优化所必需的。它们对提供页面结构很有用,而且是强烈建议使用的。

那么该如何解决呢?最简单的办法就是使用 Yoast SEO 等插件。这些插件允许你为每个页面设置 “搜索引擎优化标题”。这样,你仍然可以得到一个漂亮的搜索引擎结果,但你可以去掉那个恼人的标题,而且不会受到任何惩罚。

Title 标签和 H1 标题有什么区别?

Title 标签和 H1 标题都会影响搜索引擎对网站内容的理解,而且两者通常相同,那么两者之间的主要区别是什么?

标题标签是 HTML <title> 元素。它是网站底层代码的一部分,人类通常看不到。但爬虫可以读取它,并用它来设置搜索引擎片段的标题。您的主题通常会将其设置为与您在后台设置的文章或页面标题相匹配,或者 SEO 优化插件可以手动更改。

另一方面,访客可以看到 H1 标题。标题通过嵌套部分和分割内容来构建页面结构,以便于阅读,而 H1 则是介绍内容的标题。

大多数 WordPress 主题都会根据文章/页面标题插入 H1 标题,并在幕后设置 <title> 标签。

搜索引擎会优先使用 HTML <title> 标签,而不是 H1。如果没有 <title> 标签,则会使用 H1 标题。

虽然在功能上没有太大区别,但这种区别非常重要。

如何在 WordPress 中快速隐藏所有页面和文章标题

这些方法一般都很安全,不会造成任何问题,但在添加任何自定义代码安装插件之前,请务必备份您的网站

有一些方法可以选择性地隐藏帖子或页面的标题,我们将在下文中介绍。

不过,让我们先来看看如何通过一个小小的 CSS 技巧来隐藏 WordPress 中的所有文章和页面标题。只需一行代码就能让这些标题永远消失。

WordPress 的仪表板中,进入外观 > 自定义,找到附加 CSS 菜单。在出现的代码框中,粘贴以下代码:

.entry-title {
display: none;
}

你会立即看到右侧预览中的所有标题都消失了,就这么简单。访问单个帖子或页面时,标题也会消失。但你会发现,”最近发布的文章” 等小工具仍会使用你在后台设置的标题,不会出现问题。

如果这段代码对你不起作用,你需要弄清楚你的主题使用什么 CSS 类来显示标题。在主题定制器右侧的网站预览中,右键单击文章标题,然后单击 “检查”。根据浏览器的不同,可能会改为 “检查元素” 或 “检查器”。

检查页面元素

检查页面元素

将弹出一个新的屏幕,突出显示代码区域。在高亮显示的代码周围查找 H1 或 H2 类名称,例如 <h2>

可能会显示 “post-title”、”page-title” 或其他名称,而不是 “entry-title”。

使用我们上面提供的 CSS 代码,将 “entry-title” 换成你的主题使用的 CSS 类。效果应该会很好。

编辑文章标题 CSS 类

编辑文章标题 CSS 类

如何在 WordPress 中隐藏页面标题

也许你并不想删除所有页面标题;如果你只想隐藏网站上的所有页面(而不是文章)标题呢?在这种情况下,你只需稍微调整一下上面的 CSS 代码。只需在代码前面添加 “.page” 即可。例如:

.page .entry-title {
display: none;
}

这样就可以立即隐藏 WordPress 网站上的所有页面标题。

如何隐藏单个页面的标题

想在 WordPress 中只隐藏一个页面的标题?你有两个选择:安装一个插件,或者使用上述 CSS 代码的修改版,根据页面 ID 隐藏页面标题。

有一些插件专门用于隐藏标题,比如 Hide Page And Post Title 插件。

与其下载一个小插件(网站上插件过多会带来网站安全隐患),你还可以尝试使用页面生成器

其中一个例子就是 Elementor。它可以通过简单的切换隐藏页面标题。进入后台的任何页面,点击 “使用 Elementor 编辑”,然后点击左下角的 “设置 “齿轮。

现在打开隐藏标题,你的页面标题就会消失。

在 Elementor 中移除标题

在 Elementor 中移除标题

最后一种方法是编辑旧的 CSS 代码,使其只针对特定页面,而不是所有页面。

首先,你需要找出页面的 ID。在后台,转到 “所有页面”,然后将鼠标悬停在标题上。

在左下角,应该会出现一个链接地址预览。在其中,你会看到 “post=” 字符串的末尾。这个数字就是页面 ID。

WordPress 页面 ID

WordPress 页面 ID

现在,使用 CSS 将 ID 替换为 “0”,并使用找到的 ID 来定位该页面,就像这样:

.page-id-0 .entry-title {
display: none;
}

目标文章 ID

目标文章 ID

如果这些方法对你不起作用,你的主题可能使用了不同的 CSS 类

访问你试图锁定的页面,按 F12 键在 Chrome 浏览器中调出开发者控制台。按 Ctrl-F 键,输入 “body”,使用导航箭头向下跳,直到看到 “<body class=” 和一大串类。

查找带有页面 ID 的类,然后替换上面代码中的类。

例如,如果你在列表中看到一个名为 “page-id-113” 的类,就可以用这段代码来代替:

.page-id-113 .entry-title {
display: none;
}

如何删除 WordPress 页面的标题

你可能会想,为什么不把页面标题留空呢?如果你只想删除标题,这很容易做到: 进入页面 > 所有页面。悬停页面并单击 “快速编辑”,然后将标题留空并单击 “更新”。

你也可以点击标题或悬停并点击编辑,然后找到顶部的标题,删除里面的文字,再点击更新。当你回到 “页面” 界面时,它们将被标记为 “(无标题)”,并在你的实时网站上消失。

这看似是最简单的解决方案,但实际上并不是一个好主意。固定链接对搜索引擎优化很重要,WordPress 通常会根据标题生成固定链接。如果没有固定链接,WordPress 就会使用数字或随机字母串创建固定链接,这可能会导致惩罚。

您可以手动更改固定链接(或 “URL slug”),但您必须记住每次都要这样做。

不良链接示例

不良链接示例

此外,没有标题的文章和页面在后台显示为”(无标题)”。如果您的网站上有几十个或几百个这样的标题,要在这些杂乱无章的标题中找到您要找的标题,很快就会变成一场后勤噩梦。

没有标题的文章和页面

这不仅仅是你的问题。根据您的主题,无标题的页面或帖子也会在您的前端网站上显示为”(无标题)”,例如,如果您将该页面放在菜单中,或正在使用 “最近文章” 小部件。这将使您的网站几乎无法浏览。

小工具中没有标题的示例

小工具中没有标题的示例

如果这还不够糟糕,你的布局中原来有标题的地方还会留下一个大洞。这就是这种去除 WordPress 页面标题的勉强方法的致命伤。

虽然直接空白标题可能很简单,但我们还是建议你选择其他方法 – 安装插件或插入 CSS。隐藏标题比直接删除标题要好得多。

如何隐藏博客文章标题

在 WordPress 中隐藏所有文章标题和隐藏所有页面标题一样简单。使用与之前相同的 CSS,你不需要在代码前添加 .page,而是需要添加 .post,如图所示:

.post .entry-title {
display: none;
}

现在,您的所有文章都不会显示标题,但正常页面会显示标题。

没有标题的博客文章

没有标题的博客文章

隐藏单篇 WordPress 博文的标题

隐藏博文标题的方法与上述隐藏页面标题的方法大致相同。您可以安装一个标题移除插件,使用页面生成器手动移除标题,或者使用 CSS 针对文章 ID 进行移除。

如果你想使用 CSS,那么使用的代码会有一些不同。同样,你应该进入后台,悬停你要移除标题的文章,查看其 ID,然后尝试使用这段代码。确保将 “0” 替换为您要删除的文章 ID。

.postid-0 .entry-title {
display: none;
}

如果还不行,请在您要针对的文章上按 F12 键,查看开发人员控制台。按 Ctrl-F,输入 “body”,然后找到 “<body class=”,查看该页面使用的类列表。在列表中搜索带有 ID 编号的类,如 “post-11″,然后用正确的类替换上面的代码。

如何删除 WordPress 中博客文章的标题

如前所述,完全删除文章或页面的标题并不是一个好主意。我们强烈建议不要这样做,因为这会给您的固定链接、搜索引擎优化甚至网站布局带来问题。

但如果你真的想这样做,过程与删除页面标题类似。

进入 “文章”>”所有文章”,查看网站上所有博客条目的列表。悬停要删除的文章标题,然后单击快速编辑。空白标题,然后点击更新。或者直接点击编辑进入古腾堡编辑界面,点击顶部的标题,然后删除标题文本。

删除博文标题

删除博文标题

点击更新,标题就会永远消失。请记住,这会将每篇博文的标题替换为”(无标题)”,所以如果你在浏览数百篇博文时遇到困难,可以尝试使用插件或 CSS 选择器来隐藏它们。

小结

WordPress 中没有隐藏页面标题的内置按钮,但您仍有很多选择来实现这一功能。对于单个文章或页面,你可以安装一个插件,增加随意关闭或打开标题的功能。或者,你也可以利用 CSS 隐藏所有页面标题,或者针对特定页面隐藏标题。

应始终避免简单地在后台空白标题,因为这会给搜索引擎优化和固定链接带来问题,使后台变得杂乱无章,并且会扰乱调用文章/页面标题(如菜单或 “最近文章” 小工具)的功能。

无论如何,请记住 H1 标题或 HTML 标题元素都是必要的,以免被搜索引擎惩罚。如果决定隐藏标题,应考虑安装 SEO 优化插件,并确保在每个页面设置 “搜索引擎优化标题” 或 “HTML 标题” 元素。

评论留言