WEB

記事4回ごとにdiv class=”row”でくくりたい

当方Bootstrapをよく利用しているので、
1行の中でに4つカラムいれたい、なんてよくあります。
そこで見つけた記事。

記事を決められた数毎にタグ(div等)で囲みたい

おぉ〜ドンピシャ。

というわけで参考にしながらfunctions.phpに記載するように作り替えたのが、

//ターム$wikiを一覧化
function wiki($wiki){
	global $post;
	$str ='';
	if(is_page()){
		$args =array(
			'orderby' => 'ASC',
			'post_type' => 'page',
			'posts_per_page' =>-1,
			'tax_query' =>array(
				array(
				'taxonomy' => 'aiueo',
				'terms' => $wiki,
				'field' => 'slug',
				),
			),
		);
		$a = new WP_Query($args);
			if($a->have_posts()):
			
				$post_count = 1;//カウンターの初期化
				$str.= '<ul class="row">'."n";//最初の囲み
				
				while($a->have_posts()):
				
					$a->the_post();
					
					if(($post_count % 4 )== 1 && $post_count != 1) // ４で割った余りが１で、なおかつカウンターが１（最初）でなければ閉じulと囲みの開始タグを出力		
					{
						$str.='</ul>'."n".'<ul class="row">'."n";
							
					}else{
							
						if (has_post_thumbnail())
						{
									$str.='<li class="col-md-3">';
									$str.='<a href="'. get_the_permalink() .'">';									
									$str .=get_the_post_thumbnail($post->ID,'size175_160').'<span class="list_2">'.get_the_title().'</span>';
									$str.='</a>';
									$str.='</li>';
						}else{
									$str.='<li class="col-md-3">';
									$str.='<a href="'. get_the_permalink() .'">'.'<img src="'.get_template_directory_uri().'/images/noimage.png" alt="" width="175" height="160" /><span>'.get_the_title().'</span></a>';									
									$str.='</li>';
						}
					}
					$post_count++; // カウンターを１増やす 
			
				endwhile;	
								
				$str.= '</ul>'."n"; //最後にulを閉じる
						
			endif;			
		
		echo $str;
		wp_reset_postdata();
	}		
}			

で、できたーと思いながら記事を追加していたら
ん？おかしい。

表示されない記事がある

表示されない記事
なぜだ。
うーん。

コードを見直す。

$post_countが5の時、このタグが追加されて〜
ん？その記事を出力するのはどれだ。

ん？

参考にしたコードを見直す。

あ！！

不要なelse発見

$post_countが◯◯の時、タグ追加、それ以外は記事表示にしていた。
記事は毎回表示、かつ$post_countが◯◯の時はタグ追加。でした。

というわけで修正。

//ターム$wikiを一覧化
function wiki($wiki){
	global $post;
	$str ='';
	if(is_page()){
		$args =array(
			'orderby' => 'ASC',
			'post_type' => 'page',
			'posts_per_page' =>-1,
			'tax_query' =>array(
				array(
				'taxonomy' => 'aiueo',
				'terms' => $wiki,
				'field' => 'slug',
				),
			),
		);
		$a = new WP_Query($args);
			if($a->have_posts()):
			
				$post_count = 1;//カウンターの初期化
				$str.= '<ul class="row">'."n";//最初の囲み
				
				while($a->have_posts()):
				
					$a->the_post();
					
					if(($post_count % 4 )== 1 && $post_count != 1) // ４で割った余りが１で、なおかつカウンターが１（最初）でなければ閉じulと囲みの開始タグを出力		
					{
						$str.='</ul>'."n".'<ul class="row">'."n";
							
					}
							
					if (has_post_thumbnail())
					{
								$str.='<li class="col-md-3">';
								$str.='<a href="'. get_the_permalink() .'">';									
								$str .=get_the_post_thumbnail($post->ID,'size175_160').'<span class="list_2">'.get_the_title().'</span>';
								$str.='</a>';
								$str.='</li>';
					}else{
								$str.='<li class="col-md-3">';
								$str.='<a href="'. get_the_permalink() .'">'.'<img src="'.get_template_directory_uri().'/images/noimage.png" alt="" width="175" height="160" /><span>'.get_the_title().'</span></a>';									
								$str.='</li>';
					}
					
					$post_count++; // カウンターを１増やす 
			
				endwhile;	
								
				$str.= '</ul>'."n"; //最後にulを閉じる
						
			endif;			
		
		echo $str;
		wp_reset_postdata();
	}		
}	

elseを消去しました。

そして、無事に全記事表示されました！

他に参考になりそうな記事

WordPressで投稿記事を1行3カラムで表示させたい時の出力方法の例