WordPress 不会自动将根级短代码内容包装在段落标签中

Question

当在文本块内使用短代码时，它会按预期显示。然而，当单独在一行中使用时，内容会以某种方式绕过 WordPress 的自动段落换行，因此样式会有所不同。

考虑以下设置：

/**
 * A shortcode that just returns the content its wrapping
 */
function do_echo_shortcode( $args, $content ): string {
    return $content;
}
add_shortcode( 'echo', 'do_echo_shortcode' );

在网站上创建新帖子，我在所见即所得编辑器中输入以下内容：

这是一段

[echo]这也是一个[/echo]

但是这里有一个段落内的[echo]echo[/echo]！

查看页面时，会生成以下 HTML：

<p>This is a paragraph</p>
This is also one
<p>But here’s an echo inside a paragraph!</p>

因此，第二行的样式有所不同，因为它不会自动包装在段落标记中。

更改上面的 do_echo_shortcode 函数，我可以对内容应用过滤器：

return apply_filters( 'the_content', $content );

这解决了问题，但引入了一个新问题，因为它打破了第三行。生成的 HTML 如下：

<p>This is a paragraph</p>
<p>This is also one</p>

<p>But here’s an </p><p>echo</p>
inside a paragraph!<p></p>

通过创建调试函数并将其附加到“the_content”过滤器挂钩，我们可以看到正在处理的内容：

function debug_the_content( $content ) {
    // print the content to the log, or attach a debugger here to see the content
    return $content;
}
add_filter( 'the_content', 'debug_the_content' );

这给了我一些有趣的见解，但我仍然无法解决问题。对于上面的第一个示例（无需手动过滤简码函数中的内容），我们看到“$content”的以下值：

1. <p>This is a paragraph</p>\n <p>But here&#8217;s an  inside a paragraph!</p>\n

2. This is also one

3. echo

4. <p>This is a paragraph</p>\nThis is also one\n<p>But here&#8217;s an echo inside a paragraph!</p>\n

最后，为了总结整个事情，这是我希望实现的输出：

<p>This is a paragraph</p>
<p>This is also one</p>
<p>But here’s an echo inside a paragraph!</p>

Answer 1

最简单的选择就是在所见即所得编辑器中将短代码包装在 P 标签中......

This is a paragraph

<p>[echo]This is also one[/echo]</p>

But here's an [echo]echo[/echo] inside a paragraph!

或者您可以向您的短代码标签添加自定义属性，如下所示...

This is a paragraph

[echo tag="p"]This is also one[/echo]

But here's an [echo]echo[/echo] inside a paragraph!

使用这个

add_shortcode

函数，请参阅下面代码中的注释...

/**
 * shortcode that just returns the content value
 * excepts 'tag' attribute to define html tag to wrap content inside
 */
function do_echo_shortcode($atts, $content = null) {

    // check if the 'tag' attribute exists and is not empty
    if (isset($atts['tag']) && !empty($atts['tag'])) {
    
        // extract and sanitize the 'tag' attribute
        $tag = sanitize_html_class($atts['tag']);

        // wrap the content in the specified html 'tag'
        $output = '<' . $tag . '>' . do_shortcode($content) . '</' . $tag . '>';

    } else {
    
        // if html 'tag' wrapper attribute is not defined, return the content as is
        $output = do_shortcode($content);

    }

    // return final shortcode output
    return $output;
    
}

// add do echo shortcode
add_shortcode('echo', 'do_echo_shortcode');

希望这有帮助👍🏼