何をしてあげられるという訳じゃないBlog微かな戸惑いをそっと吐きだすまりーのブログ。itAN(tcd014)では、TOPページに最近の記事がきれいに整えられて表示されるようになっています。この最近の記事では、最新の投稿順にアイキャッチ画像付きの記事が6記事表示され、続いてアイキャッチ画像のないテキストのみの記事が4記事表示され、全部で10記事まで表示されるようになっています。そのようになっている最近の記事をカスタマイズして、アイキャッチ画像付きで表示される記事数を9記事に増やしたり、記事タイトルのみの記事をなくしたりする方法を紹介します。バックアップを取って自己責任でお願いします。何らかのトラブル等がおこっても、私は一切の責任を負えませんのでご了承ください。アイキャッチ画像付きの記事を9記事にするまず、アイキャッチ画像付きの記事を9記事にしてみます。タイトルのみで表示される記事数は、4記事のままにしておきます。部分が、最近の記事に関するコードです。「10」が、最近の記事に表示される記事数です。部分は、「6記事まで、アイキャッチ・日付・記事タイトル・抜粋を表示しますよ~」という意味のことが書かれています。部分は、「もし7記事目があったら、記事タイトルだけのスタイルにするよ~」という意味のことが書かれています。-->上記にあげた3つの数字をそれぞれ変更していきます。結論から言うと、今回の例では、それぞれの数字に3を足したものに変更するだけになります。「13」が、最近の記事に表示される記事数で、アイキャッチ画像付きが9記事とタイトルだけが4記事の合わせて13記事ということになります。部分が、10記事目以降は記事タイトルだけのスタイルになるという意味になっています。アイキャッチ画像付きの記事だけを表示する次に、記事タイトルのみで表示される部分をなくして、アイキャッチ付きの記事だけを表示させるようにしてみます。デフォルトでは、アイキャッチ画像付きが6記事ですので、表示される記事数を6に変更します。$count_posts->publish;これだけで、アイキャッチ画像付きの6記事だけになり、記事タイトルのみで表示される部分はなくなります。記事タイトルのみで表示される記事だけを表示するアイキャッチ画像付きの記事をなくして、表示されるすべての記事、10記事を記事タイトルのみで表示する方法を紹介します。することで、アイキャッチ画像付きで表示させる記事を0記事にしています。部分が、1記事目から記事タイトルだけのスタイルにするという意味になっています。これで、1記事目から記事タイトルのみで表示されます。アイキャッチ画像付きの記事と記事タイトルのみのあいだにある点線を削除するデフォルトでは、アイキャッチ画像付きで表示される記事と、記事タイトルのみで表示される記事のあいだには、点線が表示されるようになっています。この点線は、記事タイトルのみの記事上部に表示されるようにCSSがあてられています。記事タイトルのみの記事が表示される以上、どうしても点線が表示されてしまいますので、この点線を削除します。部分が、最近の記事に関するコードです。点線と記事の余白です。}これで、点線が表示されなくなります。最後にアイキャッチ付きの記事数を9記事に増やすと、PCから見た時はキレイなのですが、スマホから見ると、下にブワァーッと縦長に伸びてしまうので、ユーザーからするとちょっとウザく感じるかもしれませんね。itAN(tcd014)のグローバルメニューやスライダーの背景などをカスタマイズする~TCD~投稿ページ・固定ページの記事タイトルやページ内で使うhタグをデザインする関連記事TCDテンプレートでヘッダーロゴの画像をスマホでも表示させるAN(tcd014)でページ上部へ戻るボタンをカスタマイズする方法AN(tcd014)のfont-familyを変更するプラグインを使わずにSNSボタンを好きな場所に表示させるAN(tcd014)で投稿ページを左サイドバーから右サイドバーに変更する方法AN(tcd014)での投稿記事下のページ送り(ページャー)をカテゴリ別にする方法コメントトラックバックは利用できません。(0)この記事へのコメントはありません。返信をキャンセルする。-URLトップページに戻るサイト内検索おすすめ記事2015.3.23~TCD~投稿ページ・固定ページの記事タイトルやページ内で使うhタグをデザインするAN(tcd014)の投稿ページと固定ページの記事タイトルには、h2の見出しが使...2015.2.12AN(tcd014)の関連記事を横2記事×縦3記事で6記事表示にするAN(tcd014)では、PCで表示したとき、投稿ページに表示される関連記事は5...2015.3.9AN(tcd014)のグローバルメニューやスライダーの背景などをカスタマイズするAN(tcd014)で、グローバルメニューやスライダーなど、ヘッダー付近の背景を...2014.8.18TCDテンプレートでヘッダーロゴの画像をスマホでも表示させるこのサイトで使用しているTCDテンプレート「AN」では、ヘッダーロゴの画像はスマ...2014.5.12TCDテンプレート「AN」をカスタマイズして内部SEOを行うTCDテンプレート「AN」での、見出しタグの使い方が気になったので、カスタマイズして使っています。ページ上部へ戻る当サイトについてこのサイトは、私が興味を持っている事、学んだ事、またオススメしたいものなどを書いています。「ちゃんと覚えてるんだ」と言えるように、備忘録的なことも書いていきます。更新スピードはトボトボです。プロフィールHN:まりーコーヒーを相棒にしてアフィリエイトをしています。お世辞にも面白いとは言えないブログですが、書かせてちょうだいよ、いいね。