【问题标题】:How to hide header on specific page in wordpress如何在wordpress中隐藏特定页面上的标题
【发布时间】:2017-04-14 17:27:33
【问题描述】:

我正在尝试在 WordPress 中隐藏特定页面上的标题。我知道我可以使用 CSS 来做到这一点。

仪表板中显示的页面ID是:

wp-admin/post.php?post=31221&action=edit

页面有一个没有 id 或类的标题(不确定是谁创建的)。但我可以隐藏标题:

header {display: none;}

我似乎无法隐藏特定页面上的标题。我试过了:

.page-id-31221 header {display:none;} .pageid-31221 header {display:none;}

我也尝试过 # 和 postid 等。还有其他方法可以隐藏该页面上的标题吗?

如果在模板中调用标题后,有没有办法隐藏标题?我已经为页面创建了一个自定义模板,但我不确定用于隐藏它的 php。如果我从模板中删除<?php get_header();?>,那么整个页面就会消失。

网站在这里:Website

【问题讨论】:

  • 在你的 header.php 文件中放置一个 IF 语句 if(!is_page('PAGE_NAME_HERE')) { // show header } 你为什么要隐藏页面?
  • 在您链接的页面的源代码中没有.page-id-31221 类。为了补充 cosmoonot 所说的内容,您可以指定页面 ID 而不是标题,这样您就不必担心页面重命名会破坏隐藏功能。
  • 我同意页面 ID 上的@Optimae。
  • 好的,只是为了清楚。如果我将 if(!is_page('.page-id-31221')) { // show header } 放在 header.php 中,那将隐藏该特定页面上的标题?
  • 这很容易通过自定义模板和 JQuery 解决。请参阅下面的答案,以获得简单的解决方案。

标签: php css wordpress


【解决方案1】:

您可以通过添加一个 IF 语句来修改您的 header.php,该语句通过 页面/帖子 ID标题 检查所需页面。

页面/帖子 ID 方法:

if(is_page(get_the_ID()) != YOUR_PAGE_ID) { // show header }

页面/帖子标题方法:

if(!is_page(get_the_ID('PAGE_POST_TITLE'))) { // show header }

这些方法中的任何一种都应该有效。 *未经测试。

【讨论】:

  • 这将要求在网站上每个页面的每个页面加载时都运行 if 语句,这对页面加载性能的影响很小但不必要。
【解决方案2】:

你说你已经为这个特定页面创建了一个模板。

在这种情况下,您可以使用 jQuery 隐藏标题。将此添加到页面模板的末尾(或开头)。

<script>jQuery('header').hide();</script>

您可能希望将其包装在 jQuery( document ).ready(function() { 之类的东西中,以确保在脚本运行之前加载页面。也可以添加 defer 属性。

【讨论】:

  • 谢谢。没想到模板中有一个简单的jQuery脚本。辛苦了。
  • 很高兴它成功了。简单的解决方案总是最好的。
  • 那个页面也会有自己的类,所以根本不需要jQuery。
  • @NathanielFlick 是吗?
  • 如果模板创建正确,页面正文中将包含带有页面名称的类。看起来好像做得不对。
【解决方案3】:

您可以通过检查页面名称来做到这一点。

if( is_page( array( 'about-us', 'contact', 'management' ) ){ #hide your header; }

如果您想了解更多详细信息,请阅读 wordpress 官方文档。这将对您有所帮助。 Read wordpress official documentation

【讨论】:

    【解决方案4】:

    这对我有用。一个简单的技巧:

    在顶部示例的 header.php 中检查您的样式类名称:class="header">

    并将此代码放在您的 php 模板或页面的顶部。

    <head>
    <style>
    .header { display: none; }
    </style>
    </head>
    <body>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-04-07
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多