WordPressで最近の投稿や特定のカテゴリ内の記事を画像付きでサイドバー表示させてみました!

スポンサーリンク

タイトルだけより、サムネイル画像付きのほうがやっぱり見た目がいいですんね。今この記事を読んでいるときに表示されているかどうかわかりませんが、この記事の投稿時点では、このブログのサイドバーに記事内の画像をサムネイル表示した「最新記事」や最近の男の料理(特定のカテゴリ内の最新記事を)が表示されています。

 

WordPressで最近の投稿や特定のカテゴリ内の記事をサムネイル画像付きで表示 WordPressで最近の投稿や特定のカテゴリ内の記事をサムネイル画像付きで表示させる方法

いろいろと調べてやっとできるようになりました。その方法とは?

記事を画像付きで紹介

まず、最新記事を画像付きでサイドバー表示する方法として、参考にさせていただいたサイトは、http://scianto.net/archives/2009/04/19230142.php です。(感謝!)
(showposts=10&cat=-189 は189(カテゴリーの「料理」)以外の最新記事を10件表示という意味です。 )

<?php if ( have_posts() ) : query_posts(‘showposts=10&cat=-189’); ?>
<ul>
<?php while (have_posts()) : the_post(); ?>
<li><a href='<?php the_permalink() ?>’ title='<?php the_title(); ?>’><img style="display: inline; margin: 3px 5px 3px 0px" height="54" width="59" align="left" src='<?php $values = get_post_custom_values(‘post_image’); echo $values[0]; ?>’ alt='<?php the_title(); ?>’ />
</a>
<a href='<?php the_permalink() ?>’><?php the_title(); ?></a>
</li>
<?php endwhile;?>
</ul>
<?php endif; ?>

スタイルはスタイルシートを直接いじるより、上記のコード img style="display: inline; margin: 3px 5px 3px 0px" height="54" width="59" align="left" を含めました。

次に、特定のカテゴリの一覧表示をサイドバーに画像付き紹介するコードは、

http://wp.tekapo.com/2009/01/15/using-custom-fields-to-display-post-thumbnails/を参照させいただき、以下のようにコードを仕込みました。

<?php if ( have_posts() ) : query_posts(‘showposts=5&cat=189’); ?>
<ul>
<?php while (have_posts()) : the_post(); ?>
<li><a href='<?php the_permalink() ?>’><?php the_title(); ?></a>
<a href='<?php the_permalink() ?>’ title='<?php the_title(); ?>’><img src='<?php $values = get_post_custom_values(‘post_image’); echo $values[0]; ?>’ alt='<?php the_title(); ?>’ />
</a>
</li>
<?php endwhile;?>
</ul>
<?php endif; ?>

showposts=5&cat=189 はカテゴリID=189に属する最新記事5つを表示させるという意味ですね。

上記の例は2つともWordPressのカスタムフィールドをあらかじめ設定して、記事内の画像のURLを指定しておく必要があります。それに関する記事は、WordPressで人気記事一覧を画像付きで表示する方法 :WordPress|アマモ場をご覧ください!

スポンサーリンク
スポンサーリンク

フォローする

関連記事
スポンサーリンク

コメント

  1. […] Post)をサムネイル画像付きで表示していました。これはWordPressで最近の投稿や特定のカテゴリ内の記事を画像付きでサイドバー表示やWordPressで人気記事一覧を画像付きで表示する方法で […]