在WordPress主题中显示内容或自定义帖子类型

时间:2017-08-27 06:25:01

标签: php wordpress

我在一个自定义帖子类型上添加了6个不同的帖子。比如,在Team下,有6个不同的成员,我想在两行中显示这6个成员,每行3列。怎么做到了?我是WordPress主题开发的新手。尝试编写首页代码,任何建议和资源将不胜感激。 我做的就是这样,

<section class="team" id="team">
 <div class="container">
<div class="row">
<div class="team-heading text-center">
<h2>our team</h2>
<h4>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled</h4></div>

    <?php 
      $args = array(
        'post_type' => 'team',
        'orderby'   => 'date',
        'order'     => 'DESC',
        'posts_per_page'    =>3,
        );

        $the_query = new WP_Query($args);
    ?>
     <?php if($the_query->have_posts()) : ?>
        <?php while($the_query->have_posts()) : $the_query->the_post(); ?>

    <div class="col-md-2 single-member col-sm-4">
       <div class="person">
       <img class="img-responsive"> <?php the_post_thumbnail(); ?>
    </div>
      <div class="person-detail">
        <div class="arrow-bottom"></div>
        <h3><?php the_title(); ?></h3>
        <p><?php the_content(); ?></p>
     </div>
     </div>
    <!-- Query to display +1/next content-->
    <div class="col-md-2 single-member col-sm-4">
      <div class="person-detail">
       <div class="arrow-top"></div>
        <h3><?php the_title(); ?></h3>
        <p><?php the_content(); ?> </p>
      </div>
    <div class="person">
      <img class="img-responsive"> <?php the_post_thumbnail( ); ?>
    </div>
    </div>
        <?php endwhile; ?>
    <?php wp_reset_postdata(); ?>
    <?php endif ?>

1 个答案:

答案 0 :(得分:1)

这比PHP更像是一个前端问题。您可以通过多种方式实现它,但最简单的方法是简单地使用Bootstrap。此外,如果你按照自己的方式混合使用PHP和HTML,那么你最终会得到不可读的文件。

首先,查询:

<?php 
  $args = array(
    'post_type' => 'team',
    'posts_per_page' => -1
  );
  $the_query = new WP_Query($args);
?>

排序dateDESC是不必要的,因为这是默认值。 posts_per_page不应限制退回商品的数量。

观点:

<section class="team" id="team">
  <div class="container">
    <div class="team-heading text-center">...</div>
    <div class="row">
      <?php if($the_query->have_posts()): $i = 0; while($the_query->have_posts()): $the_query->the_post(); ?>
        <div class="col-sm-4">
          <?php if ($i % 2 > 0): ?>
            <div class="single-member">...tpl1...</div>
          <?php else: ?>
            <div class="single-member">...tpl2...</div>
          <?php endif; ?>
        </div>
      <?php $i++; endwhile; wp_reset_postdata(); endif; ?>
    </div>
  </div>
</section>

col-sm-4应该使你连续获得3件物品。