類添加到每三個WordPress郵寄

林列出所有WordPress的帖子在博客類別，但嘗試了一個名爲「最後」類添加到每三個「fourcol」類類添加到每三個WordPress郵寄

HTML

<div class="container"> 
    <div class="row"> 

    <?php query_posts('category_name=blog&showposts=10&orderby=date&order=dsc'); if (have_posts()) : while (have_posts()) : the_post(); ?> 

     <div class="fourcol"> 
      <a href=""><h2 class="blogtitle"><?php the_title(); ?></h2></a> 
      <a href="#"><img src="images/_scroll1.jpg"></a> 
      <span class="date">12 May 2011</span> 
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
      <a class="more" href="#">Keep reading</a> 
       </div><!-- fourcol END --> 

      <?php endwhile; endif; ?> 
     </div><!-- row END --> 
    </div><!-- container END -->

希望這有意義嗎？

來源

2011-07-27 Rob

爲你更新了我的答案。誤讀它 – Phil

使用CSS而不是

.last

使用

.fourcol:nth-child(3n+1)

來源

2011-07-27 15:59:03 ChristopheCVB

這個效果很好，但是理想的情況是想將它設置爲一個序列，即：類'last'將應用於帖子3,6,9,12等 – Rob

那麼將是第n孩子（3n + 1）編輯 – ChristopheCVB

那麼Internet Explorer呢？ –

編輯：

var i = 1; 
$('#row .fourcol').each(function() { 
    if(i++ % 4 == 0) 
     $(this).addClass('last'); 
});

$('.fourcol').eq(3).addClass('last');

來源

2011-07-27 15:46:54 Phil

你擊敗了我。 +1 那裏不會是一個更容易的方法 –

你爲什麼要用JavaScript來做到這一點？ – locrizak

@locrizak：看看這個問題標籤。 – hakre

您需要的modulus operator

<?php query_posts('category_name=blog&showposts=10&orderby=date&order=dsc'); 
    $counter = 0; //add a ounter to keep track of the number post we're on 
    if (have_posts()) : while (have_posts()) : the_post(); ?> 
    //check if the remainder of $count is 0, if so add the class 'last' 
    <div class="fourcol <? if ($count % 3 == 0) echo 'last' ?>">               
     <a href=""><h2 class="blogtitle"><?php the_title(); ?></h2></a> 
     <a href="#"><img src="images/_scroll1.jpg"></a> 
     <span class="date">12 May 2011</span> 
     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
     <a class="more" href="#">Keep reading</a> 
    </div><!-- fourcol END --> 
    <? $count++; ?> 
<?php endwhile; endif; ?>

來源

2011-07-27 15:47:26 locrizak

偉大的作品，但增加了類的第一篇文章，而不是第三，任何想法？ – Rob

不好意思更新了''counter'應該從0開始而不是1 – locrizak

<?php query_posts('category_name=blog&showposts=10&orderby=date&order=dsc'); 
if (have_posts()) : 
    $i=0; 
    while (have_posts()) : 
     the_post(); 
    ++$i; 
    ?> 

    <div class="fourcol<?php if($i%3==0) echo ' every-third-post' ?>" > 
     <a href=""><h2 class="blogtitle"><?php the_title(); ?></h2></a> 
     <a href="#"><img src="images/_scroll1.jpg"></a> 
     <span class="date">12 May 2011</span> 
     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> 
     <a class="more" href="#">Keep reading</a> 
      </div><!-- fourcol END --> 

     <?php endwhile; endif; ?> 
    </div><!-- row END --> 
</div><!-- container END -->

試試這個。應該管用。

來源

2011-07-27 15:49:31

你可以在你的模板中用PHP來做到這一點。每隔三個帖子只需添加字符串last。以下變體使用existing post counter in wordpress和modulo operator。計數器從0開始，所以我們每次對它加1：

<div class="fourcol<?php if (!((1 + $wp_query->current_post) % 3)) echo ' last' ?>">

這是相當緊湊和最緊湊的解決方案，我能想到的WordPress您的主題的PHP端。

它背後的想法是這樣的：

添加一個變量作爲計數器，算它的每一個崗位，如果是3，它再次被設置爲0，並添加類。

下面的腳本顯示了每個這一步：定義計數器，如果不存在的話，指望它時，它重置爲0，如果適用，並做回聲：

<div class="fourcol<?php 

    isset($iposts) || $iposts = 0; 

    if (++$iposts === 3) 
    { 
    $iposts = 0; 

    echo ' last'; 
    } 

?>">

這是僅用於演示。在使用標準查詢對象時，由於我們可以重新使用現有變量，因此更容易。另外使用modulo operator有助於查找每個X元素。

來源

2011-07-27 15:49:52 hakre

if (have_posts()) : while(have_posts()) : the_post(); 
//Loop code goes here. 
if (0 == $count%4) { 
    echo 'div class="clrFix"></div>'; 
} 
endwhile; 
if (0 != $count%4) { 
    echo 'div class="clrFix"></div>';

}

這裏以後每4後添加clrFix股利。

來源

2014-07-22 11:25:32 csehasib

類添加到每三個WordPress郵寄

回答

相關問題