Wrap h1-h6 in a div

时间:2019-03-29 作者:Josh Rodgers

所以,我用的是标题标签h1-h6 在我的各个地方的网站上,我想做的是div 使用WP函数围绕这些标记。现在我正在使用一些jQuery来完成这项工作,但我正在尽量减少我网站上jQuery的数量,所以我想最好使用某种preg_replace 要查找任何h1-h6标记并添加外部div。

我当前的jQuery如下所示:$("h6, h5, h4, h3, h2, h1").wrap(\'<div class="title"></div>\');

我找到了一些适用于图像的代码,但我不确定如何调整它,所以我可以将其用于标题标记:

function outer_img_wrap( $content ) {
    $image = \'/(<img([^>]*)>)/i\';
    $wrapper = \'<span class="featured">$1</span>\';
    $content = preg_replace( $image, $wrapper, $content );
    return $content;
}
add_filter( \'the_content\', \'outer_img_wrap\' );
非常感谢您的帮助。这个函数不必看起来像那样,只是发现对于图像来说,它很好,很简单。

谢谢,乔希

2 个回复
最合适的回答,由SO网友:Rizwan Zakir 整理而成

Try this code

function wrap_heading_with_div( $content ) {
    $heading = \'/<h\\d.*?>(.*?)<\\/h\\d>/ims\';
    $wrapper = \'<div class="title">$0</div>\';
    $content = preg_replace($heading, $wrapper, $content);
    return $content;
}
add_filter( \'the_content\', \'wrap_heading_with_div\' );

Live Demo

SO网友:Krzysiek Dróżdż

您发布的代码是一个很好的起点。您所要做的就是更改其中的表达式。

这有点棘手,因为您必须替换开头和结尾标记。我会选择这样的方式:

function wrap_headers_with_div( $content ) {
    $content = preg_replace(\'/<h([1-6])>/\', \'<div class="title"><h$1>\', $content);
    $content = preg_replace(\'/<\\/h([1-6])>/\', \'</h$1></div>\', $content);

    return $content;
}
add_filter( \'the_content\', \'wrap_headers_with_div\' );

相关推荐

无法正确设置_TITLE ADD_FILTER以显示SHORT_URL

我试图为我的博客帖子显示Bitly的帖子短URL,但似乎有些不对劲,因为当我使用此代码时,我看到页面上所有菜单项的输出等。。。此外,URL似乎没有正确输出。经过多次尝试,我尝试使用以下方法:function shorturl_after_title( $title ) { if ( function_exists(\'wp_get_shortlink\') && is_single() && \'post\' == get_post_type() ) {&#