我的模板中有问题(wordpress)。 我想创建一个包含3列的投资组合页面,它可以在我的投资组合页面中显示帖子(无需跳过新页面)。我需要在每三个帖子后重复这三个帖子。我将“隐藏”类分配给我的重复帖子,当点击列时,类应设置为“阻止”。 我有一个代码:
<?php get_header(); ?>
<section> <div class="container container-bazar container-gallery"><?php
$array = array();
$count = 0;
$i = 0;
$args = array(
'posts_per_page' => -1,
'post_type' => 'gallery',
);
$gallery = new WP_Query( $args );
if($gallery->have_posts()) :
while($gallery->have_posts()) :
$gallery->the_post(); ?>
<div class="col-1 boxes<?php if( $count%3 == 0 ) { echo '-1'; }; $count++; ?>">
<div class="post" id="post-<?php the_ID(); ?>">
<figure class="indent-bot">
<a href="<?php the_permalink(); ?>" rel="nofollow">
<?php the_post_thumbnail(array(380,220,true)); ?>
</a>
</figure>
<div class="col-1-content">
<strong class="title-3">
<a href="<?php the_permalink(); ?>" rel="nofollow">
<?php the_title(); ?>
</a>
</strong>
<div class="entry">
<a href="<?php the_permalink(); ?>" rel="nofollow">
<?php the_excerpt(); ?>
</a>
</div><!-- .entry -->
</div><!-- .col-1-content-->
</div><!-- .post -->
</div> <!-- .boxes -->
<?php endwhile; ?>
<?php while($gallery->have_posts()) :
$gallery->the_post();?>
<?php $imgaddr1 = get_post_meta($post->ID, 'imgaddr1', true);
$imgaddr2 = get_post_meta($post->ID, 'imgaddr2', true);
$imgssilka1 = get_post_meta($post->ID, 'imgssilka1', true);
$imgssilka2 = get_post_meta($post->ID, 'imgssilka2', true);
$namecolor1 = get_post_meta($post->ID, 'namecolor1', true);
$namecolor2 = get_post_meta($post->ID, 'namecolor2', true);
$numbercolor1 = get_post_meta($post->ID, 'numbercolor1', true);
$numbercolor2 = get_post_meta($post->ID, 'numbercolor2', true); ?>
</div>
<div class="full clearfix">
<div class="inner">
<figure class="indent-bot1">
<a href="<?php the_permalink(); ?>" rel="nofollow">
<?php the_post_thumbnail(array(960,690)); ?>
</a>
</figure>
<div class="row">
<div class="col-md-5">
<div class="inf-1">
<h4>Информация</h4>
</div>
<div class="inf-2">
<h5><?php the_title(); ?></h5>
<div class="desc">
<?php the_excerpt(); ?>
</div>
</div>
<div class="clearfix"></div>
</div>
<div class="col-md-7 border-left">
<div class="inf-1">
<h4>Приложенные Цвета</h4>
</div>
<div class="inf-2">
<ul>
<li class="first-child">
<a href="<?php echo $imgssilka1; ?>" class="img-block">
<img src="<?php echo $imgaddr1; ?>">
</a>
<div class="txt">
<strong><?php echo $namecolor1; ?></strong>
<span><?php echo $numbercolor1; ?></span>
</div>
</li>
<li class="last-child">
<a href="<?php echo $imgssilka2; ?>" class="img-block">
<img src="<?php echo $imgaddr2; ?>">
</a>
<div class="txt">
<strong><?php echo $namecolor2; ?></strong>
<span><?php echo $numbercolor2; ?></span>
</div>
</li>
</ul>
</div>
<div class="clearfix"></div>
</div>
</div>
</div><!-- .inner -->
</div>
<div class="container container-bazar container-gallery">
<?php endwhile;
else:
endif; ?>
</div><!-- .container -->
</section>
<?php get_footer(); ?>
但此代码按顺序显示帖子。
答案 0 :(得分:2)
$i = 1;
//added before to ensure it gets opened
echo '<div>';
if ( $wp_query->have_posts() ) : while ( $wp_query->have_posts() ) : $wp_query->the_post();
// post stuff...
// if multiple of 3 close div and open a new div
if($i % 3 == 0) {echo '</div><div>';}
$i++; endwhile; endif;
//make sure open div is closed
echo '</div>';
答案 1 :(得分:1)
这是一个非常不寻常的设置让我思考。有一种方法可以不重新运行循环
您只需要运行一次循环。我们将从查询中提取posts数组,并通过foreach
循环运行我们的帖子,而不是默认循环。这是我们将要开始的地方
我们需要将内容拆分起来,这样我们就可以获得两个带有后期数据的块,这需要保存到一个我们将在以后使用的数组中。要实现这一点,请构建两个连接的数据字符串(一个字符串包含第一个数据块,第二个字符串包含第二个数据块),这些字符串将保存在两个单独的变量中。
一旦完成,我们需要添加我们的div来形成包含三个帖子的帖子块,每个帖子都有一个唯一的类。这适用于两组字符串
现在我们需要计算新的数组键,这样我们就可以构建一个新的post数据数组,这样我们就可以得到一个post数据块的序列,其中包含来自string 1的三个帖子,然后是一个post数据块。来自字符串二等的三个帖子
最后,因为我们的帖子数组仍然是混合的并且乱序,我们将对数组进行排序以使键是数字的,然后我们可以使用最后的foreach
循环来输出我们的帖子数据
在我发布代码之前只需要一两个注释
您需要修改类等以满足您的需求
代码未经过全面测试,但div块和排序按预期工作
我已对代码进行了评论,以便更容易理解
最后,代码
$args = array(
'posts_per_page' => -1,
'post_type' => 'gallery',
);
$gallery = new WP_Query( $args );
// Check if we have posts before we continue
if( $gallery->have_posts() ) {
// Use the array of posts and a foreach loop to build out super array
foreach ( $gallery->posts as $key=>$post ) {
// Setup postdata so we can make use of template tags
setup_postdata( $post );
// Setup/define our first variable which will hold our first set of post data
$output = '';
// Open a new div on the first post and every 3rd one there after to hold three posts
if ( $key%3 == 0 ) {
// We will call this class "first-x" where x represents the block count
$output .= '<div class="first-' . floor( $key / 3 ) . '">';
}
// Concatenate your first loop into a string to our first variable $output
$output .= '<div class="post" id="post-' . $post->ID . '">
<figure class="indent-bot">
<a href="' . get_the_permalink() . '" rel="nofollow">
' . get_the_post_thumbnail( $post->ID, array( 380,220,true ) ) . '
</a>
</figure>
<div class="col-1-content">
<strong class="title-3">
<a href="' . get_the_permalink() . '" rel="nofollow">
' . get_the_title() . '
</a>
</strong>
<div class="entry">
<a href="' . get_the_permalink() . '" rel="nofollow">
' . get_the_excerpt() . '
</a>
</div><!-- .entry -->
</div><!-- .col-1-content-->
</div><!-- .post -->
</div> <!-- .boxes -->';
// Add our closing div after every third post or the last post if there is less than three
if ( $key%3 == 2 || !array_key_exists( ( $key + 1 ), $gallery->posts ) ) {
$output .= '</div>';
}
// Create our new array of post data split in two and use with new array keys
$new_posts_array[floor( $key / 3 ) * 3 + $key] = $output;
// Setup/define our second variable which will hold the second set of post data from our posts
// This is the set that you would like to hide
$output_1 = '';
// Open a new div on the first post and every 3rd one there after to hold three posts
if ( ( $key%3 ) == 0 ) {
// This block of posts will use class "second-x" where x represents the block count
$output_1 .= '<div class="second-' . floor( $key / 3 ) . '">';
}
$imgaddr1 = get_post_meta( $post->ID, 'imgaddr1', true );
$imgaddr2 = get_post_meta( $post->ID, 'imgaddr2', true );
$imgssilka1 = get_post_meta( $post->ID, 'imgssilka1', true );
$imgssilka2 = get_post_meta( $post->ID, 'imgssilka2', true );
$namecolor1 = get_post_meta( $post->ID, 'namecolor1', true );
$namecolor2 = get_post_meta( $post->ID, 'namecolor2', true );
$numbercolor1 = get_post_meta( $post->ID, 'numbercolor1', true );
$numbercolor2 = get_post_meta( $post->ID, 'numbercolor2', true );
// Concatenate your second set of post data into a string to our second variable $output_1
$output_1 .= '<div class="full clearfix">
<div class="inner">
<figure class="indent-bot1">
<a href="' . get_the_permalink() . '" rel="nofollow">
' . get_the_post_thumbnail( $post->ID, array( 960, 690 ) ) . '
</a>
</figure>
<div class="row">
<div class="col-md-5">
<div class="inf-1">
<h4>Информация</h4>
</div>
<div class="inf-2">
<h5>' . get_the_title() . '</h5>
<div class="desc">
' . get_the_excerpt() . '
</div>
</div>
<div class="clearfix"></div>
</div>
<div class="col-md-7 border-left">
<div class="inf-1">
<h4>Приложенные Цвета</h4>
</div>
<div class="inf-2">
<ul>
<li class="first-child">
<a href="' . $imgssilka1 . '" class="img-block">
<img src="' . $imgaddr1 . '">
</a>
<div class="txt">
<strong>' . $namecolor1 . '</strong>
<span>' . $numbercolor1 . '</span>
</div>
</li>
<li class="last-child">
<a href="' . $imgssilka2 . '" class="img-block">
<img src="' . $imgaddr2 . '">
</a>
<div class="txt">
<strong>' . $namecolor2 . '</strong>
<span>' . $numbercolor2 . '</span>
</div>
</li>
</ul>
</div>
<div class="clearfix"></div>
</div>
</div>
</div><!-- .inner -->
</div>';
// Add our closing div after every third post or the last post if there is less than three
if ( $key%3 == 2 || !array_key_exists( ( $key + 1 ), $gallery->posts ) ) {
$output_1 .= '</div>';
}
// Create our new array of post data split in two and use with new array keys
$new_posts_array[( floor( $key / 3 ) + 1 ) * 3 + $key] = $output_1;
}
wp_reset_postdata();
// Sort our new array so that the keys are numerical again
ksort( $new_posts_array );
// Run a foreach loop to output our posts as we need. No need to modify anything here
foreach ( $new_posts_array as $v )
echo $v;
}
答案 2 :(得分:0)
众所周知,WordPress是一个开源工具,所有插件都可用于管理此类格式。
我建议使用插件来管理您的要求。我已使用columns plugin格式化输出。
答案 3 :(得分:0)
我得到了记录总数并制作了循环。 循环内部,两个循环。 第一个循环显示一个表。第二个循环显示一个列表。
<section>
<div class="container container-gallery">
<?php
$offset = 0;
$offset1 = 0;
$i =0;
$count = 0;
$reset =0;
$reset1 = 0;
$args = array(
'posts_per_page' => -1,
'post_type' => 'gallery',
);
$gallery = new WP_Query( $args );
$numberposts = $gallery->post_count;
if ($numberposts){
$id1=0;
$id2=0;
while($count < $numberposts){
// print_r($arr1);
$count++;
//echo "<h2>".$count."</h2>";
$arr1 = array(
'posts_per_page' => 400,
'post_type' => 'gallery',
'offset'=>$offset
);
$arr2 = array(
'posts_per_page' => 400,
'post_type' => 'gallery',
'offset'=>$offset1
);
$loop1 = new WP_Query($arr1);
$loop2 = new WP_Query($arr1);
while($loop1->have_posts()) : $loop1->the_post();
if ($reset<3) :
$reset++;
?>
<?php
$colorfilter1 = get_post_meta($post->ID, 'checkboxwhite', true);
$colorfilter2 = get_post_meta($post->ID, 'checkbox_beige', true);
$colorfilter3 = get_post_meta($post->ID, 'checkbox_brown', true);
$colorfilter4 = get_post_meta($post->ID, 'checkbox_gray', true);
$colorfilter5 = get_post_meta($post->ID, 'checkbox_black', true);
$colorfilter6 = get_post_meta($post->ID, 'checkbox_vvid', true);
if ($colorfilter1 != "") $colorfilter1 ="white ";
if ($colorfilter2 != "") $colorfilter2 ="beige ";
if ($colorfilter3 != "") $colorfilter3 ="brown ";
if ($colorfilter4 != "") $colorfilter4 ="gray ";
if ($colorfilter5 != "") $colorfilter5 ="black ";
if ($colorfilter6 != "") $colorfilter6 ="vivid ";
$class_color = $colorfilter1.$colorfilter2.$colorfilter3.$colorfilter4.$colorfilter5.$colorfilter6;
?>
<div class="col-1 mcol boxes<?php if( $i%3 == 0 ) { echo '-1'; }; $i++; echo ' '.$class_color;?>" id="colbox<?php echo $id1; $id1++;?>" data-id="click" >
<div class="post" id="post-<?php the_ID(); ?>">
<figure class="indent-bot">
<?php the_post_thumbnail(array(380,220,true)); ?>
</figure>
<div class="col-1-content">
<strong class="title-3">
<?php the_title(); ?>
</strong>
<div class="entry">
<?php the_excerpt(); ?>
</div><!-- .entry -->
</div><!-- .col-1-content-->
</div><!-- .post -->
</div><!-- .boxes -->
<?php else : break;?>
<?php endif; ?>
<?php endwhile; ?>
<?php
$reset = 0;
$offset +=3;
?>
<?php wp_reset_postdata(); ?>
<?php
while($loop2->have_posts()) : $loop2->the_post();
if ($reset1<3) :
$reset1++;
?>
<?php
$numbercolor1 = get_post_meta($post->ID, 'numbercolor1',true);
$numbercolor2 = get_post_meta($post->ID, 'numbercolor2', true);
$imgaddr1 = get_post_meta($post->ID, 'imgaddr1', true);
$imgaddr2 = get_post_meta($post->ID, 'imgaddr2', true);
$imgssilka1 = get_post_meta($post->ID, 'imgssilka1', true);
$imgssilka2 = get_post_meta($post->ID, 'imgssilka2', true);
$namecolor1 = get_post_meta($post->ID, 'namecolor1', true);
$namecolor2 = get_post_meta($post->ID, 'namecolor2', true);
?>
</div>
<div class="full clearfix active colbox<?php echo $id2; $id2++;?>" id="">
<div class="inner">
<figure class="indent-bot1">
<a href="<?php the_permalink(); ?>" rel="nofollow">
<?php the_post_thumbnail(array(960,690)); ?>
</a>
</figure>
<div class="row">
<div class="col-md-5">
<div class="inf-1">
<h4>Информация</h4>
</div>
<div class="inf-2">
<h5><?php the_title(); ?></h5>
<div class="desc">
<?php the_excerpt(); ?>
</div>
</div>
<div class="clearfix"></div>
</div>
<div class="col-md-7 border-left">
<div class="inf-1">
<h4>Приложенные<</h4>
</div>
<div class="inf-2">
<ul>
<li class="first-child">
<a href="<?php echo $imgssilka1; ?>" class="img-block">
<img src="<?php echo $imgaddr1; ?>">
</a>
<div class="txt">
<strong><?php echo $namecolor1; ?></strong>
<span><?php echo $numbercolor1; ?></span>
</div>
</li>
<li class="last-child">
<a href="<?php echo $imgssilka2; ?>" class="img-block">
<img src="<?php echo $imgaddr2; ?>">
</a>
<div class="txt">
<strong><?php echo $namecolor2; ?></strong>
<span><?php echo $numbercolor2; ?></span>
</div>
</li>
</ul>
</div>
<div class="clearfix"></div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="c_btn"></div>
</div>
</div>
</div><!-- .inner -->
</div>
<div class="container container-gallery">
<?php else : break;?>
<?php endif; ?>
<?php endwhile; ?>
<?php
$reset1 = 0;
$offset1 +=3;
?>
<?php wp_reset_postdata(); ?>
<?php
} //end if ($count <= $numberposts)
} //end if ($numberposts)
?>
<?php
if ( have_posts() ) while ( have_posts() ) : the_post(); // старт цикла ?>
<article id="post-<?php the_ID(); ?>">
<?php the_content(); ?>
</article>
<?php endwhile; ?>
</div><!-- .container -->
</section>