内部嵌套短代码不起作用 - 例如：列未显示在行内

Question

我想创建特殊样式的列，但让客户仍然可以轻松编辑列的内容。所以我创建了自己的短代码来设置行和列。（这是我为特定客户创建的自定义 wordpress 模板）。

这是我的 function.php 中两个简码 'member-row' 和 'member' 的代码：

    add_shortcode('member-row', function ($content = null) {
        return '<div class="row">
        <br />'.do_shortcode($content).'</div>';
    });


    add_shortcode('member', function ($atts, $content = null) {
       extract(shortcode_atts(array(
          'color' => 'white',
       ), $atts));
        return '<div class="col-md-6 col-sm-6 col-xs-12 md-margin-bottom-40">
    <div class="member-col funny-boxes funny-boxes-top-'.$color.'">'.do_shortcode($content).'</div>
    </div>';
    });

我还在内部嵌套的 'member' 列短代码中添加了 .do_shortcode($content). - 以防万一客户想要在每列中添加其他短代码。（注意：即使我将 'member' 短代码更改为仅使用 .$content.，问题仍然存在）

这是我在 wordpress 页面编辑器 text 端输入的代码

    [member-row]
    [member color="gold"]

    <a href="http://www.example1.com/"><img class="aligncenter img-responsive" src="http://localhost/test/testWP/wp-content/uploads/2015/07/logo1.jpg" alt="logo" /></a>
    <strong>Company 1</strong>
    Address
    Telephone
    <a href="http://www.example1.com/" target="_blank">www.example1.com</a>

    [/member][member color="yellow"]

    <a href="http://www.example2.com/"><img class="aligncenter  img-responsive" src="http://localhost/test/testWP/wp-content/uploads/2015/07/logo2.jpg" alt="logo" /></a>
    <strong>Company 2</strong>
    Address
    Telephone
    <a href="http://www.example2.com/" target="_blank">www.example2.com</a>

    [/member]
    [/member-row]

当我保存并单击 'view page' 时，已添加的部分不显示任何内容。

这是生成的 html 代码：

    <div class="row">
    <br /></div>

所以它只执行 'member-row' 简码，而不执行嵌套的 'member' 简码列。

这是我期望的正确 html 代码：

    <div class="row">
    <br />
    <div class="col-md-6 col-sm-6 col-xs-12 md-margin-bottom-40">
    <div class="member-col funny-boxes funny-boxes-top-gold">
    <a href="http://www.example1.com/"><img class="aligncenter img-responsive" src="http://localhost/test/testWP/wp-content/uploads/2015/07/logo1.jpg" alt="logo" /></a>
    <strong>Company 1</strong>
    Address
    Telephone
    <a href="http://www.example1.com/" target="_blank">www.example1.com</a>
    </div>
    </div>
    <div class="col-md-6 col-sm-6 col-xs-12 md-margin-bottom-40">
    <div class="member-col funny-boxes funny-boxes-top-yellow">
    <a href="http://www.example2.com/"><img class="aligncenter img-responsive" src="http://localhost/test/testWP/wp-content/uploads/2015/07/logo2.jpg" alt="logo" /></a>
    <strong>Company 2</strong>
    Address
    Telephone
    <a href="http://www.example2.com/" target="_blank">www.example2.com</a>
    </div>
    </div>
    </div>

当我从编辑器 window 中删除周围的 [member-row] 和 [/member-row] 简码时，'member' 列简码会正确显示在网页上.. 所以它似乎是 只是在 的 'member-row' 短代码中导致了问题.

注意：我确实尝试将 add_filter('the_content', 'do_shortcode', 10); 行添加到我的 function.php 文件的底部，但它似乎没有任何区别，所以我删除了它。

希望我刚刚犯了一些拼写错误。非常感谢任何帮助！

谢谢。

Answer 1

我找到问题了

我必须将 $atts 添加到成员行短代码的函数中，如下所示：

add_shortcode('member-row', function ($atts, $content = null) {
return '<div class="row">
<br />'.do_shortcode($content).'</div>';
});

现在可以按预期工作了！！

我不确定为什么我需要添加 $atts，因为这个短代码没有传递属性或设置默认属性，但如果你打算使用包含 [=13 的短代码，你似乎需要它=]. （也许需要它是因为 $content 被定义为 'second' 参数？？？）

我刚刚在 WP Codex 中读到简码 api

"Three parameters {$atts, $content, $tag} are passed to the shortcode callback function. You can choose to use any number of them including none of them."

所以在我看来你可以单独使用 $content...但是我刚刚证明 $content 不能单独使用 - 我仍然不确定原因我的解决方案对我有用。（真高兴！）

如果有人知道为什么需要 $atts 才能完成这项工作的规则或原因，我将不胜感激评论 - 为我自己和其他有同样问题的人澄清这一点。

谢谢！

内部嵌套短代码不起作用 - 例如：列未显示在行内

inner nested shortcodes not working - eg: columns not showing inside of row

wordpress

nested

row

shortcode