WordPressで人気記事を表示するプラグイン『Popular Posts』を画像つきで表示させる方法

2013年2月12日 - Wordpress

スポンサーリンク


 
こんにちは(^-^)/

ナカジ(@cp_nakajun)です。

 

前々からやりたかったのですが、中々手を付けられていなかった

 

「よく読んで頂いている記事」のサムネイル画像表示

『Popular Posts』を画像つきで表示させる方法ですね。

 

ようやく手を付けたのでやり方を残しておきます。

スポンサーリンク

 

先ずは『Popular Posts』のインストールですが、割愛します。

上記のリンクからダウンロードしてインストールしてください。

 

1.『Popular Posts』設定

管理画面の「設定」->「Popular Posts」で、画面上部に「output」をクリック。

「output settings」の画面で「output template:」にコードを記述します。

【ソースコード】

<div class="popular_posts">
<a title="「{title}」の記事へ移動する" href="{url}">
{php: echo get_the_post_thumbnail(
 {postid}, array(45,45), array('title' => ' {title}' )); }
<div class="popular_posts_title">{title} </div></a>
</div>
<div style="clear: both"></div>

 
 

2.表示するスタイルを設定

管理画面の「外観」->「テーマ編集」で(style.css)に以下を追加します。

.wp-post-image {
        border:solid 1px #ccc;
        padding: 4px;
        float: left;
        margin-left: -80px;
        margin-bottom: 10px;
/*      vertical-align: text-top; */
}
.popular_posts {
        padding: 3px;
        margin-top: 3px;
        margin-left: 80px;
}
.popular_posts_title {
        margin:2px auto;
        font-size: 90%;
}

 

以上で完成です。

 
※僕は以下の記事を参考にしました。
 
『Popular Posts』をカスタマイズして人気記事をサムネイル画像付きで表示させる方法。 | 地方公務員のWEBノート

 

 

 

スポンサーリンク


サイト運営者

運営者:ナカジ
電子音楽家・クリエイティブコーダー・ブロガー

>>運営者プロフィール&当サイトの詳細

スポンサーリンク

記事を検索