未分類

  (最終更新日:2012.10.14)

WordPress Popular Posts でサムネイル画像を綺麗に表示させる方法

このブログでも利用しているWordpressプラグイン『人気の記事』の WordPress Popular Posts で、サムネイル画像を表示させたいなぁと思って設定をONにしたのですが、初期状態でサムネイルを表示させるようにした場合は、タイトルが長い場合などにこのような状態になってしまいました。見た目が悪い…


というわけでWordPress Popular Postsのスタイルシートを修正してサムネイル画像を綺麗に表示させる方法をご紹介です。


スタイルシートのファイルはプラグインフォルダの中のstyleフォルダにあります。
(wordpress-popular-posts\style\wpp.css)


まずはimg.wpp-thumbnailを修正。
下記のように変更します。


img.wpp-thumbnail {
border:none;
float: left;
margin-right: 5px;
}


このままだと下図のようにfloatが解除されず、崩れてしまいます。


というわけで今度は下記のスタイルを追記します。


.popular-posts ul li {
overflow: hidden;
}


これでfloatを解除できるはず! というわけで下図のようになりました。


これで綺麗にサムネイル画像を表示させることができますね。


では!

関連記事

  1. 未分類

    木枯らし1号は東京と大阪でのみ宣言される秋の風物詩

    東京で木枯らし一号の観測が宣言されましたね。『木枯らし』と…

  2. らくらくパケ・ホーダイは2,980円

    未分類

    らくらくスマートフォンはパケ放題が2,980円

    なん・・・だ・・・と(゚A゚;)ゴクリなんと、ドコモらく…

  3. Do!Premiumの使い方

    未分類

    可愛くてオシャレなTodoアプリならDo! Premiumがガチおすすめ

    どうせToDoアプリを使うなら見た目も可愛くて、かつお洒落なアプリ…

  4. 未分類

    遂に家電にまで進出くまー。くまモンノートPCが予約開始。価格は39,800円から72,800円。

    遂にくまモンがノートPCになりましたで!株式会社ユニットコムによ…

  5. 未分類

    映画レビュー「Black & White」。これは絶対おすすめ!爆笑必至なラブコメディ

    これは本当におすすめですよ!大声で笑って楽しめる上質のラブコメ…

  6. インターネット関連のニュース

    [MH4] バッファローがモンスターハンター4の動作確認済み無線LAN製品を公表

    パソコン周辺機器や無線LANのアクセスポイント機器なども製造販売するバ…

コメント

  1. この記事へのコメントはありません。

最近の記事

Twitter

  1. iPhone

    oekakigram:お絵描きを共有して楽しめるInstagram風アプリが超楽…
  2. Moneytree

    【iOS】資産管理アプリのMoneytreeヤバイ!!! 賢すぎて好きになっちゃ…
  3. Amazon

    Amazon Echoに新しい端末をBluetoothでペアリングする方法
  4. 気になるアイテム

    【ポケドラCloud】スマホ容量不足はこれで解消。家庭向けクラウドストレージの新…
  5. CM

    必見!トヨタLEXUSの新CM「Amazing in Motion」が度肝を抜く…
PAGE TOP