WordPressで投稿やページにサブタイトルを追加する方法(ステップバイステップ)

字幕とは、メインの見出しのすぐ下に表示される小さなテキストのことです。長年ブログを書いてきて、ユーザーがコンテンツをより深く掘り下げることを奨励するのに役立つ要素だとわかっています。

よく練られたサブタイトルは、カジュアルな閲覧者をエンゲージした読者に変える追加のコンテキストや興味を提供できます。残念ながら、WordPressにはデフォルトのサブタイトルブロックがありません(あるべきだと考えていますが)。

幸いなことに、WordPressの投稿やページに簡単な方法で字幕を追加する方法を見つけました。このガイドでその方法をご紹介します。

WordPressで投稿や固定ページのサブタイトルを追加する方法(ステップバイステップ)

WordPressの投稿やページに字幕を追加する理由

サブタイトル、またはセカンダリタイトルを使用すると、ブログ投稿に関する追加情報を表示でき、訪問者の読書意欲を高めることができます。

Medium、Buzzfeed、Mashable、Brain Pickingsなど、多くの人気ブログがこのようにサブタイトルを使用しています。

投稿サブタイトルの例

サブタイトルは、タイトルを説明し、読者にWordPressのブログ記事を読むことで何が得られるかを伝える機会を与えてくれます。

また、訪問者がサイトに長く滞在してより多くのコンテンツを読むことを奨励し、それによってページビューを増やし、直帰率を減らすことができます。これは検索エンジンに肯定的なシグナルを送るため、WordPress SEO を改善することさえあります。

それでは、WordPressの投稿やページに簡単にサブタイトルを追加する方法をご紹介します。

WordPressの投稿とページにサブタイトルを追加する方法

WordPressウェブサイトに字幕を追加する最も簡単な方法は、Secondary Titlesを使用することです。

このプラグインを使用すると、投稿やページに簡単にサブタイトルを追加し、そのサブタイトルの表示方法をカスタマイズできます。

最終投稿サブタイトルの例

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

有効化したら、設定 » セカンダリタイトルに移動して、プラグインの設定を構成できます。

WordPressのサブタイトル設定

サブタイトルは、標準タイトルとマージすることで、各ページまたは投稿のサブタイトルを自動的に表示できます。別のオプションとして、特定のページと投稿にのみサブタイトルを表示することもできます。

最も簡単なオプションなので、すべてのページと投稿に字幕を自動的に表示することから始めましょう。「自動表示」セクションで、「オン」を選択するだけです。

その後、サブタイトルの見た目を変更できます。デフォルトでは、Secondary Titleはメインの見出しとサブタイトルをコロンで区切って表示します。例:

セカンダリタイトル:投稿タイトル 

これを変更するには、「タイトルフォーマット」ボックスのHTMLを編集するだけです。

例えば、サブタイトルを小さくすることができます。この場合、タイトルには H1 見出しタグを使用し、サブタイトルには H2 や H3 のような低い見出しタグを使用できます。

色を変更したり、コロンを削除したり、使用したい他の記号に置き換えたりすることもできます。

変更を加えるたびに「プレビュー」が自動的に更新されるため、さまざまな設定を試して、WordPressブログに最適な表示を確認できます。

セカンダリタイトルプラグインでのタイトルフォーマットの設定

その後、「表示ルール」セクションで字幕の表示場所を制御できます。

まず、「メイン投稿でのみ表示」セクションで「オン」を選択します。これは、サブタイトルがメインのブログロールにある場合にのみ表示されることを意味します。

メインの投稿でのみ表示

「投稿タイプ」セクションで、サブタイトルを表示したい投稿タイプを選択できます。

投稿とページのどちらにも字幕を表示するには、両方のチェックボックスをオンにしてください。

サブタイトルを表示する投稿タイプを選択

次に、サブタイトルを表示したい投稿カテゴリを選択できます。

「カテゴリ」セクションで、さまざまな投稿カテゴリにチェックを入れるか外すだけです。

投稿カテゴリ表示のチェックボックス

特定の投稿にのみサブタイトルを表示しますか?

次に、投稿IDを「投稿ID」ボックスに簡単に入力します。この情報の見つけ方については、ステップバイステップの説明をご覧ください。WordPressでIDを見つける方法に関するガイドを参照してください。WordPressでIDを見つける方法

投稿またはページのユニークなIDを入力する

最後の「その他の設定」ボックスでは、「オン」ラジオボタンを選択することで、訪問者がサブタイトルを使用して投稿を検索できるようにすることができます。

サイトによっては、WordPressの検索を改善するのに良い方法かもしれません。

WordPressのサブタイトルを検索可能にする

最後に、「カラム位置」設定を使用して、サブタイトルをプライマリタイトルの左または右のどちらに表示するかを変更できます。

サブタイトルの設定が完了したら、「変更を保存」ボタンをクリックしてください。

その他の設定ボックスと変更の保存

これで、投稿または固定ページを開いて、最初のサブタイトルを作成する準備ができました。

ここで、「二次タイトル」ボックスにサブタイトルを入力します。次に、「更新」または「公開」をクリックして変更をライブにします。

サブタイトルを追加して投稿を保存

これで、訪問者は投稿を表示する際にサブタイトルを確認できるようになります。

WordPressの投稿やページにサブタイトルを手動で表示する

投稿やページに手動で字幕を追加することもできます。これにより、個々の投稿やページで字幕が表示される場所をより細かく制御できます。

これを行うには、単に設定 » セカンダリタイトルに移動します。次に、「自動表示」セクションで「オフ」オプションを選択します。

字幕の自動表示をオフにする

これを行う1つの方法は、ショートコードを使用してセカンダリタイトルを表示することです。これにより、特定のページや投稿にのみセカンダリタイトルを表示できます。

これはプラグインが提供するショートコードです。

[secondary_title]

ショートコードの詳細については、WordPressでショートコードを追加する方法に関するガイドをご覧ください。WordPressでショートコードを追加する方法

WordPressテーマで二次タイトルの表示を有効にするには、テーマのテンプレートファイルにコードを追加して手動で表示することもできます。

これを行いたい場合は、WPCodeの使用をお勧めします。このコードスニペットプラグインを使用すると、ウェブサイトファイルを直接編集することなく、安全かつ簡単にコードを追加できます。

まず、WordPressにプラグインをインストールする必要があります。次に、コードスニペット » + スニペットを追加に移動します。

このページで、「カスタムコードを追加(新規スニペット)」を選択し、「スニペットを使用」ボタンをクリックします。

WPCodeに新しいカスタムスニペットを追加する

その後、プラグインは次のテンプレートタグコードスニペットを追加することを推奨します。

echo get_secondary_title();

コードをテストしたところ、セカンダリタイトルが投稿コンテンツと揃っていませんでした。そのため、コードにdivタグを追加することをお勧めします。

このようになります:

echo '<div>';
echo get_secondary_title();
echo '</div>';

コードを以前に追加したことがない場合は、初心者向けのガイド「WordPressにウェブからスニペットを貼り付けるための初心者ガイド」を参照してください。

それが完了したら、コードスニペットに名前を付けることができます。「セカンダリタイトルスニペット」のような名前が良いでしょう。

また、コードが正しく機能するように、コードタイプを「PHPスニペット」に変更してください。

WPCodeにセカンダリタイトルのエコーコードを挿入する

その後、下にスクロールして、挿入方法を「自動挿入」のままにしておきます。

場所については、「ページ固有」タブに切り替えて、目的の場所をクリックしてください。「コンテンツの前に挿入」を選択したのは、セカンダリタイトルがタイトルと投稿の最初の段落の間に表示されるようにするためです。

セカンダリタイトルの最適な表示場所を決定するために、WordPressテンプレート階層のチートシートも参照できます。

WPCodeで「コンテンツの前に挿入」を選択する

WPCodeの素晴らしい点は、条件付きロジック機能があることです。これにより、セカンダリタイトルのプラグインよりも詳細なサブタイトルの表示ルールを作成できます。

これを行うには、「スマート条件付きロジック」機能までスクロールダウンしてください。次に、「ロジックを有効にする」ボタンを切り替えます。

その後、字幕を表示または非表示にするルールを作成できます。これらのルールは、ページを閲覧している訪問者の種類、ページ自体の種類、特定のURLスラッグなど、さまざまな条件に基づいています。

WPCodeの条件付きロジック機能

完了したら、コードをアクティブにして、上部にある「スニペットを保存」をクリックするだけです。これで完了です!

WordPressの投稿やページを管理するためのヒントやコツについては、以下のガイドをご覧ください。

この記事が、WordPressの投稿や固定ページにサブタイトルを追加する方法を学ぶのに役立ったことを願っています。また、WordPressの最適な関連記事プラグインと、WordPressでユーザーをランダムな投稿にリダイレクトする方法に関するガイドもご覧ください。

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

開示:当社のコンテンツは読者によってサポートされています。これは、当社のリンクの一部をクリックすると、当社が手数料を得る可能性があることを意味します。WPBeginnerがどのように資金提供されているか、それがなぜ重要か、そしてどのように私たちをサポートできるかについては、こちらをご覧ください。当社の編集プロセスはこちらです。

究極のWordPressツールキット

無料のツールキットにアクセスしましょう - すべてのプロフェッショナルが持つべきWordPress関連の製品とリソースのコレクションです!

読者とのインタラクション

21 CommentsLeave a Reply

  1. コードスニペットでこれを試しましたが、アクティブ化しようとすると次のようになります。

    「未定義の関数 get_secondary_title() 」

    修正方法がわかりません…助けてください

    • その機能にはプラグインのインストールと有効化の両方が必要ですので、ご確認ください。それが最も可能性の高い原因です。

      管理者

  2. ユーザーエンゲージメントを高める方法を探していましたが、サブタイトルがその答えのようです。
    正直なところ、この機能は特定のテーマでのみ利用可能だと思っていました。プラグインでこれができるとは知りませんでした。
    WPBeginnerさん、本当にありがとうございます!

  3. wpbeginner様、投稿のスラッグ/投稿名をサブタイトルとして使用したいです。いくつかのショートコードを試しましたが、うまくいきませんでした。手伝っていただけますか?よろしくお願いします。

    • At the moment the plugin does not have an option to use the post slug specifically, if you reach out to the plugin’s support they can help with setting that up in a way that you can use :)

      管理者

  4. Elementor とのプラグインはうまく機能しません。投稿グリッドを使用すると、2番目のタイトルが表示され、デザイン全体が台無しになります。まだそこから削除できていません。プラグインは非常に優れているので残念です。

    • 共有ありがとうございます。他のプラグインと連携するプラグインについては、作者に連絡して、将来的に連携できる可能性があるかどうかを確認することをお勧めします。

      管理者

  5. シングルブログページのトップ以外ではどこでも二次タイトルを表示したい場合はどうすればいいですか?
    ありがとうございます

    • もしあなたが望んでいることを正しく理解しているのであれば、ヘッダーブロックを使用して記事自体にサブタイトルを追加することができます。

      管理者

  6. 皆さん、こんにちは。

    セカンダリタイトルのスタイルのみを変更するにはどうすればよいですか?

    返信をお願いします…

    • タイトル形式の入力にインラインCSSを挿入できます。
      手動の方法を使用している場合は、カスタムスタイルやクラスを追加できます。

  7. 手動でやる方法はありますか?カスタムメタボックスを使えますが、このプラグインのように、エディタの下部にある他のメタボックスではなく、タイトルの横に表示したいです。

  8. サブタイトルは、メインタイトルが存在するタグに挿入されているようです。

    これは、spanタグとインラインスタイルでしかスタイリングできないことを意味します。これは、最近の投稿をリストするサイドバーのようなものに問題を引き起こします。

    例えば、サブタイトルをメインタイトルより小さく、下に表示したかったのですが、font-size: 20px の設定ではサイドバーにも同じサイズで表示されてしまいました。

    他にこれを経験した人はいますか、または回避策を知っていますか?

  9. 「Wpbegginer」に参加するにはお金がかかりますか?ホスティングへの紹介で、「wpbegginerユーザーは〇〇割引」とありますが。

  10. セカンダリタイトルは素晴らしいプラグインです!特に、プライマリタイトルの下にセカンダリタイトルが表示される件について、あなたの記事は非常に役立ちました。本当にありがとうございました。

  11. わあ、このプラグインをインストールしたばかりです…使うのが待ちきれません。素晴らしい見た目です。教えてくれて本当にありがとう…このサイト大好きです!!!!

  12. このプラグインを有効にしている場合、セカンダリタイトルは必要ないのですが、セカンダリタイトルの行を空白のままにしておくことはできますか?プラグインなしの基本的なタイトルと投稿だけの場合と見た目は異なりますか?

  13. この記事をありがとうございます。まさに必要としていたものです。サブタイトルはFacebookに表示されるか知っていますか?

返信を残す

コメントを残していただきありがとうございます。すべてのコメントは、当社のコメントポリシーに従ってモデレーションされますので、ご了承ください。メールアドレスは公開されません。名前フィールドにキーワードを使用しないでください。個人的で有意義な会話をしましょう。