サムネイル付の最新記事一覧を3列で表示したい!
-
最新記事のサムネイルと記事タイトルを一覧として表示するために
下記のようなコードを拾ってきました。<div class=”side-new”>
<p>★最新記事(カテゴリ別)</p>-
<?php
- “;
if(has_post_thumbnail()) {
$img = wp_get_attachment_image_src(get_post_thumbnail_id(),array(60,60));
echo “<img src='{$img[0]}’ alt='{$new_title}’>”;
}
echo “{$new_title} <span style=’font-size:13px’>(” . get_post_time(‘Y.m.d’) . “)</span>
$cat = get_the_category();
$post_id = get_the_ID();
$cate_ids = $cat[0]->term_id;
for($i=1; $i<count($cat); $i++) {
$cate_ids .= “,” . $cat[$i]->term_id;
}
$newposts = get_posts( array(
‘category’ => $cate_ids,
‘posts_per_page’ => 5,
‘exclude’ => $post_id ));
foreach( $newposts as $post ):
setup_postdata( $post );
$new_title = get_the_title();
echo ”“;
endforeach;
wp_reset_postdata();
echo ‘</div>’;
?>この記述を、テーマの固定ページテンプレート (page.php)に入れ、
CSS(スタイルシート)に
.side-new a {
display: block;
}
.side-new li {
overflow: auto;
margin: 4px;
padding: 0;
line-height: 1.5;
border-bottom: 1px dashed #999;
}
.side-new img {
float: left;
margin: 0 4px 0 0;
width: 60px;
height: 60px;
}と記述すると、
固定ページにサムネイル付きで最新記事一覧が表示されるようになりました。この最新記事一覧は、サムネイル画像の横に記事タイトルが表示され、
横1列で2段3段と続いていきます。これを、サムネイル画像の下にタイトル文を表示し、
横に3列としたいのです。そして、’posts_per_page’ => 6,と設定した場合、最新記事が6つ表示されるので、
横3列2段の表示になるようにしたいのですが、上記のコードに
どう記述を加えてカスタマイズすれば良いのか教えていただけますでしょうか。
できるだけ詳細に知りたいです。
よろしくお願い致します。 - “;
- トピック「サムネイル付の最新記事一覧を3列で表示したい!」には新たに返信することはできません。