按照预定义的标记要求创建分层循环

时间:2016-02-29 作者:matjaeck

我试图在wordpress中根据我的主题实现这一点:fullpage.js demo

因此,我为垂直部分(父部分)和水平幻灯片(子部分)预定义了一个标记。父级只有在没有子级时才包含帖子,如果有子级,则每个帖子必须位于子元素内。

以下是所需的标记:

<div id="fullpage">

    <section class="vertical-scrolling"  data-anchor="//post title here//"> 
      <div //we can have another div here if you like //>
        <article id="//post id here//">
         // Here comes the content of a vertical section//
        </article>
      </div>
    </section>
    <section class="vertical-scrolling"  data-anchor="//taxonomy term here//">
        <div class="horizontal-scrolling" data-anchor="//post title here//">
            <article id="//post id here//">
             // Here comes the post-content with the taxonomy term for the first slide //
            </article>
        </div>
        <div class="horizontal-scrolling" data-anchor="//post title here//">
            <article id="//post id here//">
             // Here comes the post-content with the taxonomy term for the second slide //
            </article>
        </div>
    </section>
</div>
请帮我创建一个循环,

将指定帖子输出为垂直部分,将指定帖子输出为水平幻灯片,例如按分类术语分组,以满足给定标记要求

1 个回复
最合适的回答,由SO网友:matjaeck 整理而成

我自己也能弄明白,下面是代码:

    <div id="fullpage">

   <?php
//for each category, show 5 posts
$cat_args=array(
  \'orderby\' => \'name\',
  \'order\' => \'desc\'
   );
$categories=get_categories($cat_args);
  foreach($categories as $category) { 
    $args=array(
      \'showposts\' => 5,
      \'category__in\' => array($category->term_id),
    );
    $posts=get_posts($args);
      if ($posts) {
        echo \'<section class="vertical-scrolling" data-anchor="\' . $category->name.\'">\';
        foreach($posts as $post) {
          setup_postdata($post); ?>
          <div <?php if(has_term( \'slide\', \'fp_type\' )): ?>class="horizontal-scrolling"<?php endif;  ?>data-anchor="<?php the_title(); ?>">
          <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                 // Here comes the content //
                </article>
                </div>
          <?php
        } // endforeach;
        echo \'</section>\';
      } // endif;
    } // endforeach;
?>

    </div>
它似乎工作得很好。

@迈克尔的answer 帮了我很多