ガイド/サイトをカスタマイズ/テンプレート/「インデックス」テンプレートと「すべてのアーカイブ」テンプレートを編集する

「インデックス」テンプレートと「すべてのアーカイブ」テンプレートを編集する

「インデックス」テンプレート「すべてのアーカイブ」テンプレートは、ブログ投稿をサイトのページに表示します。このガイドでは、これらのテンプレートをカスタマイズする方法について説明します。

「インデックス」テンプレートと「すべてのアーカイブ」テンプレートとは

サイトでサイトエディターに対応しているテーマを使用している場合、テンプレートを使用、編集できます。サイトがサイトエディターを使用しているかどうかを簡単に確認するには、サイトのダッシュボードの「外観」「エディター」でチェックします。

「インデックス」テンプレートには、すべての最新の投稿がデフォルトで表示されます。このテンプレートは、テーマに付属しているデフォルトのブログページで使用されます。具体的なテンプレートが指定されていない場合、すべてのページのフォールバックテンプレートとして使用されることもあります。

「すべてのアーカイブ」テンプレートには、カテゴリータグ、アーカイブ (通常は月や年などの時間ベースでグループ分けされた投稿) で投稿を整理した小さなグループが表示されます。 また、デフォルトのポートフォリオページと推薦文ページの外観も制御します。

「インデックス」テンプレートと「すべてのアーカイブ」テンプレートのレイアウトは、サイトのテーマによって決まります。本ガイドの手順に従って、このレイアウトをカスタマイズできます。これらのテンプレートの変更内容は、そのテンプレートを使用するすべてのページに反映されます。

ステップ1: テンプレートエディターを開く

「インデックス」テンプレートまたは「すべてのアーカイブ」テンプレートを見つけて編集するには、次の手順を実行します。

  1. サイトのダッシュボードにアクセスします。
  2. 「外観」→「エディター」の順に移動します。
  3. 左サイドバーの「テンプレート」オプションをクリックします。
  4. メインページの領域で「 アーカイブ 」 (または「インデックス 」 ) というテンプレートを見つけます。テンプレートを参照するか、上部の検索オプションを使用してテンプレート名で検索すると、「アーカイブ」や「インデックス」のテンプレートを見つけることができます。
  5. テンプレートのサムネイルをクリックし、エディターでテンプレートを開きます。
    • 各テンプレートの右下にある3つのドットをクリックして、「編集」オプションを選択することもできます。
「アーカイブ」テンプレート

ステップ2: テンプレートのレイアウトを確認する

最初に、作業中のテンプレートの全体的なレイアウトを把握しておくと便利です。これを表示するには、以下のような画面の左上にある3本の水平線が上下に並んだアイコンをクリックして、「リストビュー」を開きます。

「すべてのアーカイブ」テンプレートでよく見られるブロックのリストが表示された「リストビュー」

ここには、テンプレートのすべての要素 (WordPress エディターではブロックと言います) が表示されます。一般的な「インデックス」テンプレートまたは「すべてのアーカイブ」テンプレートには次の要素が含まれます。

  • ヘッダー: ヘッダーには、サイトのタイトル、ロゴ、メニューなどの要素が含まれます。ヘッダーはサイト全体に表示されるテンプレートパーツです。このヘッダーに行う編集は、ヘッダーテンプレートパーツが挿入されるサイトのすべてのページに適用されます。
  • コンテンツ: メインコンテンツはクエリーループブロック (投稿を任意の設定で表示するブロック) から取得されます。クエリーループブロックを削除すると、「インデックス」ページまたは「アーカイブ」ページに投稿がなくなります。
  • フッター: フッターにはサイトのタイトル、連絡先情報、WordPress フッターのクレジットなどの要素が含まれます。フッターは各ページに表示されるテンプレートパーツです。このフッターに行う編集はフッターテンプレートパーツが挿入されるサイトのすべての場所に適用されます。

WordPress のテーマはそれぞれ異なりますが、これらは、ほとんどのテーマで見られる「インデックス」テンプレートまたは「すべてのアーカイブ」テンプレートの標準要素です。「インデックス」テンプレートまたは「すべてのアーカイブ」テンプレートに含まれる他の要素が表示され、必要に応じて編集できます。

ステップ3: デザインをカスタマイズする

テーマのテンプレートでは、始めからプロ仕様でデザイン性の高いレイアウトを使用できます。デフォルトのデザインをカスタマイズするには、テキストと画像を独自のコンテンツと入れ替えたり、ページの要素を追加または削除したりします。

ここでは、「インデックス」テンプレートまたは「すべてのアーカイブ」テンプレートでよく行われる調整をいくつか説明します。

新規要素を追加する

最新の投稿と併せてブログページに表示する要素を追加する場合は、「インデックス」テンプレートに追加できます。特定のタグやカテゴリーのページに表示する要素は、「すべてのアーカイブ」テンプレートに追加できます。

サブスクリプションボックスお問い合わせフォームサイドバーは、「インデックス」テンプレートと「すべてのアーカイブ」テンプレートに関連する可能性があるブロックの一例です。

「+」ブロック挿入ツールをクリックして、ご希望の位置に新しいブロックを追加します (リストビューを使用して位置を選択すると便利です)。これにより、新しいブロックがこのテンプレートを使用するすべてのページに表示されるようになります。

アーカイブタイトルを編集する

「すべてのアーカイブ」テンプレートには通常、読者によって現在表示されているタグまたはカテゴリーを示すタイトルがあります。これには、以下に示すように「カテゴリー: カテゴリー名」や「タグ: タグ名」のようなタイトルを含めることができます。

アーカイブタイトル「カテゴリー: レシピ」が表示されているアーカイブページの例。

このタイトルを編集または完全に削除するには、「すべてのアーカイブ」テンプレートを使用できます。

  1. 編集する「すべてのアーカイブ」テンプレートを開きます
  2. 「リストビュー」を使用し、ヘッダーの下にある「グループ」ブロックをクリックして展開します。
  3. アーカイブタイトルブロックをクリックして、タイトルを更新するか、ブロック自体を削除します。アーカイブタイトルブロックを編集するオプションには右サイドバーからアクセスできます。フォント、色、背景を編集できます。アーカイブタイプをタイトルに表示するかどうかを選択できます。
    • 前の例の「カテゴリー: レシピ」のアーカイブタイプはカテゴリーです。つまり、アーカイブタイプを表示するオプションをオフに切り替えると、アーカイブタイトル自体 (この場合はレシピ) のみを表示するように変更されます。
サイトエディターのアーカイブテンプレート内でアーカイブタイトルブロックを編集している。

投稿の要素を並べ替える

テンプレートに表示される要素の順序を変更したい場合があります (アイキャッチ画像を投稿タイトルの上または下に移動するなど)。

  1. 「インデックス」テンプレートまたは「すべてのアーカイブ」テンプレートを開いて編集します。
  2. 「リストビュー」を使用して「クエリーループ」ブロックを見つけ、クリックしてその中のブロックのリストを展開します。
  3. タイトルなど、並べ替える要素を見つけます。
  4. 必要に応じてクリック、ドラッグ、ドロップで位置を調整します。詳細については、ブロックの移動に関するガイドを参照してください。
  5. 右上の「保存」をクリックします。

投稿の要素を一部削除する

要素が削除する「インデックス」テンプレートと「すべてのアーカイブ」テンプレートに表示されている場合は、以下の手順に従います。

  1. 「インデックス」テンプレートまたは「すべてのアーカイブ」テンプレートを開いて編集します。
  2. 「リストビュー」を使用して「クエリーループ」ブロックを見つけ、クリックしてその中のブロックのリストを展開します。
  3. 投稿カテゴリーなど、削除するブロックを選択します。
  4. ブロックの右側に表示される3つのドットをクリックします。
  5. 「削除」をクリックしてブロックを削除します。詳細については、ブロックの削除に関するガイドを参照してください。
  6. 右上の「保存」をクリックします。
リストビューが開かれ、カーソルが「カテゴリー」投稿テンプレートセクションに移動する。

投稿をカラムで表示する

クエリーループブロックには、投稿をグリッドまたはカラムで表示するオプションが用意されています。その方法は以下のとおりです。

  1. 「インデックス」テンプレートまたは「すべてのアーカイブ」テンプレートを開いて編集します。
  2. 「リストビュー」を使用して、「クエリーループ」ブロックをクリックします。
  3. クエリーループブロックとともに表示されるツールバーのグリッド表示アイコンをクリックします。利用可能なすべての設定について、詳しくは 「クエリーループブロック」の詳細なガイドを参照してください。
  4. 右上の「保存」をクリックします。

クエリーループブロックでは、個々の投稿のアイキャッチ画像を表示できます。クエリーループブロック投稿のアイキャッチ画像ブロックが表示されない場合は、投稿のアイキャッチ画像ブロックを追加します。

投稿のアイキャッチ画像ブロックには、サイズ、位置、スペース、オーバーレイの色など、調整できるさまざまな設定が含まれています。詳細については、「投稿のアイキャッチ画像」ブロックのガイドをご覧ください。

アイキャッチ画像を削除するには、ブロックを選択し、その上のツールバーにある3つの点のアイコンをクリックして、「削除」を選択します。詳細については、「ブロックを削除する」をご覧ください。

「続きを読む」テキストを編集する

「続きを読む」テキストは抜粋ブロックの下部にあり、公開された各コンテンツの概要が表示されます。「続きを読む」のテキストをカスタマイズするには、次の手順に従います。

  1. 「インデックス」テンプレートまたは「すべてのアーカイブ」テンプレートを開いて編集します。
  2. 「「続きを読む」リンクのテキストを追加」をクリックします。
  3. 任意のテキストを入力します。
  4. 右上の「保存」をクリックします。
「続きを読む」テキストをクリックし、テキストを「Continue Reading...」に変更する。

コンテンツの幅を変更する

「インデックス」テンプレートや「すべてのアーカイブ」テンプレートのコンテンツの幅を広くしたり狭くしたりしたい場合は、特定のテンプレート内で調整することができます。

テンプレートのコンテンツを表示する際には通常、グループという名前のブロックで幅を制御します。幅を変更するには以下の手順を実行します。

  1. 「リストビュー」を使用して、コンテンツが含まれる「グループ」ブロックを選択します。
  2. 右サイドバーで歯車の設定アイコンをクリックし、グループブロックの設定を表示します。右サイドバーが表示されない場合は、右上隅の「保存」ボタンの横にあるサイドバー設定アイコンをクリックします。幅の異なる2つの列から成る正方形のアイコンです。
サイトエディターでグループブロックを選択して、コンテンツの幅設定を調整します。
  1. 「レイアウト」セクションで「コンテント幅を使用するインナーブロック」の設定がオフになっている場合は、オンに切り替え、グループブロックの幅をカスタマイズするオプションを表示します。
  2. グループブロックの幅の値をカスタム入力します。
  3. 「配置」で、グループブロックのコンテンツを左寄せ、右寄せ、中央寄せのいずれにするかを選択できます。

Copied to clipboard!