Question

首先我知道我的问题与 sage 项目有什么关系，但我知道你的高级wordpress知识可以帮助我解决这个问题。

P.S。我一直在使用鼠尾草脚手架创建我的短代码。

我为嵌套使用：

构建了两个短代码

[outdoor]
    [outdoor_item title="My title 1" color="orange"]<strong>The</strong> 1st Content[/outdoor]
    [outdoor_item title="My title 2" color="blue"]<strong>The</strong> 2nd Content[/outdoor]
    [outdoor_item title="My title 3" color="green"]<strong>The</strong> 3rd Content[/outdoor]
    [outdoor_item title="My title 4" color="red"]<strong>The</strong> 4th Content[/outdoor]
[/outdoor]

经过大量时间在stackoverflow和google中搜索内容后，我发现我必须在我的RAW do_shortcode()简短内容中应用outdoor ......这样的事情：

add_shortcode('outdoor', function($atts, $content, $tag) {
    return '<div class="outdoor">' . do_shortcode($content) . '</div>';
});

然后我的问题就出来了...... 函数do_shortcode()仅渲染我的第一个outdoor_item并忽略每个outdoor_item其他。它会输出这样的内容：

<div class="outdoor">
    <div class="outdoor-item" style="background-color: orange">
        <h1>My title 1</h1>
        <div class="outdoor-item-content">
            <strong>The</strong> 1st Content
        </div>
    </div>
</div>

P.S。我已尝试do_shortcode()，apply_filters('the_content', $content)，甚至在wp_reset_postdata()之后调用outdoor_item。我还能尝试什么？

Answer 1

最近我遇到了类似的问题。我需要将元素包装到引导表中，因此短代码应如下所示：

[table]
  [fb_review href="" name="" date=""][/fb_review]
  [fb_review href="" name="" date=""][/fb_review]
  [fb_review href="" name="" date=""][/fb_review]
  [fb_review href="" name="" date=""][/fb_review]
  [fb_review href="" name="" date=""][/fb_review]
[/table]

，这将产生以下html：

<div class="row">
  <div class="col-md-6"><div class="fb-review">Some content</div></div>
  <div class="col-md-6"><div class="fb-review">Some content</div></div>
</div>
<div class="row">
  <div class="col-md-6"><div class="fb-review">Some content</div></div>
  <div class="col-md-6"><div class="fb-review">Some content</div></div>
</div>
<div class="row">
  <div class="col-md-6"><div class="fb-review">Some content</div></div>
</div>

我寻找了不同的处理方式，但后来决定自己解析$content字符串

这是functions.php的一部分：

//this function just wraps the compiled nested shortcode elements
function responsive_table($attrs, $items = []) {
  if (count($items) > 0) {
    $result = '';
    $counter = 0;

    foreach ($items as $item) {
      if (!($counter % 2)) {
        $result .= '<div class="row">';
      }
      $result .= '<div class="col-md-6">' . $item . '</div>';
      if ($counter % 2) {
        $result .= '</div>';
      }
      $counter++;
    }
    if ($counter % 2) {
      $result .= '</div>';
    }
    return $result;
  } else {
    return '';
  }
}

// this function parses the content, fetches internal shortcodes, compiles them and passes to responsive_table
function responsive_table_for($attrs, $content=null) {
  if ($content != null && $content != '') {
    $content_matches = [];
    preg_match_all('/\[.+?\[.+?\]/', $content, $content_matches); // TODO: this doesn't support nested shortcodes
    $content_array = [];
    foreach ($content_matches[0] as $item) {
      $content_array[] = do_shortcode($item);
    }
    return responsive_table($attrs, $content_array);
  } else {
    return '';
  }
}

add_shortcode('table', 'responsive_table_for');

也许这不是最好的方法，但对我有用。

Wordpress - 嵌套的短代码渲染

1 个答案: