WordPress テーマで投稿の抜粋を表示する方法を学びたいですか?
記事全体ではなく投稿の抜粋をブログに表示することで、訪問者が興味深いコンテンツをすぐに見つけやすくなり、サイトの読み込み時間を短縮できます。
この記事では、WordPress テーマに投稿の抜粋を追加する方法を説明します。
デフォルトでは、WordPress は Web サイト全体のホームページ、ブログ ページ、アーカイブ ページに投稿全体を表示します。ただし、さまざまな投稿をすばやく参照して、最初に読みたい投稿を見つけたいユーザーにとって、これは最適なエクスペリエンスではありません。
また、スクロールが多くなる可能性もあり、スマートフォンやタブレットのユーザーにとっては大きな問題となります。
より多くの投稿を公開すると、WordPress はページネーションを使用してブログを複数のページに分割する場合もあります。古い投稿が他のページにプッシュされると、多くの場合、閲覧数やエンゲージメントが大幅に減ります。
このため、多くのブログ所有者は、代わりにアーカイブ ページやブログ インデックス ページに投稿の抜粋を表示しています。各記事の一部のみが読み込まれるため、WordPress の速度とパフォーマンスが向上します。
WordPress には投稿の抜粋のサポートが組み込まれていますが、すべてのテーマがこの機能を利用できるわけではありません。
そうは言っても、WordPress テーマで投稿の抜粋を表示する方法を説明しましょう。
ほとんどの人気のある WordPress テーマには、投稿全体ではなく投稿の抜粋を表示できる設定があります。
テーマが投稿の抜粋をサポートしているかどうかを確認するには、WordPress ダッシュボードの外観 » カスタマイズに移動します。
これらの設定の場所は WordPress テーマによって異なりますが、「ブログ」というラベルの付いた設定を探す必要があります。
たとえば、Astra WordPress テーマを使用している場合は、「ブログ」を選択し、「ブログ/アーカイブ」をクリックする必要があります。
次に、[投稿コンテンツ] セクションまで下にスクロールし、[抜粋] をクリックします。
テーマに「テーマ設定」または「投稿の一般設定」オプションがある場合は、これらのセクションで抜粋の投稿を有効にすることもできます。
それが完了したら、「公開」ボタンをクリックするだけです。これで、ブログ、アーカイブ、またはホームページにアクセスすると、投稿全体ではなく、ブログの抜粋のリストが表示されるはずです。
テーマに投稿の抜粋のサポートが組み込まれていない場合は、それを追加する必要があります。以下のクイック リンクを使用して、使用したい方法に移動するだけです。
WordPress テーマがデフォルトで投稿の抜粋をサポートしていない場合は、いつでもこの機能を手動で追加できます。
WordPress テーマファイルを直接編集することもできますが、代わりに子テーマを作成することをお勧めします。そうすれば、WordPress テーマを更新しても、行った変更が失われることはありません。
詳細については、WordPress 子テーマの作成方法に関する初心者ガイドを参照してください。
子テーマを作成した後、投稿の抜粋を表示する各ページを制御するテンプレートを見つける必要があります。ほとんどのテーマでは、これは home.php
、content.php
、category.php
、および archive.php
。
適切なファイルを見つける方法については、WordPress テンプレート階層の初心者向けガイドを参照してください。
その後、各ファイルで次のコードを見つけるだけです。
<?php the_content(); ?>
次に、このコードを the_excerpt
タグに置き換えます。
<?php the_excerpt(); ?>
それが完了したら、ファイルを保存して、Web サイトを確認します。以前は記事全体があった場所に、投稿の抜粋が表示されるようになりました。
デフォルトの WordPress 抜粋の長さを変更する
デフォルトでは、WordPress は各投稿の最初の 55 単語を表示し、さらにコンテンツがあることを示す省略記号 (…) を追加します。
WordPress Web サイトにコードを追加することで、表示する単語を増減するようにこれを変更できます。テーマ ファイルを直接編集することも可能ですが、複雑になる可能性があります。
単純な間違いによって多くの一般的な WordPress エラーが発生し、サイトが完全に破壊される可能性もあります。
このため、WPCode の使用をお勧めします。テーマファイルを編集することなく、WordPress にコードスニペットを簡単に追加できます。こうすることで、カスタム コードを失うことなくテーマを更新または変更できます。
まず、無料の WPCode プラグインをインストールしてアクティブ化する必要があります。詳細については、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 の抜粋をカスタマイズする方法に関するガイドを参照してください。
新しいブロック WordPress テーマのいずれかを使用している場合は、完全なサイト エディタを使用して投稿の抜粋を追加できます。
まず、WordPress ダッシュボードの外観 » エディタに移動します。
デフォルトでは、完全なサイト エディターにはテーマのホーム テンプレートが表示されますが、任意のテンプレートに抜粋を追加できます。
左側のメニューで「テンプレート」をクリックするだけです。
WordPress テーマを構成するすべてのテンプレートのリストが表示されます。テーマによっては、アーカイブ、インデックス、検索、または同様のテンプレートに抜粋を追加することができます。
編集したいテンプレートを見つけてクリックするだけです。
WordPress はこのテンプレートのプレビューを表示します。
テンプレートの編集に進むには、小さな鉛筆アイコンをクリックします。
次に、「+」アイコンをクリックします。
表示される検索パネルに「Post Excerpt」と入力します。
適切なブロックが表示されたら、それをレイアウトにドラッグ アンド ドロップします。
このプロセスを繰り返して、複数の投稿の抜粋をテンプレートに追加できます。
抜粋の外観を微調整するには、[抜粋の投稿] ブロックをクリックして選択します。
右側のメニューで、「新しい行にリンクを表示」トグルを使用して、「続きを読む」リンクを抜粋と同じ行に表示するかどうかを選択することから始めます。
それが完了したら、「スタイル」タブを選択します。ここでは、テキストの色の変更、背景色の追加、フォント サイズの変更などを行うことができます。
変更を加えるとライブ プレビューが自動的に更新されるため、さまざまな設定を試して最適な設定を確認できます。
投稿の抜粋の設定に満足したら、[保存] ボタンをクリックして変更を有効にします。
より多くのページや投稿で投稿の抜粋を表示しますか?次に、上記の手順を繰り返すだけですが、今回は左側のメニューから新しいテンプレートを選択します。
アーカイブ、ブログ ページ、ホームページ、およびサイトの残りの部分の外観を完全に制御したい場合は、カスタム テーマを作成できます。
これにより、独自のページをデザインし、Web サイト上の任意の場所に抜粋を表示することができます。
SeedProd は、コードを書かずにカスタム WordPress テーマを簡単に作成できる最高の WordPress テーマ ビルダー プラグインです。また、任意のページにドラッグ アンド ドロップできる既製の Posts ブロックもあります。
注: 予算に関係なく、美しい近日公開ページやメンテナンス モード ページを作成できる無料の SeedProd プラグインがあります。ただし、テーマ ビルダーのロックを解除するには、SeedProd Pro または Elite プランが必要です。
まず、SeedProd プラグインをインストールして有効にする必要があります。詳細については、WordPress プラグインのインストール方法に関するステップバイステップガイドをご覧ください。
有効化したら、SeedProd » 設定 ページに移動し、プラグインのライセンス キーを入力します。この情報は、SeedProd Web サイトのアカウントで確認できます。
ライセンス キーを入力すると、SeedProd テーマ ビルダーを使用してカスタム WordPress テーマを作成する準備が整います。
まず、SeedProd » テーマ ビルダー ページに移動する必要があります。
ここでは、既製の SeedProd サイト キットおよびテンプレートの 1 つを開始点として使用することも、テンプレートを最初から手動で作成することもできます。
必要なテンプレート ファイルがすべて自動的に作成され、スムーズにスタートできるため、既存のテーマから始めることをお勧めします。
そうは言っても、「テーマテンプレートキット」ボタンをクリックしてください。
利用可能なテンプレートのいずれかを選択できるようになりました。
これらのテーマはすべて完全にカスタマイズ可能なため、WordPress ブログや Web サイトに合わせて微調整できます。
テーマを選択すると、SeedProd は必要なすべてのテーマ テンプレートを自動的に作成します。
これはカスタム WordPress テーマのドラフト版と考えることができます。
SeedProd のドラッグ アンド ドロップ エディタを使用して各テンプレートをカスタマイズできるようになりました。
投稿の抜粋を Web サイトに追加したいので、[ブログ インデックス、アーカイブ、検索] テンプレートの上にマウスを置き、表示された [デザインの編集] リンクをクリックします。
これにより、SeedProd ドラッグ アンド ドロップ ビルダーがロードされます。
右側に、テンプレートのプレビューが表示されます。デフォルトでは、ブログ ページ テンプレートには見出し、アーカイブ、タイトル、およびすべての投稿が表示されます。
左側には、使用できるさまざまなブロックがすべて含まれたメニューが表示されます。
新しいブロックをページ上にドラッグして追加し、マウスで上下にドラッグして再配置できます。
ブロックをクリックして左側のメニューの設定を使用すると、ブロックをカスタマイズできます。変更を加えると、SeedProd プレビューが自動的に更新され、実際の変更が表示されます。
投稿の抜粋をカスタマイズしたいので、ライブ プレビューで [投稿] ブロックをクリックして選択します。
その後、左側のメニューの設定を使用して、このブロックに表示するコンテンツを選択します。
たとえば、列のレイアウトを変更したり、ページネーションを表示したり、アイキャッチ画像を表示したり、タイトルタグを変更したりできます。
投稿の抜粋を表示するには、「抜粋を表示」トグルをクリックするだけでオレンジ色になります。
それが完了したら、「抜粋の長さ」に新しい数値を入力することで、SeedProd が抜粋に表示する文字数を変更できます。
SeedProd は、各抜粋に「続きを読む」リンクを追加することもでき、読者が記事全文を開くよう促します。
「続きを表示」トグルを使用して、このリンクを追加または削除できます。
「続きを読むテキスト」フィールドに入力して、「続きを読む」テキストを独自のメッセージに置き換えることもできます。
投稿の抜粋の設定に問題がなければ、画面の右上隅にある [保存] ボタンをクリックします。
SeedProd » テーマ ビルダー に移動し、上記と同じプロセスに従って、他の SeedProd テンプレートをカスタマイズできるようになりました。
投稿の抜粋を訪問者に表示するには、まず SeedProd テーマを有効にする必要があります。これを行うには、SeedProd » テーマ ビルダーに移動し、[SeedProd テーマを有効にする] トグルをクリックして [はい] と表示します。
これで、ブログ ページにアクセスすると、投稿の抜粋がライブで表示されます。
この記事が、WordPress テーマで投稿の抜粋を表示する方法を学ぶのに役立つことを願っています。 WordPress を使ってオンライン ブログでお金を稼ぐ方法に関するガイドや、使用すべき最高の WordPress SEO プラグインとツールに関する専門家の選択も参照してください。
この記事が気に入っていただけましたら、WordPress ビデオ チュートリアルの YouTube チャンネルに登録してください。 Twitter や Facebook でもご覧いただけます。