「最近の投稿」にサムネイル画像を表示させたいと思った時に便利なプラグインが「Newpost Catch」です。
WordPressには既にウィジェットで「最近の投稿」を実装していますが、サムネイル画像を表示する機能は付属していません。
そこで、画像を表示することが出来ないかなと調べていた所、「Newpost Catch」というワードプレスのプラグインがならサムネイル画像を表示出来るということだったので、今回はこのプラグインについて、導入方法をまとめてみたいと思います。
※既に私は「Newpost Catch」を実装しています。
Newpost Catchの特徴
自分が使っているワードプレスのテンプレートで「最近の投稿」にサムネイル画像を表示させる機能が無かったとしても、「Newpost Catch」を利用すれば、無料で「最近の投稿」にサムネイル画像を表示させることが出来ます。
画像の大きさや投稿件数なども設定することが可能です。
サイドバーに画像付の最新記事を表示させることで、サイトを訪問してくれたユーザーの離脱を防ぐことが出来ます。
せっかく自分のサイトに訪問してくれたエンドユーザーさんをしっかり逃さないように「Newpost Catch」を設置しましょう。
インストール方法
管理画面→プラグイン→新規追加→プラグインの検索→「Newpost Catch」を入力し検索→インストール
または、WordPress.org から「Newpost Catch」をダウンロードし、アップロード後にインストールして下さい。
Newpost Catchのカスタマイズ設定
Newpost Catchはウィジェット画面で設定していきます。
ウィジェットにプラグインを表示させると細かい設定が出来るようになります。
管理画面→外観→ウィジェット→Newpost Catch
サムネイルの設定
サムネイル画像のサイズを設定出来ます。大きさはピクセル単位で入力します。
投稿件数
表示したい記事数を入力します。
プラグインフォルダ内のデフォルトCSS
分からなかったら、チェックを入力するのが無難です。デザインを修正したい方は、チェックを外して、直接CSSを書き込んでください。CSSファイルは以下の場所にあります。
CSSのカスタマイズ
ワードプレスのテンプレートによって、表示がおかしくなることがあります。
その場合、CSSのカスタマイズで調整していきましょう。
CSSファイルの場所
/wp-content/plugins/newpost-catch/style.css
初期のCSS
style.css
#npcatch li{
overflow:hidden;
clear:both;
margin:0px 0px 0px;
}
#npcatch img{
float:left;
padding:5px 10px;
}
#npcatch .title{
width:135px;
float:left;
padding:5px 5px 5px 0px;
}
#npcatch li:hover{}
#npcatch li:hover .title{}
#npcatch li:hover .title a{}
#npcatch li:hover .date{}
初期のCSSでは、サイドバーの横幅が狭くなっています。
必要に応じてピクセル数を増やしましょう。
背景や余白を削除したい場合
ワードプレスのテンプレートによってliタグに背景や余白が表示される場合があります。その際は、以下の例を参考にしてください。
ul#npcatch li {padding:0px;backgroud:none;}
最後に
Newpost Catchを利用して、検索エンジンから訪問してくれたエンドユーザーの離脱率を下げるようにしていただければと思います。
やはり、人間は文章よりも画像の方がわかりやすいため、目にもつきやすいです。
是非、サムネイル付の最新記事をサイドバー等に設置していただき、サイトをたくさん閲覧してもらうようにしましょう。
