编辑wordpress循环以显示缩略图和摘录

时间:2016-05-12 17:28:12

标签: php html css wordpress themes

我尝试实现一个wordpress循环来显示我博客上的文章。我正在尝试创建这样的设计:www.freileben.net

我的wordpress循环如下所示:

.thumbnail {
  float: left;
  margin-right: 50px;
}
#post {
  margin-top: 120px;
  padding-top: 15px;
}
<article id="post">
  <div id="thumbnail">

    <?php if ( function_exists( 'has_post_thumbnail') && has_post_thumbnail() ) { the_post_thumbnail(array(350,220), array( "class"=>"thumbnail")); } ?>

  </div>

  <h2><?php the_title(); ?></h2>

  <div class="entry">
    <?php the_excerpt(); ?>
  </div>
  <?php endwhile; ?>

</article>

我不知道如何解决这个问题,因为我使用的所有图像都有不同的大小,并且它们不在同一个位置。

1 个答案:

答案 0 :(得分:0)

请尝试以下代码:

   <article id="post">
    <?php 
    // the query
    $args = array('');
    $the_query = new WP_Query( $args ); 

    ?>

    <?php if ( $the_query->have_posts() ) { ?>

        <!-- the loop -->

        <?php while ( $the_query->have_posts() ) {
                    $the_query->the_post(); ?>
        <div id="thumbnail">
        <?php
    // Must be inside a loop.

    if ( has_post_thumbnail() ) {
        the_post_thumbnail(array( "class"=>"thumbnail"));
    }
    ?>
    </div>
   <h2><?php the_title(); ?></h2>
   <div class="entry">
        <?php the_excerpt(); ?>
   </div>
    <?php } } else { ?>
    <p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
    <?php }  ?>

   <!-- end of the loop -->

   <?php wp_reset_postdata(); ?>