做WordPress网站时,你是不是经常遇到这样的烦恼:明明想用页面构建器设计一个漂亮的全宽页面,可页面上方总顶着一个大标题,怎么都看不顺眼。又或者你想把某个页面做成落地页,标题却总是抢了风头。
别担心,今天我就手把手教你4种隐藏WordPress页面标题的方法,每一种都通俗易懂,保证你看完就能操作。
如果你不想动太多脑筋,也怕改错代码,CSS方法绝对是最佳选择。
.page-title {
display: none;
}
如果你只想隐藏某一个特定页面的标题,可以使用页面专属的body类名,比如:
.page-id-123 .page-title {
display: none;
}
这里的123换成你自己的页面ID(在页面列表里,鼠标放到页面名称上,浏览器底部会显示post=123这样的数字)。
优点: 无需插件,不会改坏文件,一键恢复。 缺点: 对CSS不太熟悉的新手可能会复制错类名,而且每个主题的CSS类名不同,需要自行调整。
如果你希望整个网站的页面标题全部隐藏,或者想让代码更“硬核”一点,可以用这个方法。
functions.php文件add_action( 'wp', 'hide_page_title_globally' );
function hide_page_title_globally() {
if ( is_page() ) {
add_filter( 'the_title', function( $title, $id ) {
// 只隐藏页面正文里的标题,不影响菜单等其它位置
if ( is_page() && in_the_loop() ) {
return '';
}
return $title;
}, 10, 2 );
}
}
注意: 这段代码会隐藏所有页面的标题(但是文章标题不受影响)。如果你只想隐藏某个特定页面,可以把代码里的is_page()改为is_page( array( 123, 456 ) ),只隐藏ID为123和456的页面。
优点: 功能强大,可精确控制范围,且不会受主题更新影响。 缺点: 需要有一点点代码基础,如果格式错误可能会导致网站白屏。建议修改前先备份原文件。
如果你连CSS都不太想碰,那就直接用插件吧。这里推荐两款免费又好用的:
优点: 图形化操作,零门槛,随时开关。 缺点: 需要额外安装插件,可能会稍微影响网站加载速度(不过这种小插件影响几乎可以忽略)。
很多高级WordPress主题,比如Astra、GeneratePress、OceanWP等,本身就有“隐藏页面标题”的开关,根本不用上面那么麻烦。
如果你不知道自己的主题有没有这个功能,可以在后台页面编辑界面的右侧栏里找找,一般会有一个“主题设置”区域,里面有类似“显示页面标题”的开关。
优点: 官方提供选项,兼容性最好,不用写代码也不用装插件。 缺点: 仅限支持该功能的主题,如果你用的是老主题或自研主题,可能没有这个选项。
有时候你会发现,标题没了,但它原本占据的空白区域还在,页面顶部多了一块空白。这是因为很多主题给标题容器保留了高度。
解决方法:在你刚才用的CSS里,再加一句:
.entry-header {
display: none;
}
或者用更彻底的方式,把标题容器也隐藏掉:
.page-title, .entry-header {
display: none !important;
}
注意,不要滥用!important,除非你实在没办法了。
| 方法 | 难度 | 适合场景 |
|---|---|---|
| CSS代码 | ★☆☆☆☆ | 新手快速隐藏,不需要装插件 |
| functions.php代码 | ★★★☆☆ | 需要全局控制或精确控制多个页面 |
| 插件 | ★☆☆☆☆ | 不想碰任何代码的纯小白 |
| 主题自带选项 | 无难度 | 你的主题支持的话,首选这个 |
不管你是菜鸟还是老手,总有一种方法适合你。以后再遇到页面标题碍眼的情况,直接用这些方法搞定,再也不用对着标题叹气了。
如果你在操作过程中遇到任何问题,或者发现自己的主题类名不一样,欢迎在评论区里留言,我们一起解决。祝你的WordPress网站越做越好看!