未分類

  (最終更新日: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. 未分類

    映画レビュー「ヒューゴの不思議な発明」。ファンタジーでもラブロマンスでも無い。良質な大人の映画

    さすがはマーティン・スコセッシ監督!なんという良質な大人の映画じゃ…

  2. 未分類

    ドッキリ映像。地面にあったWindows8タイルを踏むと突然目の前の壁が倒れきてライブ会場になる

    ドッキリ映像コレクターのいつきです。 嘘です。ごめんなさい。…

  3. MeiryoKe_Console

    Windows 7

    等幅フォントのメイリオ「MeiryoKe_Console」をWindows7にインストールする方法

    修正:2014/08/31画像がリンク切れとなっていたので…

  4. Facebookのハイライトと最新情報の違い

    未分類

    Facebookタイムラインの「ハイライト」と「最新情報」の違い

    Facebookのタイムラインの並び順として選択できる「ハイライト…

  5. 未分類

    ブログのタイトルとドメインを変更しました、のご報告

    大人の事情諸事情によりブログの名前とドメインを変更しました。みっく…

  6. 未分類

    iPhone 5の影響は本当に極小?ドコモの一人負けで10月に19万件が流出。

    相変わらずドコモの一人負けが続いていますね。2012年10月度の契…

コメント

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

最近の記事

Twitter

  1. LINE

    友達のLINEアカウントを別の友達に教える方法
  2. ニュース

    日本でもスマートシティが徐々に活況に、というニュース
  3. CM

    東芝LEDの新作CM「LED 10years live」がガチで泣けてやばいと話…
  4. LINE

    LINEでトーク名が「メンバーがいません」になった理由と解決策
  5. 子供用アイテム

    風邪予防、対策に3歳から飲める小児用栄養ドリンク
PAGE TOP