スポンサーリンク

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

公開日: : 最終更新日:2015/04/15 WordPressに挑戦!

illust184_thumb

デフォルトの設定では、トップページ・カテゴリーページ・アーカイブページなどを表示すると、【全文表示】で最新記事から順番に並ぶ形になっています。
当ブログでは、各ページをプラグインを使って【サムネイル画像付きの抜粋表示】に変更しています。

当ページでは、プラグイン導入後に行った設定やカスタマイズ方法を記録したいと思います。
※wordpress3.5.1 テーマは【Twenty Twelve】での記事投稿となります。

※ファイル編集は必ずバックアップを取ってから行ってください。
「子テーマ」を作成しておくと、テーマのアップグレードの際に変更内容が消えることがありません。(function.php以外)

~2015年3月追記~
こちらの記事内容は、アイキャッチ画像の使い方を詳しく知らない段階で作成したものです。
トップページをアイキャッチ画像表示ではなく、記事内の画像をサムネイルで表示させる方法を記録しています。
自身の思い出として投稿ページはこのままにしてあります。
~追記ここまで~

スポンサーリンク


サムネイル画像付き記事一覧を表示してくれるプラグイン【Thumbnail for Excerpts】

【Thumbnail for Excerpts】は、記事内の最初に表示されている画像をサムネイル化して表示してくれるプラグインです。
こちらは、wordpressの「公式プラグインディレクトリ」からインストールする事が出来ます。

当ブログでの表示は下記の様になっています。
関連記事を記事下に入れているので、ちょっと長めです。。^^

25

ちなみに、【アイキャッチ画像】を使ったページは、下記の様に表示されています。
デカっ!!(笑)
ページ内で使用したサイズのまま表示されます。(当たり前??)
各ページでアイキャッチ画像を設定されている方は、記事の抜粋表示だけで良いかもしれません。

26

【Thumbnail for Excerpts】の特徴、設定方法などは、下記ページを参考にさせて頂きました。
>[wordpress]画像付きがイイヨね!!TOPページなど記事一覧に自動で画像を付加する「Thumbnail For Excerpts」/NORI510.com
ありがとうございます。

記事抜粋表示のタグ修正

【Thumbnail for Excerpts】をインストール、有効化後は条件に合わせてタグの修正が必要になります。
条件とは、ブログ内のどのページを抜粋表示にするか。どのページを全文表示にするか。という点です。
当ブログの場合は、個別記事と固定記事以外のページは、抜粋表示(記事一覧)で表示させるようにしています。

テーマ編集「content.php」の下記赤枠の位置のコードを書き換えます。
<?php if ( is_search() ) : // Only display Excerpts for Search ?> ←元のコード

23

使用コード、その理由については、下記ページで詳しく説明されています。
>WordPressの投稿記事一覧を抜粋表示する条件分岐タグの使い方/メイン・カテゴリー・タグ・アーカイブページなど/the present note
ありがとうございます。

抜粋部分最後の[…]の表示を変える方法と「続きを読む」を追加する方法

デフォルトでの記事抜粋表示の最後は、[…]←になっています。
この部分を変更し、更に「続きを読む」という個別ページへのリンク文字を追加する為に、テーマの編集「functions.php」の最後に下記コードを追加しました。
※赤枠の【・・・】と【続きを読む】の部分は、好きな言葉に変更出来ます。

24

使用コード、その理由については、下記ページで詳しく説明されています。
>wordpressのよくあるカスタマイズ(抜粋表示、the_excerpt 関連)/Web Desingn Recipes
ありがとうございます。


プラグインを使った、サムネイル画像付き抜粋表示方法。。
何の知識も無い私にとっては、思った以上に大変な作業でした。
沢山の役立つ情報を発信して下さっている、サイト管理者様へ感謝の気持ちを込めて。
また、自分自身のメモとしての記事投稿でした。(忘れっぽいからねぇ。。^^)






関連記事

Facebook「Like box」から「Page Plugin」へ ~作成のポイントとスマホやサイドバーで右端が切れてしまう場合の対処法~

新しくサイトを作っていて、いつものノリでFacebookのLike box作成ページへ行った

記事を読む

WordPress【Twenty Twelve】カスタマイズ追記いろいろ。。

wordpressのマルチサイト化で作成した新サイトをオープンして、コンテンツ作りを少しずつ

記事を読む

プラグイン設置以外のカスタマイズ記録

こちらのページは、プラグイン設置以外のカスタマイズ記録になります。 これまでのプラグイ

記事を読む

WordPressでブログを作ろうと思った理由

はじめに カテゴリー『WordPressに挑戦!』の記事は、自身のメモ代わりの投稿記事となりま

記事を読む

ドメイン取得とレンタルサーバー選び

ドメインとレンタルサーバーとは? wordpressを利用するにあたって、必要になるのが「ドメ

記事を読む

WordPress関連-LinkWithinマルチサイト表示方法とプラグインリスト追記

今日は久しぶりにWordPress関連の記事内容となります。 のんびりと(長々と?)書いて

記事を読む

WordPressインストール後 最初にやっておきたい事リスト

wordpressのインストールが成功したら、記事投稿の前にやっておきたい事。。 やっておいた方が

記事を読む

文字がにじむ。ぼやける。。Twenty Twelveヘッダー画像の謎。。

当ブログで使用しているテーマ【Twenty Twelve】は、カスタムヘッダーと言って、自分

記事を読む

ブログリニューアルと新サイトのご紹介です♪

こんにちは♪ ご訪問ありがとうございます。(*^_^*) ブログをリニューアルしました♪ この

記事を読む

当ブログで使用しているプラグインリスト

つい最近まで、wordpressの存在すら知りませんでしたから、当然どんなプラグインがあるの

記事を読む

Comment

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

Message

メールアドレスが公開されることはありません。



follow us in feedly  
  • HN:ai
    北海道在住
    ▶プロフィール詳細へ

    当ブログは北海道限定情報サイト
    「北海道ディレクトリ」登録サイトです。

    北海道ディレクトリ

    • 子供と遊べる北海道の遊び場情報サイト
      ▶コドベル北海道
    • 北海道民のためのお得情報&節約情報サイト
      ▶得北
    • その他北海道関連のおすすめサイトは
      ▶こちらから♪
PAGE TOP ↑