トップページ・カテゴリーページ・アーカイブページなどのサムネイル画像付き抜粋表示方法まとめ
公開日:
:
最終更新日:2015/04/15
WordPressに挑戦!
デフォルトの設定では、トップページ・カテゴリーページ・アーカイブページなどを表示すると、【全文表示】で最新記事から順番に並ぶ形になっています。
当ブログでは、各ページをプラグインを使って【サムネイル画像付きの抜粋表示】に変更しています。
当ページでは、プラグイン導入後に行った設定やカスタマイズ方法を記録したいと思います。
※wordpress3.5.1 テーマは【Twenty Twelve】での記事投稿となります。
※ファイル編集は必ずバックアップを取ってから行ってください。
「子テーマ」を作成しておくと、テーマのアップグレードの際に変更内容が消えることがありません。(function.php以外)
~2015年3月追記~
こちらの記事内容は、アイキャッチ画像の使い方を詳しく知らない段階で作成したものです。
トップページをアイキャッチ画像表示ではなく、記事内の画像をサムネイルで表示させる方法を記録しています。
自身の思い出として投稿ページはこのままにしてあります。
~追記ここまで~
サムネイル画像付き記事一覧を表示してくれるプラグイン【Thumbnail for Excerpts】
【Thumbnail for Excerpts】は、記事内の最初に表示されている画像をサムネイル化して表示してくれるプラグインです。
こちらは、wordpressの「公式プラグインディレクトリ」からインストールする事が出来ます。
当ブログでの表示は下記の様になっています。
関連記事を記事下に入れているので、ちょっと長めです。。^^
ちなみに、【アイキャッチ画像】を使ったページは、下記の様に表示されています。
デカっ!!(笑)
ページ内で使用したサイズのまま表示されます。(当たり前??)
各ページでアイキャッチ画像を設定されている方は、記事の抜粋表示だけで良いかもしれません。
【Thumbnail for Excerpts】の特徴、設定方法などは、下記ページを参考にさせて頂きました。
>[wordpress]画像付きがイイヨね!!TOPページなど記事一覧に自動で画像を付加する「Thumbnail For Excerpts」/NORI510.com
ありがとうございます。
記事抜粋表示のタグ修正
【Thumbnail for Excerpts】をインストール、有効化後は条件に合わせてタグの修正が必要になります。
条件とは、ブログ内のどのページを抜粋表示にするか。どのページを全文表示にするか。という点です。
当ブログの場合は、個別記事と固定記事以外のページは、抜粋表示(記事一覧)で表示させるようにしています。
テーマ編集「content.php」の下記赤枠の位置のコードを書き換えます。
※<?php
if
( is_search() ) :
// Only display Excerpts for Search ?> ←元のコード
使用コード、その理由については、下記ページで詳しく説明されています。
>WordPressの投稿記事一覧を抜粋表示する条件分岐タグの使い方/メイン・カテゴリー・タグ・アーカイブページなど/the present note
ありがとうございます。
抜粋部分最後の[…]の表示を変える方法と「続きを読む」を追加する方法
デフォルトでの記事抜粋表示の最後は、[…]←になっています。
この部分を変更し、更に「続きを読む」という個別ページへのリンク文字を追加する為に、テーマの編集「functions.php」の最後に下記コードを追加しました。
※赤枠の【・・・】と【続きを読む】の部分は、好きな言葉に変更出来ます。
使用コード、その理由については、下記ページで詳しく説明されています。
>wordpressのよくあるカスタマイズ(抜粋表示、the_excerpt 関連)/Web Desingn Recipes
ありがとうございます。
プラグインを使った、サムネイル画像付き抜粋表示方法。。
何の知識も無い私にとっては、思った以上に大変な作業でした。
沢山の役立つ情報を発信して下さっている、サイト管理者様へ感謝の気持ちを込めて。
また、自分自身のメモとしての記事投稿でした。(忘れっぽいからねぇ。。^^)

関連記事
-
-
プラグイン設置以外のカスタマイズ記録
こちらのページは、プラグイン設置以外のカスタマイズ記録になります。 これまでのプラグイ
-
-
Facebook「Like box」から「Page Plugin」へ ~作成のポイントとスマホやサイドバーで右端が切れてしまう場合の対処法~
新しくサイトを作っていて、いつものノリでFacebookのLike box作成ページへ行った
-
-
文字がにじむ。ぼやける。。Twenty Twelveヘッダー画像の謎。。
当ブログで使用しているテーマ【Twenty Twelve】は、カスタムヘッダーと言って、自分
-
-
WordPress【Twenty Twelve】カスタマイズ追記いろいろ。。
wordpressのマルチサイト化で作成した新サイトをオープンして、コンテンツ作りを少しずつ
-
-
WordPressへのGoogle Analytics導入についての特記事項
私はホームページ作成の際には、アクセス解析にGoogle Analytics(グーグルアナリ
-
-
本当に簡単だった♪ロリポップのWordPress簡単インストール
wordpressでブログを作っていく際にまず最初にする作業は【wordpressのインスト
-
-
WordPress ロリポップ/独自ドメインマルチサイト化 意外だったエラーの訳。。
1つのwordpressで、ブログを複数管理できるように変更する機能として【マルチサイト化】
-
-
ブログリニューアルと新サイトのご紹介です♪
こんにちは♪ ご訪問ありがとうございます。(*^_^*) ブログをリニューアルしました♪ この
-
-
WordPressでブログを作ろうと思った理由
はじめに カテゴリー『WordPressに挑戦!』の記事は、自身のメモ代わりの投稿記事となりま
-
-
WordPressインストール後 最初にやっておきたい事リスト
wordpressのインストールが成功したら、記事投稿の前にやっておきたい事。。 やっておいた方が

Comment
[…] トップページ・カテゴリーページ・アーカイブページなどのサムネイル画像付き抜粋表示方法まとめ […]