*

WordPress popular postsの表示を変更する巻

公開日: : 最終更新日:2012/11/05 WEB

WordPress popular postsの表示を変更しました

WordPress popular postsは人気記事を自動で表示してくれる便利なプラグインです
が、そのまま使うと表示の仕方がイマイチ
リスト構造なので「・」ドットが表示されてしまうし、写真と文字の構成がバラバラ

今回、2点修正しました
1)ドットを外す
2)文字を写真の右側に回しこむ

【修正前】

【修正後】

CSSのソースはこちら↓

/* =Widget Areas
-------------------------------------------------------------- */
#main .popular-posts ul {
	list-style: none;
	margin-left: 0;
}
#main .popular-posts li {
	padding-bottom: 0.5em;
}
#main .popular-posts img {
         float: left;
         margin-right: 1em;
}
#main .floatclear {
         clear: both;
      }

1)のドットを外すについては、popular-postsのulをlist-style: none;にしてしまえばOK
2)の文をまわしこむのは2点修正必要
CSSの修正は上記の通り
もう、1点はpopular postsのWidgetのHTML出力設定を修正
「Before/After each post:」の「

  • 」を「
  • 」に変更
    こちら↓

    「

  • 」にすることで、回り込みの解除を行います

    CSSによる文の回り込み設定はこちらを参考にしました
    【参考】
    画像の回り込みを行う

  • PC

    関連記事

    これでアクセス数低下を阻止!重複するメタデータ(descriptions)の問題を解消!?

    先月ぐらいから急激に姉妹サイト(日々雑記帳 =ラーメンを綴る日々=)のアクセス数が急激に落ち込み

    記事を読む

    繰り返し表示を大量生産! WordPressで差込表示するの巻

    WordPressの記事で特定のシリーズなどで同じ文章を繰り返し表示したいときってありますよね

    記事を読む

    Yahoo JapanディベロッパーネットワークのアプリケーションIDを簡単に取得してみる

    プロジェクトJでYahoo JapanのディベロッパーネットワークのアプリケーションIDを取る必要が

    記事を読む

    6人の人気ブロガーから判る月の更新回数!

    6人の人気ブロガーから判る月の更新回数! 前回、「質より量」と言うことで、月の更新回数の目標を

    記事を読む

    アフェリエイトを少し有利に!もしもアフェリエイトを申請、カエレバ、ヨメレバを設定してみたの巻

    ちょっとアフェリエイトが有利になりそうです はじめ ブログのアクセス数もちょこっと伸びて

    記事を読む

    WordPressのLightBoxが、おかしくなったので直してみたの巻

    どうも一時期、プラグインのアップデートでプラグイン同士の齟齬が発生したようです ちょっ

    記事を読む

    容易に実現! 最近の投稿の写真を枠つきに変えてみたの巻

    こちらも簡単にできました 最近の投稿を写真なしから写真ありに変えてみました こちらは

    記事を読む

    ブックマークレット 食べログの店名TEL住所営業時間定休日駐車場を表示

    ブックマークレットを作ってみました 食べログから店名、住所、営業時間を抽出するものです

    記事を読む

    もう簡単、記入するだけ! WPtouchでGoogle adsense広告を打ってみたの巻

    あっという間にモバイル向けアドセンスが簡単にできました このブログのモバイル向け表示に

    記事を読む

    少し便利に!アマゾン、楽天で同時検索するブックマークレットの選択したテキストをクリップボードにコピーするように修正したの巻

    はじめに 先日、作成した「選択した商品のテキストをアマゾン、楽天で同時検索するブックマークレッ

    記事を読む

    PC

    PC

    PAGE TOP ↑