最新のSeedProdニュース

ビジネス成長を支援するWordPressチュートリアル、ヒント、リソース

WordPressでカスタム投稿テンプレートを作成する方法

カスタムWordPress投稿テンプレートをシングル投稿用に作成する方法 

執筆者: 著者アバター ステイシー・コリン
著者アバター ステイシー・コリン
Stacey Corrinは、WordPress、SEO、デジタルマーケティングに関する執筆経験15年以上の認定コンテンツマーケティングおよび検索スペシャリストです。彼女はSeedProdとRafflePressのコンテンツを管理しており、自身が積極的に使用しテストしているツールや戦略を取り上げています。
    
レビュー担当者: レビュアーアバター ターナー ジョン
レビュアーアバター ターナー・ジョン
ジョン・ターナーはSeedProdの共同創設者です。彼は20年以上のビジネスおよび開発経験を持ち、彼のプラグインは2500万回以上ダウンロードされています。

ブログで長文チュートリアルを特集したいときにこれに遭遇しました。使用していたテーマは、サイドバー、著者ボックス、コメントなど、すべての投稿を同じ狭いレイアウトに強制していました。必要なものにはまったく適合しませんでした。

同様の状況に対処している場合は、このガイドでカスタムWordPress投稿テンプレートを作成する方法を説明します。これにより、特定の投稿のレイアウトを変更できます。コードなしからサイトエディターまで、4つの方法を紹介します。

どの方法が適しているかわかりませんか?簡単な選択方法はこちらです:

  • コードなしでデザインを完全に制御したい場合: SeedProd(方法1)を使用してください。
  • ブロックテーマを使用しており、WordPressでの編集に満足している場合:サイトエディター(方法2)を使用してください。
  • 保存したレイアウトを投稿間で再利用したいだけの場合:同期パターン(方法3)を使用してください。
  • PHPに慣れている場合:独自のテンプレートをコーディングしてください(方法4)。

カスタムWordPress投稿テンプレートを作成する理由

WordPress投稿テンプレートとは、単一のブログ投稿の表示方法を制御する保存されたレイアウトです。タイトル、アイキャッチ画像、コンテンツ、コメントや関連記事などの追加情報が表示される場所を設定します。

特にデフォルトのレイアウトに収まらない長いチュートリアルやブログ記事を書く際に、これが必要になったことが何度かあります。ほとんどのWordPressテーマは、単一の投稿デザインしか提供しておらず、通常は短く基本的なコンテンツ向けに構築されています。

カスタム投稿テンプレートを使用すると、個々のブログ投稿の外観と雰囲気をより細かく制御できます。コンテンツ、カテゴリ、または目的に基づいてレイアウトを調整できます。これにより、次のことが可能になります。

  • 異なるコンテンツタイプに異なるレイアウトを使用する:チュートリアルにはフル幅、ニュース記事にはサイドバーレイアウトなど
  • カスタムバナー、リードマグネット、またはコールトゥアクションを追加して、注目のコンテンツやエバーグリーンコンテンツを強調する
  • 投稿に価値を追加しないサイドバーや著者ボックスなどの気を散らす要素を削除する
  • 投稿のカテゴリに合わせてレイアウトを調整する:「ガイド」、「レシピ」、「レビュー」など
  • テーマファイルを編集したりカスタムコードを作成したりせずに、レイアウトの変更をテストする

ブログを書いている場合でも、チュートリアルを作成している場合でも、ビジネスサイトを運営している場合でも、カスタム投稿テンプレートを使用すると、コンテンツが読みやすくなり、目標に合わせたものになります。

カスタムWordPress投稿テンプレートを作成する4つの方法

カスタムWordPress投稿テンプレートがどのようなものかわかったところで、作成方法を見ていきましょう。あなたに最適な方法を選べるように、4つの方法をカバーします。

方法1:SeedProdを使用してカスタム投稿テンプレートを作成する

カスタム単一投稿テンプレートを構築する最も簡単な方法は、市場で最高のWordPressテーマビルダープラグインであるSeedProdを使用することです。コードなしでテーマフォルダを編集することなく、視覚的にテンプレートをデザインして適用できます。

SeedProd ドラッグ&ドロップ WordPress ウェブサイトビルダー

注意:ここで使用するSeedProdテーマビルダーには、有料のSeedProdプラン(Plus以上)が必要です。無料バージョンは、カミングスーンページやメンテナンスモードページに最適であり、完全なテーマ構築には適していません。

プロセスは次のとおりです。SeedProdをインストールしてライセンスキーを追加し、テーマビルダーを開いてテーマを選択し、単一投稿テンプレートを編集してから、テーマを有効化します。

ステップ1:SeedProdをインストールしてライセンスキーを追加する

まず、SeedProdプラグインをインストールしてアクティブ化します。ヘルプが必要な場合は、WordPressプラグインのインストールに関するこのステップバイステップガイドを参照してください。

次に、SeedProd »設定に移動し、ライセンスキーを入力します。SeedProdウェブサイトのアカウントの下にあります。

SeedProdプラグイン設定にSeedProdライセンスキーを入力

ステップ2:テーマビルダーを開いてテーマを選択する

SeedProdは現在使用中のテーマを置き換え、ビジュアルなドラッグ&ドロップビルダーですべてのサイトの細部をカスタマイズできます。「SeedProd » テーマビルダー」に移動し、「テーマ」ボタンをクリックして開始します。

SeedProdテーマビルダーでカスタムテーマテンプレートを追加

さまざまな既製のWordPressテーマテンプレートが表示されます。1つを選択するには、サムネイルにカーソルを合わせ、チェックマークアイコンをクリックします。

SeedProdの既製WordPressテーマテンプレート

テーマを選択すると、テンプレートパーツのリストが表示されます。

  • シングルページ
  • シングル投稿
  • ブログおよびアーカイブページ
  • ホームページ
  • サイドバー
  • フッター
  • ヘッダー

これらは、完全なWordPressテーマを構成する要素です。通常、テーマファイルを編集することでのみアクセスできますが、SeedProdはすべてを1つのビジュアルインターフェイスに表示します。

SeedProdテーマテンプレートパーツがビジュアルリストで表示されている様子

ステップ3:シングル投稿テンプレートの編集

SeedProdにはデフォルトでカスタムシングル投稿テンプレートが含まれており、ビジュアルにカスタマイズできます。「シングル投稿」セクションを見つけて、「デザインを編集」リンクをクリックしてエディターで開きます。

SeedProdでカスタムシングル投稿テンプレートを編集

エディターは2列のレイアウトになっています。ブロックとセクションは左側に配置され、ライブプレビューは右側に表示されるため、変更をリアルタイムで確認できます。

SeedProdの2カラムビジュアルテーマビルダーとライブプレビュー

テンプレートのどこかをクリックしてレイアウトをカスタマイズします。たとえば、投稿タイトルをクリックすると、その設定が左側のパネルに表示されます。

SeedProdの投稿タイトルブロック設定パネル

そこから、見出しタグ、配置、レベル、フォントサイズを変更できます。「高度な設定」タブでは、フォントの色、間隔、その他のスタイルを変更できます。

SeedProdはテンプレートタグを使用して、投稿タイトル、アイキャッチ画像、コメントなどの動的なWordPressコンテンツを取得します。これにより、シングル投稿ファイルを直接編集することなく、さまざまなコンテンツを表示できます。

たとえば、投稿ブロックを投稿コンテンツの末尾にドラッグし、特定のカテゴリの投稿を表示するように設定できます。

SeedProdでカスタム投稿テンプレートに投稿ブロックを追加

レイアウトに満足したら、右上隅にある緑色の「保存」ボタンをクリックして保存します。

SeedProdでカスタム投稿テンプレートを保存

残りのテーマも同様の方法でカスタマイズできます。ヘルプが必要な場合は、SeedProdでカスタムWordPressテーマを作成する方法のガイドをご覧ください。

ステップ4:SeedProdテーマを有効化する

すべてが正しく表示されたら、右上隅にある「SeedProdテーマを有効化」トグルをクリックします。

テーマビルダーでSeedProdテーマのトグルを有効にする

新しいカスタムシングル投稿テンプレートの外観は次のとおりです。著者ボックスを削除し、関連記事とソーシャルメディア共有ボタンを追加しました。

フロントエンドで完成したカスタムシングル投稿テンプレート

1つのカテゴリに別のレイアウトを設定する

SeedProdを使用すると、好きなだけカスタム投稿テンプレートを追加できるため、各投稿カテゴリに独自のレイアウトを設定できます。私は自分のブログで、長いチュートリアルにはフル幅のデザインを使用し、ニュース投稿にはサイドバーを残しています。

カテゴリ固有のレイアウトを設定するには、シングル投稿テンプレートの下にある「複製」リンクをクリックし、コピーを再スタイル設定して条件を設定します。

テンプレートリストの上部にある複製されたシングル投稿テンプレート

コピーで、「条件を編集」リンクをクリックして、テンプレートを表示する場所を選択します。名を与え、「条件」ヘッダーの下でコンテンツタイプを選択します。

SeedProdのシングル投稿テンプレートの条件編集ウィンドウ

チュートリアル例では、「投稿」セクションの「カテゴリあり」を選択し、チュートリアルカテゴリを入力して、優先度を10に設定し、保存をクリックしました。これで、そのカテゴリのすべての投稿に新しいレイアウトが表示されます。

完成したチュートリアルテンプレートはこちらです。サイドバーを削除して全幅にし、関連投稿とコメントセクションを削除して、チュートリアル自体に焦点を当てました。

関連投稿とコメントが削除されたカスタム投稿テンプレート

これは、複数のカスタム投稿テンプレートを作成する最も簡単な方法です。コードは不要で、テーマファイルを変更せず、技術的な経験も必要ありません。

方法2:WordPressサイトエディターで単一投稿テンプレートを編集する

ブロックテーマを使用している場合は、WordPressサイトエディターで単一投稿テンプレートを直接編集できます。プラグインは不要です。これはネイティブな方法であり、サイトがすでにブロックテーマを使用しており、わずかな変更しか必要ない場合に私が使用する方法です。

注意:サイトエディターは、Twenty Twenty-Fourのようなブロックテーマにのみ表示されます。クラシックテーマの場合は、代わりにSeedProdまたはコード方法を使用してください。

ダッシュボードから外観 » エディターに移動してサイトエディターを開きます。次に、「テンプレート」を選択し、「単一投稿」をクリックして、すべての単一ブログ投稿を制御するテンプレートを開きます。

サイトエディターのWordPressブロックテーマシングル投稿テンプレート

リストビューを開いて、アイキャッチ画像、投稿タイトル、投稿コンテンツ、コメントなどのブロックを含むテンプレートの構造を表示します。

サイトエディターで開かれたブロックテーマシングル投稿テンプレート(リストビュー表示)

ここからブロックを追加または削除してレイアウトを変更できます。コメントブロックを削除して投稿の下部を整理したり、関連投稿を表示するためにクエリーループブロックをドロップしたりできます。

完了したら、保存をクリックします。

ここで行えることの完全な参照については、公式のWordPressテンプレートエディターのドキュメントですべてのオプションを確認してください。ただし、サイトエディターは単一投稿テンプレートをグローバルに変更するため、カテゴリ固有のレイアウトには引き続きSeedProdの条件が必要になります。

方法3:カスタム投稿レイアウトを同期パターンとして保存する

この方法では、WordPressブロックエディターを使用します。厳密には投稿テンプレートを作成しませんが、単一投稿レイアウトを保存して再利用する簡単な方法を提供します。

トリックはグループブロックです。これにより、複数のブロックを1つのレイアウトにバンドルできます。次に、そのグループを同期パターンとして保存し、任意の投稿にドロップします。

まず、投稿 » 新規追加に移動して新しい投稿を作成します。プラス(+)アイコンをクリックし、コンテンツエリアにグループブロックを追加します。

エディターで新しいWordPressグループブロックを追加

グループ内にブロックを追加して、単一投稿レイアウトを構築します。カラム、テキスト、メディア、画像などを使用できます。

WordPressグループブロック内にコンテンツブロックを追加

レイアウトが正しく表示されたら、グループブロックを選択してアウトラインが表示されるようにします。

WordPressエディターでグループブロックを選択

3つのドットをクリックしてブロックのオプションを展開し、「パターンを作成」を選択します。パターンに名前を付け、「同期」がオンになっていることを確認します。これにより、1つのコピーへの編集がすべてに反映されます。

WordPressでグループブロックを同期パターンとして保存

次に、新しい投稿を作成するたびに、ブロックインサーターを開き、「パターン」タブに移動して、「マイパターン」の下にある保存したパターンを見つけます。クリックして、完全なレイアウトを投稿にドロップします。

マイパターンから保存済みの同期パターンを挿入

これによりカスタムレイアウトがブログ投稿に保存されますが、テーマがシングル投稿を処理する方法は変更されません。より柔軟にするには、読み続けてください。

方法4:WordPress投稿テンプレートを手動でコーディングする

この方法は高度です。テーマファイルを編集し、コードを貼り付け、カスタムCSSを作成する必要があります。そのため、PHPに自信がある場合のみ使用してください。

まず、メモ帳のようなプレーンテキストエディターを開きます。次に、次のコードを貼り付けます。

<?php
/*
 * Template Name: Featured Article
 * Template Post Type: post, page, product
 */
?>

このコードは、「注目の記事」という新しい投稿テンプレートを定義し、投稿、ページ、製品コンテンツタイプで利用できるようにします。

コードをコピーしたら、ファイルをデスクトップに sp_single_post.php として保存します。次に、FTPクライアントを使用して現在のWordPressテーマフォルダにアップロードします。

ファイルが配置されたら、WordPress管理エリアにログインして投稿を編集します。投稿属性メタボックスまでスクロールすると、テンプレートを選択するオプションが表示されます。

投稿属性でカスタム特集記事テンプレートを選択

ここに新しい注目の記事テンプレートが表示されます。現時点では、ファイルが空のため、選択すると白い画面が表示されます。

これを修正するには、テーマのsingle.phpファイルからコードをコピーして開始点とします。single.phpを開き、get_header()行以降のすべてをコピーして、sp_single_post.phpファイルの末尾に貼り付けます。

次にファイルを保存してサーバーに再度アップロードします。この時点で、テンプレートは古いシングル投稿レイアウトと一致します。

そこから、CSSクラスを追加したり、サイドバーを削除したり、その他の変更を加えてカスタマイズします。

WordPress投稿テンプレートに関するFAQ

カスタムテンプレートをすべての投稿のデフォルトとして設定するにはどうすればよいですか?

方法によります。サイトエディターでは、シングル投稿テンプレートはすでにすべての投稿のデフォルトであるため、そこで保存した変更はサイト全体に適用されます。SeedProdを使用する場合、テンプレートの条件を投稿タイプに設定し、カテゴリフィルターを適用しないようにすると、フォールバックレイアウトになります。コード方法は投稿属性を介して投稿ごとに適用されるため、それ自体ではグローバルデフォルトとして機能できません。

サイトエディターでシングル投稿テンプレートを編集するにはブロックテーマが必要ですか?

はい。サイトエディターは、サイトでTwenty Twenty-Fourのようなブロックテーマが実行されている場合にのみ表示されます。クラシックテーマには含まれていません。クラシックテーマを使用している場合は、代わりにSeedProdまたは手動コードメソッドを使用してください。どちらもテーマの種類に関係なく機能します。

カスタムテンプレートを特定の投稿にのみ適用するにはどうすればよいですか?

シングル投稿の場合は、コード方法を使用し、その投稿の編集画面の投稿属性 » テンプレートの下でテンプレートを選択します。これにより、その投稿にのみ適用されます。1つの投稿ではなく、カテゴリ全体を対象にしたい場合は、SeedProdの条件編集オプションの方が迅速な方法です。

WordPressでコードを書かずにカスタム投稿テンプレートを作成できますか?

はい。最も簡単な方法は、SeedProdのようなビジュアルビルダーを使用することです。これにより、テーマを編集したりコードを書いたりせずに、カスタム投稿テンプレートをデザインして適用できます。ブロックテーマでは、サイトエディターもノーコードオプションです。

投稿テンプレートとページテンプレートの違いは何ですか?

WordPressでは、静的ページにはページテンプレートを、ブログコンテンツには投稿テンプレートを使用します。カスタム投稿テンプレートはブログ投稿の外観を変更し、ページテンプレートは「会社概要」や「お問い合わせ」などのページのレイアウトを変更します。

投稿テンプレートを変更すると、すべてのブログ投稿に影響しますか?

必要ない限り、そうではありません。複数のテンプレートを作成し、それぞれが表示される場所を選択できます。これにより、既存の投稿に触れることなく柔軟性が得られます。

WordPressでカスタム投稿テンプレートを作成する4つの方法をご紹介しました。最も使いやすい方法を選んで、思い通りのブログ投稿表示を実現しましょう。

また、こちらの「成功するランディングページの構成要素」に関する投稿もぜひご覧ください。

お読みいただきありがとうございます!皆様のご意見をお聞かせいただければ幸いです。お気軽に会話にご参加ください YouTubeX および Facebook で、ビジネスを成長させるための役立つアドバイスやコンテンツをさらにご覧ください。

著者アバター
ステイシー・コリン コンテンツマーケティングスペシャリスト
Stacey Corrinは、WordPress、SEO、デジタルマーケティングに関する執筆経験15年以上の認定コンテンツマーケティングおよび検索スペシャリストです。彼女はSeedProdとRafflePressのコンテンツを管理しており、自身が積極的に使用しテストしているツールや戦略を取り上げています。

開示: 当社のコンテンツは読者によってサポートされています。これは、当社のリンクの一部をクリックすると、手数料が発生する可能性があることを意味します。当社は、読者に価値をもたらすと信じる製品のみを推奨しています。

[weglot_switcher]
ChatGPTまたはClaudeとチャットして、このWordPressサイトを運営しましょう。無料プラグインです。 無料で試す