如何获取到</Head>之前的HTML?

时间:2017-07-25 作者:Lucio Crusca

我正在编写一个插件,在single_template. filter函数成功地将路径返回到myshow-post-in-a-lightbox.php 样板

正如您从其名称可以猜到的,我的模板旨在在灯箱中显示一篇文章。因此,我只需要显示帖子内容,避免显示标题栏、菜单、边栏、页脚等。然而,为了正确显示帖子内容,我需要<head> 包含所有<link> 所需样式表的标记,以及<script> 标签。

到目前为止,我的模板代码是:

<?php
/*
 Template Name: show-post-in-lightbox
 *
*/

get_header(); 
?>

<div id="primary" class="content-area">
  <main id="main" class="site-main" role="main">
    <?php
    global $post;
    // Start the loop.
    while ( have_posts() ) : the_post();

      $content = $post->post_content;
      $content = apply_filters(\'the_content\', $content);
      $content = str_replace(\']]>\', \']]&gt;\', $content);
      echo $content;
它的工作原理是显示帖子内容,但它也会在上面显示标题横幅,以及站点徽标、标题(我不是说<title>, 这个没问题,但我是说<header id="masthead" class="site-header">), 以及所有其他的。

如果我把get_header(); 它只输出内容,但不输出所需的样式和脚本。

是否有只返回(或输出)<head> 标签(或仅限于</head> 标签)的标签?

3 个回复
最合适的回答,由SO网友:Lucio Crusca 整理而成

我最终得到了类似于马克·卡普伦在回答中所建议的东西,但我没有使用JS代码,而是选择了CSS解决方案。

当我的代码创建<iframe> 链接,它附加了一个额外的HTTP参数:

$lightboxlink = \'/?p=\'.$postid.\'&use-lightbox-css=1\';
然后插件检查该参数,如果存在,它会将额外的CSS文件放入队列。

以下是CSS文件内容:

header {
  display: none !important;
}
我知道,我不应该使用!important. 为了避免这种情况,插件使用尽可能低的优先级(PHP\\u INT\\u MAX)来add_action 调用注册我的函数wp_enqueue_style 呼叫这样,我的额外CSS将作为<iframe> 标记,它优先于所有其他标记(这是Cascading CSS的含义)。现在我可以脱掉!important:

header {
  display: none;
}
这只适用于实际使用<header> 标签,但目前它对于我的用例来说已经足够好了。无论如何,将其调整到其他主题只是将所需的选择器添加到CSS文件中的问题,例如,这里是我有时使用的Wiz主题的第一个猜测:

header, .header-vh-wrapper, .navbar-inner, .nav-container, .logo, #title {
  display: none;
}

SO网友:Mark Kaplun

前端样式通常是插件应该避免的主题领域。如果不进行完整的样式设计,就无法简单地知道任何东西是如何进行样式设计的,因为其中一些样式将取决于内容本身,而且由于样式设计基本上是来自插件作者POV的随机设置,因此您不太可能有一个通用的算法来以可靠的方式将其调整到您需要的任何位置。

我想到的最佳方法是用自己的div包装内容,并使用JS隐藏页面上的所有其他内容。不过,你很可能会在你的灯箱中得到一种移动类型的VIE,这可能不是你想要的。

SO网友:Jacob Peattie

您可以使用wp_head() 函数,只需添加开口htmlbody 标签和头部标签:

<?php
/*
 * Template Name: show-post-in-lightbox
 */
?>
<!DOCTYPE html>
<html>
<head>
    <?php wp_head(); ?>
</head>

<body>

<!-- Content here -->

<?php get_footer(); ?>
如果页脚关闭除htmlbody, 确保在此模板中打开它们。

而且wp_head() 不必在head元素中包含所有内容,请检查主题的标题。php文件。它应该有wp_head() 函数本身,只需检查您可能需要包含在head.

另一个选项是复制标题。php,将其重命名为header post。php,删除您不想出现在帖子上的所有内容,然后在您的cutstom模板中,使用get_header( \'post\' ); 要使用该版本的标头,请执行以下操作:

<?php
/*
 * Template Name: show-post-in-lightbox
 */

get_header( \'post\' ); ?>

<!-- Post content here -->

<?php get_footer(); ?>

结束

相关推荐

Templates for Mobile Site

是否有任何内置方法可以根据浏览器大小显示不同的模板(即移动设备检测)?我做了一些研究,我能找到的只是大量插件,它们的功能远远超出了我的需要。我基本上只需要一种方法,将移动目录添加到我的主题中,并为移动用户显示该主题。