Question

我正在开发一个库，其中我想要一个类似.. http://mightymente.org/projects/aarohievents/design/

的布局

我开发了大部分内容..请查看代码并提出如何证明它的建议。

我的代码：

$the_query = new WP_Query("showposts=6&cat=1&orderby=asc");
$count = 1; 
while ( $the_query ->have_posts() ) {$the_query ->the_post(); $i++;
    $thumb_id = get_post_thumbnail_id();
    $thumb_url = wp_get_attachment_image_src($thumb_id,'thumbnail-size',     
   false); 
    list($width, $height) = getimagesize($thumb_url[0]);  
    if($width == 800){ 
        $class='grid-1';
    } elseif($width==270) { 
        $class='sub_grid gallery_w3l';
    }   
    if ($i == 1){
        echo "<div class='col-md-6 col-sm-6 col-xs-12 grid_w3'>";
    }
?>

    <div class="<?php echo $class; ?>">
    <a class="cm-overlay" href="<?php echo $thumb_url[0];?>">
    <img src="<?php echo $thumb_url[0];?>" alt=" " class="img-responsive" />
    <div class="w3agile-text w3agile-text-small">
    <h5><?php the_title(); ?></h5>
    </div>
     </a> <?php //echo $i ; ?>
     </div>
<?php 
    $count++; 
    if ($i == 3){
        echo "</div><div class='col-md-6 col-sm-6 col-xs-12 grid_w3'>";}
        if ($i == 6){
            echo "</div>";$i=0;
        }
    }
    wp_reset_postdata();

Answer 1

这是您的执行代码：

   if ($i == 3){
       //At this position $i has to be 3, if not it will never come to here
       echo "</div><div class='col-md-6 col-sm-6 col-xs-12 grid_w3'>";
       if ($i == 6){
          //So this line will never be executed cause $i will never be 6 here
          echo "</div>";$i=0;
       }
    }

所以它应该是：

    if ($i == 3){
       echo "</div><div class='col-md-6 col-sm-6 col-xs-12 grid_w3'>";
    }
    if ($i == 6){
       echo "</div>";$i=0;
    }

或者使用elseIf

根据@ravisachaniya评论你也可以去

if ($i % 3 == 0){
     //This way it divides $i with 3 and if the levtover is 0 it goes inside
     //Means 3, 6, 9, 12, 15 and so on
     echo "</div><div class='col-md-6 col-sm-6 col-xs-12 grid_w3'>";
     if ($i == 6){
          echo "</div>";$i=0;
     }
 }

使用此解决方案，它也将在第6个循环中打印

echo "</div><div class='col-md-6 col-sm-6 col-xs-12 grid_w3'>";

通过帖子设置图库

1 个答案: