追記(2013年3月9日)
↓ 新しくこちらも書きましたので併せてお読みください。
WordPress Popular Posts と Recent Posts Plus を同じ表示で揃える

プラグイン WordPress popular postsサムネイルとタイトルを綺麗に並べるのに苦労しました。

まぁ、私がノンプログラマーでcssとかはGoogleで調べてやっているから基礎が出来てないだけなんですけど。

ですから「これが最良の方法」ということではないと思いますが、もしかしたら誰かの役にたつかもと思って記事に。

以前に紹介したプラグイン Newpost Catch で最近の記事をサイドバーに表示していて、それと同じように表示したかったのですが、私の知識では上手くいかず悪戦苦闘。

で、↓ やっとこんな感じに

WordPress popular posts 1

まず WordPress popular posts の設定です。

WordPress popular posts 2

Shorten title to のタイトル文字数を制限し、Thumbnail は Newpost Catch と同じ大きさに設定。

HTML Markup settings で ↓ のようにします。

WordPress popular post 3

Before Popular Posts の部分が長くて表示されていませんが

です。

あとはcssに ↓ こんな感じで。

wpp-post-title ってのは WordPress popular posts でデフォルトでタイトルの前に

ってのが吐出されてたんで、それを利用(?)してcssでイジってみました。

この方法が正しいのかは疑問ですが、とりあえずIEでは希望の通りに表示されてるんでOKってことに。

WordPress popular posts

「WordPress popular posts でサムネイルとタイトルを並べる」への8件の返信

  1. とてもためになりました!
    ありがとうございます

  2. こんにちは。
    参考にさせていただきました。
    ありがとうございます!

    まだ初心者なので、上記説明の「あとはcssに ↓ こんな感じで。」の所からが
    よくわかっていません。CSSはどこにあるのでしょうか?
    WPのどこを開いて、どこに何を書きこんだらいいのかが、わかりません。

    お手数ですが、ご教示いただけたら大変助かります。

    初歩的なことで、申し訳ありません。

  3. >松本 さん

    コメントありがとうございます!
    css とは

    管理画面の 外観 → テーマ編集 で スタイルシート(style.css) の部分です。

    そこには自分が選んだテーマの css があります。

    そこのファイルに追加します。

    イジる時は元の css は念の為コピーしときましょうね。

    こんな説明でお分かりになりますか?

    イマイチ分からん!って場合はまたコメントくださいねー

    初めてなら分からなくて当然ですから。

  4. くーたさん

    メッセージありがとうございます。

    すみません、まだわかってないのですが、
    スタイルCSSのどこ(何行目)に書き込むのでしょうか?
    スタイルCSSが長すぎるので・・

    また、書き込む内容は、上記の「あとはcssに ↓ こんな感じで。」の
    下の「1~20」をすべて書き込んだらよいのでしょうか?

    コピーして貼り付けでよいのでしょうか?

    すみません、まったくピンときていなくて・・

    お手数ですが、宜しくお願いします。

  5. 松本さん

    こんばんは!

    挿入する場所は css のどこでも OK です。
    最下部で良いと思います。

    あとは 1~20 を全てコピーして貼り付けて下さい。

    ソースコードにマウスを乗せると右上に「クリップボードにコピー」って出ます。
    それ使うと楽ですね。

  6. ピンバック: ugg boots g┨nstige

コメントは受け付けていません。