未分類

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

    他キャリアユーザーがソフトバンクでiPad miniを購入した場合の月額料金まとめ

    先に公開した記事「ソフトバンクユーザーがソフトバンクでiPad min…

  2. 未分類

    衆議院が解散するときに万歳三唱をする理由

    バンザーイ!バンザーイ!バンザーイ!という掛け声ととも…

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

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

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

  4. 未分類

    WordPress Popular Postsでデータが登録されない事象の顛末

    どうも、wordpress超初心者につきエラー絶賛発生中のいつきで…

  5. 未分類

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

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

  6. iPad miniの原価

    未分類

    iPad miniの原価(部品コスト)は約15,000円

    Touch Labさんの記事によると、iPad miniの部品コス…

コメント

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

最近の記事

Twitter

  1. Tips

    いろいろ試したけどWindows標準の付箋ソフトがシンプルでデザインも良く、一番…
  2. Slack

    【Slack】サイドバーメニューの背景色を変更する方法
  3. 話題のネタ

    これが最後のあぶデカ復活!10年ぶりに「あぶない刑事」が映画化に
  4. LINEマンガ

    LINEマンガ:映画化もされた「悪の教典」が8/7まで1巻無料!学校に潜むサイコ…
  5. Googleカレンダー

    Googleカレンダーの検索で結果件数分が全て表示されない場合に大量に表示させる…
PAGE TOP