不同格式的wordpress get post循环
不同格式的wordpress get post循环
提问于 2015-07-17 13:39:06
在wordpress中，我从数据库中获取数据。问题是我想以不同的顺序显示数据，如下所示：
--------------------------
data-1 | data-2
--------------------------
data-3 | data-4 | data-5
_________________________
data-6 | data-7 | data-8
--------------------------
data-9 | data-10
--------------------------现在我得到的数据是这样的：
$args = array( 'post_type' => 'press', 'posts_per_page' => '-1');
$loop = new WP_Query( $args );
$i = 0;
while ( $loop->have_posts() ) : $loop->the_post();
$count = $loop->post_count;
foreach( $loop as $test ) {
echo $test->post_title;
if( $i % 2 == 0 ) {
?>
<div class="two-column-rows pressrelease-columns">
<div class="first"><?php echo $test->post_title; ?></div>
<div class=""><?php echo $test->post_title; ?></div>
</div>
<?php } ?>
<?php if( $i % 2 == 1 ) { ?>
<div class="three-column-rows pressrelease-columns">
<div class="first"><?php echo $test->post_title; ?></div>
<div class=""><?php echo $test->post_title; ?></div>
<div class=""><?php echo $test->post_title; ?></div>
</div>
<?php
}
$i++;
}
endwhile; ?>但它并不是按照参考资料工作的。有人能告诉我如何解决这个问题吗？
回答 1
Stack Overflow用户
发布于 2015-07-17 15:37:50
这是重复第一部分的代码：
<?php
$args = array(
'post_type' => 'press',
'posts_per_page' => '-1'
);
$post = new WP_Query( $args );
$i = 0;
$out = '';
if ($post->have_posts()){
while ($post->have_posts()){
$post->the_post();
$i++;
if ($i%5 == 0) {
$postclass = "narrow last";
} elseif($i%5 == 1) {
$postclass = "wide";
} elseif($i%5 == 2) {
$postclass = "wide last";
} elseif($i%2 == 3) {
$postclass = "narrow";
} else {
$postclass = 'narrow';
}
$out. = '<div class="post '. $postclass.'">'
.$test->post_title.'
</div>';
}
}
wp_reset_postdata();
echo '<div class="wrapper">'.$out.'</div>;html应该是这样的。
.wrapper{
display: block;
width: 100%;
clear: both;
}
.post{
background: red;
height: 200px;
margin-bottom: 10px;
margin-right: 1%;
float: left;
}
.narrow{
width: 32.65%;
}
.wide{
width: 49.5%;
}
.last{
margin-right:0;
}<div class="wrapper">
<div class="post wide"></div>
<div class="post wide last"></div>
<div class="post narrow"></div>
<div class="post narrow"></div>
<div class="post narrow last"></div>
<div class="post wide"></div>
<div class="post wide last"></div>
<div class="post narrow"></div>
<div class="post narrow"></div>
<div class="post narrow last"></div>
<div class="post wide"></div>
<div class="post wide last"></div>
<div class="post narrow"></div>
<div class="post narrow"></div>
<div class="post narrow last"></div>
</div>
我认为第二部分可以完成，只需稍微调整一下if部分即可。
编辑：也为你的布局设计了if部分：
if ($i%10 == 0) {
$postclass = "wide last";
} elseif($i%10 == 1) {
$postclass = "wide";
} elseif($i%10 == 2) {
$postclass = "wide last";
} elseif($i%10 == 3) {
$postclass = "narrow";
} elseif($i%10 == 4) {
$postclass = "narrow";
} elseif($i%10 == 5) {
$postclass = "narrow last";
} elseif($i%10 == 6) {
$postclass = "narrow";
} elseif($i%10 == 7) {
$postclass = "narrow";
} elseif($i%10 == 8) {
$postclass = "narrow last";
} else {
$postclass = 'wide';
}使用HTML
.wrapper{
display: block;
width: 100%;
clear: both;
}
.post{
background: red;
height: 200px;
margin-bottom: 10px;
margin-right: 1%;
float: left;
}
.narrow{
width: 32.65%;
}
.wide{
width: 49.5%;
}
.last{
margin-right:0;
}<div class="wrapper">
<div class="post wide"></div>
<div class="post wide last"></div>
<div class="post narrow"></div>
<div class="post narrow"></div>
<div class="post narrow last"></div>
<div class="post narrow"></div>
<div class="post narrow"></div>
<div class="post narrow last"></div>
<div class="post wide"></div>
<div class="post wide last"></div>
<div class="post wide"></div>
<div class="post wide last"></div>
<div class="post narrow"></div>
<div class="post narrow"></div>
<div class="post narrow last"></div>
<div class="post narrow"></div>
<div class="post narrow"></div>
<div class="post narrow last"></div>
<div class="post wide"></div>
<div class="post wide last"></div>
</div>
试一试，看看它是否有效:)
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/31469025
复制相关文章
相似问题
腾讯云开发者
