WordPress:3列ずつのリストを出力する

goto_jp 630views 更新:2014年9月11日

■ ■ ■
■ ■ ■

上記のように、3つずつ並んだ不特定多数のリストをWordpressで出力する場合、下記のようにします。

<?php
query_posts($query);
if(have_posts()):
    $count = 0;
    echo '<ul>';
    //ループ開始
    while(have_posts()) : the_post();
    //countを3で割った余りで判別
    if($count % 3 == 0) {
        $liClass = 'left';
    } elseif($count % 3 == 1) {
        $liClass = 'center';
    } elseif($count % 3 == 2) {
        $liClass = 'right';
    }
    echo '<li class="'. $liClass .'"><a href="'. get_the_permalink() .'">'. get_the_title() .'</a></li>';
    $count++;
    endwhile; //ループ終了
    echo '</ul>';
endif;
wp_reset_query(); //クエリのリセット
?>

ループ内で変数「count」を3で割った余りで判別し、左・中央・右と異なるクラスを付与しています。
応用すれば3つでなく4つ5つで行を分けることもできます。

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません