WordPressテーマで投稿抜粋を表示する方法

抜粋はコンテンツの簡単なプレビューを提供し、訪問者が各投稿が何についてであるかをすばやく理解できるようにし、さらにクリックするように促します。これは、ブログリスト、アーカイブ、検索結果ページで特に役立ちます。

投稿の抜粋を表示することで、サイトのレイアウトを視覚的に魅力的にし、読み込み時間を短縮できます。ただし、ほとんどのWordPressテーマでは、デフォルトで投稿の抜粋が表示されません。自分で設定する必要があります。

WPBeginnerでは、常にホームページとブログページのすべての記事の抜粋を表示しています。このアプローチにより、より多くの投稿を前面に表示し、訪問者がコンテンツを簡単に閲覧できるようになります。また、WordPressテーマのカスタマイズやブログの最適化に関する多くの経験もあります。

この記事では、WordPressテーマに投稿の抜粋を簡単に追加する方法を紹介します。

WordPressで投稿抜粋を表示する理由

デフォルトでは、WordPressはホームページ、ブログページ、およびウェブサイト全体のアーカイブページに完全な投稿を表示します。しかし、これはユーザーがさまざまな投稿をすばやく閲覧して、最初に読みたい投稿を見つけたいという体験にとって最良のものではありません。

また、大量のスクロールが必要になる場合もあり、これはスマートフォンやタブレットのユーザーにとって大きな問題です。

より多くの投稿を公開すると、WordPress はページネーションを使用してブログを複数のページに分割することもあります。古い投稿が他のページに押し出されると、表示回数やエンゲージメントが大幅に少なくなることがよくあります。

このため、多くのブログ所有者は、アーカイブページやブログインデックスページに投稿の抜粋を表示します。記事の一部しか読み込まれないため、これによりWordPressの速度とパフォーマンスを向上させることができます。

WordPressには投稿抜粋の組み込みサポートがありますが、すべてのテーマがこの機能を利用しているわけではありません。

それでは、WordPressテーマで投稿の抜粋を表示する方法をご紹介します。

WordPressテーマが投稿抜粋をサポートしているか確認する方法

ほとんどの人気の WordPress テーマには、完全な投稿ではなく投稿の抜粋を表示できる設定があります。

テーマが投稿抜粋をサポートしているかどうかを確認するには、WordPress ダッシュボードの 外観 » カスタマイズ ページにアクセスしてください。

これらの設定の場所はWordPressテーマによって異なりますが、「ブログ」というラベルの設定を探す必要があります。

例えば、Sydney WordPress テーマを使用している場合、「Blog」を選択してから「Blog Archives」をクリックする必要があります。

次に、「投稿要素」セクションまでスクロールし、「コンテンツ」タブを展開します。その後、「コンテンツタイプ」の下のドロップダウンメニューから「抜粋」オプションを選択します。

テーマに「テーマ設定」または「投稿一般設定」オプションがある場合は、これらのセクションで投稿抜粋を有効にできる場合もあります。

これが完了したら、「公開」ボタンをクリックするだけです。これで、ブログ、アーカイブ、またはホームページにアクセスすると、完全な投稿ではなく、ブログ抜粋のリストが表示されるはずです。

テーマに投稿の抜粋の組み込みサポートがない場合は、追加する必要があります。使用したい方法にジャンプするには、以下のクイックリンクを使用してください。

• 方法 1: コードを使用して WordPress に投稿の抜粋を追加する (簡単)
• 方法2：投稿抜粋をフルサイトエディター（ブロックテーマのみ）で追加する
• 方法 3: テーマビルダーを使用して WordPress に投稿抜粋を追加する (上級)
• ボーナス：パスワード保護されたコンテンツの抜粋を表示する

方法 1: コードを使用して WordPress に投稿の抜粋を追加する (簡単)

WordPress テーマがデフォルトで投稿抜粋をサポートしていない場合は、手動でこの機能を追加できます。

WordPress のテーマファイルを直接編集することもできますが、代わりに子テーマを作成することをお勧めします。そうすれば、WordPress テーマを更新しても、行った変更が失われることはありません。

詳細については、WordPress子テーマの作成方法に関する初心者向けガイドをご覧ください。

これを行った後、投稿の抜粋を表示したい各ページを制御するテンプレートを見つける必要があります。ほとんどのテーマでは、これは home.php、content.php、category.php、および archive.php になります。

適切なファイルを見つけるのに役立つ情報については、WordPressテンプレート階層の初心者向けガイドをご覧ください。

それが完了したら、各ファイルで次のコードを見つけます。

<?php the_content(); ?>

次に、このコードを the_excerpt タグに置き換えます。

<?php the_excerpt(); ?>

これが完了したら、ファイルを保存し、ウェブサイトを確認してください。全記事が表示されていた場所に、投稿抜粋が表示されるはずです。

デフォルトのWordPress抜粋の長さを変更する

デフォルトでは、WordPress は各投稿の最初の 55 語を表示し、その後に省略記号 (...) を追加して、さらにコンテンツがあることを示します。

コードをWordPress ウェブサイトに追加することで、これをより多くの単語または少ない単語を表示するように変更できます。テーマファイルを直接編集することは可能ですが、複雑になる場合があります。

単純なミスでも、多くの一般的なWordPressのエラーを引き起こし、サイトを完全に破損させる可能性さえあります。

そのため、WPCodeの使用をお勧めします。これにより、テーマファイルを編集することなく、WordPressにコードスニペットを簡単に追加できます。これにより、カスタムコードを失うことなく、テーマを更新または変更できます。

まず、無料のWPCodeプラグインをインストールして有効化する必要があります。詳細については、WordPressプラグインのインストール方法に関する初心者向けガイドをご覧ください。

有効化したら、WordPressダッシュボードから コードスニペット » + スニペットを追加 ページにアクセスしてください。次に、「カスタムコードを追加（新規スニペット）」オプションの下にある「+ カスタムスニペットを追加」ボタンをクリックします。

次に、画面に表示されるオプションからコードタイプを選択する必要があります。

このチュートリアルでは、「PHPスニペット」を選択します。

次の画面で、コードスニペットのタイトルを入力します。これは参照用なので、好きなものを何でも使用できます。

これが完了したら、次のコードをコードエディターに貼り付けるだけです。

return 100;
}
add_filter('excerpt_length', 'new_excerpt_length');

// Changing excerpt more
function new_excerpt_more($more) {
return '...';
}
add_filter('excerpt_more', 'new_excerpt_more');

このコードは、投稿抜粋の長さを100文字に変更します。「100」を任意の数字に変更できます。

コードを貼り付けた後、右上にあるスイッチを「非アクティブ」から「アクティブ」に切り替え、次に「スニペットを保存」ボタンをクリックします。

投稿抜粋を微調整する方法の詳細については、コーディングなしでWordPressの抜粋をカスタマイズする方法に関するガイドを参照してください。

方法2：投稿抜粋をフルサイトエディター（ブロックテーマのみ）で追加する

新しいブロックWordPressテーマのいずれかを使用している場合は、フルサイトエディターを使用して投稿抜粋を追加できます。

開始するには、WordPressダッシュボードの [外観] » [エディター] に移動してください。

デフォルトでは、フルサイトエディターにはテーマのホームページテンプレートが表示されますが、任意のテンプレートに抜粋を追加できます。

左側のメニューで、「テンプレート」をクリックするだけです。

これで、WordPress テーマを構成するすべてのテンプレートのリストが表示されます。テーマによっては、アーカイブ、インデックス、検索などのテンプレートに抜粋を追加したい場合があります。

編集したいテンプレートを見つけてクリックするだけです。

WordPressは、このテンプレートのプレビューを表示します。

テンプレートを編集するには、小さな鉛筆アイコンをクリックします。

次に、「+」アイコンをクリックします。

表示される検索パネルに「投稿抜粋」と入力します。

右側のブロックが表示されたら、それをレイアウトにドラッグ＆ドロップします。

このプロセスを繰り返すことで、テンプレートに複数の投稿抜粋を追加できます。

抜粋の外観を微調整するには、投稿抜粋ブロックをクリックして選択するだけです。

右側のメニューで、「続きを読む」リンクが抜粋と同じ行に表示されるかどうかを「リンクを新しい行に表示」トグルで選択することから始めることができます。

これが完了したら、「スタイル」タブを選択します。ここでは、テキストの色を変更したり、背景色を追加したり、フォントサイズを変更したりできます。

変更を加えると、ライブプレビューが自動的に更新されるため、さまざまな設定を試して最適なものを見つけることができます。

投稿抜粋の設定が完了したら、「保存」ボタンをクリックして変更を公開します。

より多くのページや投稿に抜粋を表示したいですか？その場合は、上記の手順を繰り返しますが、今回は左側のメニューから新しいテンプレートを選択してください。

方法 3: テーマビルダーを使用して WordPress に投稿抜粋を追加する (上級)

アーカイブ、ブログページ、ホームページ、およびサイトのその他の部分の外観を完全に制御したい場合は、カスタムテーマを作成できます。

これにより、独自のページをデザインし、ウェブサイトのどこにでも抜粋を表示できます。

SeedProdは、コーディングなしでカスタムWordPressテーマを簡単に作成できる最高のWordPressテーマビルダーです。また、ドラッグアンドドロップで任意のページに追加できる既製の投稿ブロックも備えています。

まず、SeedProd プラグインをインストールして有効化する必要があります。詳細については、WordPress プラグインのインストール方法のステップバイステップガイドをご覧ください。

有効化したら、 SeedProd » Settings ページに移動し、プラグインのライセンスキーを入力します。この情報は SeedProd ウェブサイトのアカウントで見つけることができます。

ライセンスキーを入力したら、SeedProdテーマビルダーを使用してカスタムWordPressテーマを作成する準備が整いました。

まず、SeedProd » Theme Builder ページに移動する必要があります。

ここでは、すぐに使える SeedProd のサイトキットとテンプレートのいずれかを開始点として使用するか、またはゼロから手動でテンプレートを作成できます。

既存のテーマから始めることをお勧めします。これにより、必要なすべてのテンプレートファイルが自動的に作成され、作業をスムーズに進めることができます。

それを踏まえた上で、「テーマテンプレートキット」ボタンをクリックしてください。

利用可能なテンプレートの中から任意のものを選択できます。

これらのテーマはすべて完全にカスタマイズ可能なので、WordPressブログやウェブサイトに完全に適合するように微調整できます。

テーマを選択すると、SeedProdは必要なすべてのテーマテンプレートを自動的に作成します。

これは、カスタムWordPressテーマの下書きバージョンと考えることができます。

これで、SeedProd のドラッグ＆ドロップエディターを使用して各テンプレートをカスタマイズできます。

ウェブサイトに投稿抜粋を追加したいので、「ブログインデックス、アーカイブ、検索」テンプレートの上にマウスカーソルを合わせ、「デザインを編集」リンクが表示されたらクリックします。

これにより、SeedProd のドラッグ＆ドロップビルダーが読み込まれます。

右側には、テンプレートのプレビューが表示されます。デフォルトでは、ブログページのテンプレートには、見出し、アーカイブ、タイトル、およびすべての投稿が表示されます。

左側には、使用できるさまざまなブロックのメニューが表示されます。

新しいブロックは、ページにドラッグして追加し、マウスで上下にドラッグして並べ替えることができます。

ブロックをクリックし、左側のメニューにある設定を使用することで、任意のブロックをカスタマイズできます。変更を加えると、SeedProdのプレビューが自動的に更新され、変更が適用された様子が表示されます。

投稿の抜粋をカスタマイズしたい場合は、ライブプレビューで「投稿」ブロックをクリックして選択するだけです。

それを行った後、左側のメニューの設定を使用して、このブロックに表示したいコンテンツを選択します。

例えば、カラムレイアウトを変更したり、ページネーションを表示したり、アイキャッチ画像を表示したり、タイトルタグを変更したりできます。

投稿抜粋を表示するには、「抜粋を表示」トグルをクリックしてオレンジ色にします。

これが完了したら、「抜粋の長さ」に新しい数値を入力することで、SeedProd が抜粋に表示する文字数を変更できます。

SeedProd は、各抜粋に「続きを読む」リンクを追加することもでき、読者が記事全体を開くことを奨励します。

「続きを読むを表示」トグルを使用して、このリンクを追加または削除できます。

「続きを読む」のテキストを独自のメッセージに置き換えることもできます。「続きを読むテキスト」フィールドに入力してください。

投稿抜粋の設定が完了したら、画面右上にある「保存」ボタンをクリックします。

SeedProd » Theme Builder に移動し、上記と同じ手順に従うことで、他の SeedProd テンプレートをカスタマイズできます。

訪問者に投稿の抜粋を表示するには、まずSeedProdテーマを有効にする必要があります。これを行うには、SeedProd » Theme Builderに移動し、「SeedProdテーマを有効にする」トグルをクリックして「はい」と表示されるようにします。

これで、ブログページのいずれかにアクセスすると、投稿抜粋がライブで表示されます。

ボーナス：パスワード保護されたコンテンツの抜粋を表示する

会員制サイトをお持ちの場合、一般の視聴者には利用できないコンテンツがある場合があります。ただし、パスワードで保護されたコンテンツの抜粋を表示することは、依然として良い考えです。

これはユーザーの興味を引き、ウェブサイトの限定コンテンツにアクセスするために購読を購入するように促すことができます。

Restrict Content Pro を使用すると、簡単にこれを行うことができます。これは人気の コンテンツ保護プラグイン です。有効化したら、WordPress のブロックエディターでお好みの投稿を開くだけで、ブロックパネルから抜粋を追加できます。

その後、ドロップダウンメニューから制限を設定できます。

最後に、投稿を公開し、WordPressサイトにアクセスしてください。

ここでは、ユーザーは制限されたコンテンツの投稿抜粋とタイトルを他の投稿と同様に表示できます。ただし、コンテンツ自体は視聴者から非表示になります。

詳細な手順については、WordPressでパスワードで保護された投稿の抜粋を表示する方法に関するチュートリアルも参照してください。

この記事がWordPressテーマで投稿の抜粋を表示する方法を学ぶのに役立ったことを願っています。また、WordPressでインタラクティブな画像を作成する方法に関するガイドや、WordPressのフルサイト編集に最適なブロックテーマの専門家のおすすめもご覧ください。

この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。