为每 4 个帖子和 8 个帖子添加课程——WordPress Loop [英] Add class to every 4 posts and 8 posts -- WordPress Loop

查看:23
本文介绍了为每 4 个帖子和 8 个帖子添加课程——WordPress Loop的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试构建一个内容滑块,以便每张幻灯片包含 8 个图像.为此,我需要将row-fluid"类添加到我的 WP 查询中的每 4 个帖子中,并将幻灯片"类添加到每 8 个帖子中.

我试图实现的 HTML -

<div class="slide"><div class="row-fluid"><div class="span3"><img src="...">

<div class="span3"><img src="...">

<div class="span3"><img src="...">

<div class="span3"><img src="...">

</div><!--/row-fluid --><div class="row-fluid"><div class="span3"><img src="...">

<div class="span3"><img src="...">

<div class="span3"><img src="...">

<div class="span3"><img src="...">

</div><!--/row-fluid --></div><!--/slide --><div class="slide"><div class="row-fluid"><div class="span3"><img src="...">

<div class="span3"><img src="...">

<div class="span3"><img src="...">

<div class="span3"><img src="...">

</div><!--/row-fluid --><div class="row-fluid"><div class="span3"><img src="...">

<div class="span3"><img src="...">

<div class="span3"><img src="...">

<div class="span3"><img src="...">

</div><!--/row-fluid --></div><!--/slide --></div><!--/coda-slider -->

我的查询无法正常工作 -

 'video', 'posts_per_page' => 10,);$the_query = new WP_Query( $args );echo '
';echo '<div class="coda-slider" id="slider-id">';$i = 1;echo '

';echo '<div class="row-fluid">';if ( $the_query->have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post();echo '

';the_post_thumbnail();回声'</div>';if($i % 8 == 0) {echo '</div><div class="slide">';}elseif($i % 4 == 0) {echo '</div><div class="row-fluid">';}$i++;终了;万一;回声'</div>';//行流体回声'</div>';//滑动回声'</div>';//尾声滑块echo '</section>';

查询打印的内容 -

php 为每 8 个帖子添加一个幻灯片"类,但第一个幻灯片"类没有正确关闭.这听起来可能很令人困惑,所以如果您需要更多信息,请告诉我.

感谢您的帮助!

解决方案

试试这个 ;)

 'video', 'posts_per_page' => 10,);$the_query = new WP_Query( $args );echo '
';echo '<div class="coda-slider" id="slider-id">';for($i=1; $the_query->have_posts(); $i++){$the_query->the_post();$prePost='';$postPost='';如果($i==1){$prePost='<div class="slide"><div class="row-fluid">';}如果($i==4){$prePost='</div><div class="row-fluid">';}如果($i==8){$postPost='</div></div>';$i=0;}echo $prePost, '<div class="span3">';the_post_thumbnail();echo '</div>', $postPost;}回声'</div>';//尾声滑块echo '</section>';

I am trying to build a content slider so that each slide contains 8 images. To do this I need to add the 'row-fluid' class to every 4 posts and 'slide' class to every 8 posts in my WP query.

HTML of what I am try to achieve -

<div class="coda-slider"  id="slider-id">

  <div class="slide">

    <div class="row-fluid">
      <div class="span3">
        <img src="...">
      </div>
      <div class="span3">
        <img src="...">
      </div>
      <div class="span3">
        <img src="...">
      </div>
      <div class="span3">
        <img src="...">
      </div>
    </div><!-- /row-fluid -->

    <div class="row-fluid">
      <div class="span3">
        <img src="...">
      </div>
      <div class="span3">
        <img src="...">
      </div>
      <div class="span3">
        <img src="...">
      </div>
      <div class="span3">
        <img src="...">
      </div>
    </div><!-- /row-fluid -->

  </div><!-- /slide -->

  <div class="slide">

    <div class="row-fluid">
      <div class="span3">
        <img src="...">
      </div>
      <div class="span3">
        <img src="...">
      </div>
      <div class="span3">
        <img src="...">
      </div>
      <div class="span3">
        <img src="...">
      </div>
    </div><!-- /row-fluid -->

    <div class="row-fluid">
      <div class="span3">
        <img src="...">
      </div>
      <div class="span3">
        <img src="...">
      </div>
      <div class="span3">
        <img src="...">
      </div>
      <div class="span3">
        <img src="...">
      </div>
    </div><!-- /row-fluid -->

  </div><!-- /slide -->

</div><!-- /coda-slider -->

My query that doesn't work correctly -

<?php

$args = array( 'post_type' => 'video', 'posts_per_page' => 10,);

$the_query = new WP_Query( $args );

echo '<section id="our-clients">';

echo '<div class="coda-slider"  id="slider-id">';   

$i = 1;

echo '<div class="slide">';

echo '<div class="row-fluid">';

if ( $the_query->have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post();

echo '<div class="span3">';

the_post_thumbnail();

echo '</div>';

     if($i % 8 == 0) {echo '</div><div class="slide">';}

     elseif($i % 4 == 0) {echo '</div><div class="row-fluid">';}

$i++; endwhile; endif;

echo '</div>'; //row-fluid

echo '</div>'; //slide

echo '</div>'; //coda-slider

echo '</section>';

What the query is printing out -

The php is adding the 'slide' class to every 8 posts but the first 'slide' class isn't closing correctly. This probably sounds really confusing, so let me know if you need additional information.

I appreciate the help!

解决方案

Try this ;)

<?php

$args = array( 'post_type' => 'video', 'posts_per_page' => 10,);

$the_query = new WP_Query( $args );

echo '<section id="our-clients">';

echo '<div class="coda-slider"  id="slider-id">';   

for($i=1; $the_query->have_posts(); $i++)
{
    $the_query->the_post();

    $prePost='';
    $postPost='';

    if($i==1)
    {
        $prePost='<div class="slide"><div class="row-fluid">';
    }
    if($i==4)
    {
        $prePost='</div><div class="row-fluid">';
    }

    if($i==8)
    {
        $postPost='</div></div>';
        $i=0;
    }

    echo $prePost, '<div class="span3">';
    the_post_thumbnail();
    echo '</div>', $postPost;
}


echo '</div>'; //coda-slider

echo '</section>';

这篇关于为每 4 个帖子和 8 个帖子添加课程——WordPress Loop的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
PHP最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆