将 parent 和 child 类别与帖子一起分组并在 WordPress 中使用 Timber/Twig 显示

Group parent and child categories together with posts and display using Timber/Twig in WordPress

我在我的 Timber 主题中使用了以下 WordPress 查询代码,但我正在努力解决如何转换为 Timber/Twig 格式的问题。

$args = array(
  'taxonomy' => 'category',
  'parent' => '7',
  'orderby' => 'name',
  'order' => 'ASC',
  'hide_empty' => false,
);
$terms = get_terms( $args );

foreach ( $terms as $term ) {
  $termId = $term->term_id;

  // Output first level of children of parent category ID 7
  echo '<p>' . $term->name . '</p>';

  $args = array(
    'taxonomy' => 'category',
    'child_of' => $termId,
    'orderby' => 'name',
    'order' => 'ASC',
    'hide_empty' => false,
  );
  $childTerms = get_terms( $args );

  foreach ( $childTerms as $childTerm ) {
    $childTermId = $childTerm->term_id;

    // Output second level of children of parent category ID 7
    echo '<p>' . $childTerm->name . '</p>';

    $args = array(
      'cat' => $childTermId,
      'orderby' => 'title',
      'order' => 'ASC',
      'posts_per_page' => -1,
    );

    $query = new WP_Query( $args );
    while( $query->have_posts() ) : $query->the_post();
      // Output posts assigned to second level children categories
      echo '<p><a href="' . get_the_permalink() . '">' . get_the_title() . '</a></p>';
    endwhile;
    wp_reset_postdata();

    // $posts = Timber::get_posts( $args );
  }
}

示例 Timber/Twig 功能不完整的代码

{% for term in terms %}
<div class="category">
  <h3>
    {{ term.name }}
  </h3>
  {% for childTerm in terms %}
    {% if childTerm.parent == term.term_id %}
    <div class="category__child">
      <h4>{{ childTerm.name }}</h4>
      <!-- Output posts from child terms here -->
    </div>
    {% endif %}
  {% endfor %}
</div>
{% endfor %}

HTML 嵌套输出示例

Parent 类别

Parent 类别

Parent 类别

非常感谢任何帮助。

首先,您必须更改发送到视图的数据。 将 children 与 parents 分组,并将帖子与相应的 child 分组。这可以通过这样的方式实现:

<?php
    $data = [];

    $terms = get_terms([
        'taxonomy' => 'category',
        'parent' => '7',
        'orderby' => 'name',
        'order' => 'ASC',
        'hide_empty' => false,
    ]);

    foreach ($terms as $term) {
        /**
        *  Assign parent term to array and initiate children array
        *  Use term id so you can match the children easier with their parent
        **/
        $data[$term->term_id] = [
            'name'      => $term->name,
            'children'  => [],
        ];

        $childTerms = get_terms([
            'taxonomy' => 'category',
            'child_of' => $term->term_id,
            'orderby' => 'name',
            'order' => 'ASC',
            'hide_empty' => false,
        ]);

        foreach ($childTerms as $childTerm) {
            /**
            *  Assign child term to parent inside array and initiate post array
            *  Use child term id so you can match the post easier with the correct child
            **/
            $data[$term->term_id]['children'][$childTerm->term_id] = [
                'name' => $childTerm->name,
                'posts' => [],
            ];

            $query = new WP_Query([
                'cat' => $childTerm->term_id,
                'orderby' => 'title',
                'order' => 'ASC',
                'posts_per_page' => -1,
            ]);

            while($query->have_posts()) {
                $query->the_post();
                $data[$term->term_id]['children'][$childTerm->term_id]['posts'][] = [
                    'url'   => get_the_permalink(),
                    'title' => get_the_title(),
                ];
            }
            wp_reset_postdata();
        }
    }

这将创建一个嵌套数组,更易于在 twig 中使用,例如

<ul>
{% for parent in data %}
    <li>
        {{ parent.name }}
        {% if parent.children|default %}
            <ul>
            {% for child in parent.children %}
                <li>
                    {{ child.name }}
                    {% if child.posts|default %}
                    <ul>
                    {% for post in child.posts %}
                        <li><a href="{{ post.url }}" title="{{ post.title }}">{{ post.title }}</a></li>
                    {% endfor %}
                    </ul>
                    {% endif %}
                </li>
            {% endfor %}
            </ul>
        {% endfor %}
    </li>
{% endfor %}
</ul>

demo


注意:没有测试 wordpress 部分,因为我不使用 wordpress

这是我的工作 PHP 和 Twig 代码以及@DarkBee 提供的有用解决方案。我希望这对使用 Timber for WordPress 的任何人有所帮助。

页面故事 PHP

$context = Timber::context();
$timber_post = new Timber\Post();

$data = [];

$terms = get_terms([
  'taxonomy' => 'category',
  'parent' => '7',
  'orderby' => 'name',
  'order' => 'ASC',
  'hide_empty' => false,
]);

foreach ( $terms as $term ) {  
  /**
   *  Assign parent term to array and initiate children array
   *  Use term id so you can match the children easier with their parent
   **/
  $data[$term->term_id] = [
    'name' => $term->name,
    'slug' => $term->slug,
    'children' => [],
  ];

  $childTerms = get_terms([
    'taxonomy' => 'category',
    'child_of' => $term->term_id,
    'orderby' => 'name',
    'order' => 'ASC',
    'hide_empty' => false,
  ]);

  foreach ( $childTerms as $childTerm ) {    
    /**
     *  Assign child term to parent inside array and initiate post array
     *  Use child term id so you can match the post easier with the correct child
     **/
    $data[$term->term_id]['children'][$childTerm->term_id] = [
      'name' => $childTerm->name,
      'posts' => [],
    ];

    $query = new WP_Query([
      'cat' => $childTerm->term_id,
      'orderby' => 'title',
      'order' => 'ASC',
      'posts_per_page' => -1,
    ]);

    while($query->have_posts()) {
      $query->the_post();
      $data[$term->term_id]['children'][$childTerm->term_id]['posts'][] = [
        'url' => get_the_permalink(),
        'title' => get_the_title(),
        'date' => get_the_date(),
      ];
    }
    wp_reset_postdata();
  }
}

$context['data'] = $data;
Timber::render( array( 'page-' . $timber_post->post_name . '.twig', 'page.twig' ), $context );

页面故事 Twig

{% for parent in data %}
<div class="category">
  <h3 id="{{ parent.slug }}">
    {{ parent.name }}
  </h3>
  {% if parent.children|default %}
    {% for child in parent.children %}
      <div class="category__child">
        <h4>
          {{ child.name }}
        </h4>
        {% if child.posts|default %}
          {% for post in child.posts %}
          <div class="story">
            <a href="{{ post.url }}" title="{{ post.title }}">
              {{ post.title }}
            </a>
            <span>
              {{ post.date }}
            </span>
          </div>
          {% endfor %}
        {% endif %}
      </div>
    {% endfor %}
  {% endif %}
</div>
{% endfor %}