最近、読者の一人から、WordPressで美しいロングフォームコンテンツを作成できるかという質問がありました。ストーリーテリングの要素を持つロングフォームコンテンツは、プレーンなテキストや画像よりもエンゲージメントが高いことが証明されています。この記事では、StoryBuilderを使ってWordPressで美しいロングフォームコンテンツを作成する方法をご紹介します。
WordPressで長文記事にStoryBuilderを使用する理由
ユーザーは、ウェブサイトに留まるか離れるかを判断する前に、わずか数秒しかウェブサイトを見ていません。長文記事を公開している場合、ユーザーをサイトに留めることはさらに困難になります。
マルチメディアやインタラクティブなビジュアル補助を追加することで、長文コンテンツはユーザーにとって非常に魅力的になります。単にテキストや画像をスクロールするだけでなく、ユーザーはページ上の要素と対話できます。
ここに、豊かなストーリーテリング要素を持つ長文コンテンツの優れた例をいくつか紹介します。
- ニューヨーク・タイムズ – 新シルクロードに乗る
- ワシントン・ポスト – ワシントン – 隔絶された世界
- ガーディアン – ファイアストーム
- Pitchfork – Machines for Life
これらの長文記事はすべて、優れたストーリーテリングに共通する特徴を持っています。没入感のあるメディア、パララックス効果、インタラクティブなUI要素を使用して、魅力的なコンテンツを作成しています。
従来のWordPressテーマでは、通常、このようなページや投稿を作成することはできません。試みたとしても、多くのプラグインを使用する必要があり、それでもオーディエンスにとってうまく機能しない可能性があります。
とはいえ、どのテーマを使用しても、コーディングなしでStoryBuilderを使用してWordPressで美しい長文コンテンツを作成する方法を見てみましょう。
StoryBuilderで最初の長文ストーリーを作成する
まず最初に行うべきことは、Press75 Long Form Storybuilderプラグインをインストールして有効化することです。詳細については、WordPressプラグインのインストール方法に関するステップバイステップガイドを参照してください。
有効化したら、新しい投稿またはページを作成する必要があります。投稿編集画面に新しい「長文コンテンツを有効化」メタボックスが表示されます。
「長文コンテンツとして表示する」オプションの横にあるチェックボックスをオンにしてから、「下書き保存」ボタンをクリックする必要があります。
WordPressはページをリロードし、ページまたは投稿で長文コンテンツが有効になったという通知が表示されます。投稿エディターの代わりに、「長文コンテンツページを編集」というラベルのボタンが表示されます。
ボタンをクリックして、ロングフォームコンテンツエディタを起動します。
新しいブラウザウィンドウが開き、現在のページがWordPressテーマカスタマイザーで表示されます。
右側のペインにStoryBuilderの使用方法に関する基本的な説明が表示されます。この説明は、ページ編集を開始すると消えます。
左側のペインには、WordPressテーマの編集に使用されるものを含むカスタマイザーコントロールが含まれています。カスタマイザーコントロールには、強調表示されている2つのオプションがあります。
まず「ページオプション」タブをクリックします。これにより、編集中の長文コンテンツページで使用されるプライマリカラーとセカンダリカラーを選択できます。
使用したいフォントを選択することもできます。
その後、左ペインの「ページオプション」の見出しの横にある戻る矢印をクリックします。
これで、「長文ページセクション」タブをクリックして、長文コンテンツの作成を開始できます。
「次へ」タブで、「セクションの追加」ボタンをクリックします。追加できるセクションのリストが表示された別のタブが開きます。
セクションをクリックすると、ページに追加されます。そのセクションを編集するための設定が表示されます。
各セクションには異なる設定があります。たとえば、ヘッダーセクションでは、セクションタイトル、画像、メインの見出しとサブタイトルとして表示するテキストが求められます。
設定を入力したら、下部にある閉じるボタンをクリックするだけです。これで、ページに別のセクションを追加できます。
すべてのセクションは左側のペインに表示されます。ドラッグアンドドロップで並べ替えることができます。
セクションを削除したい場合は、それをクリックしてから、セクション設定の下部にある「削除」リンクをクリックしてください。
現在利用可能なStoryBuilderのセクションリストを以下に示します。
- ナビゲーションメニュー – ストーリーにナビゲーションメニューを追加できます。既存のナビゲーションメニューを使用するか、カスタムメニューを作成できます。
- コールアウト – 色付きの背景を持つフル幅のコールアウトセクションです。背景には、ページオプションで選択したプライマリカラーが使用されます。
- コンテンツ – 単一カラムのコンテンツエリア
- 2カラムのコンテンツエリア
- 3カラムのコンテンツエリア
- フル機能 – パララックス効果のある全幅画像、見出し、サブタイトル、コンテンツを追加できます。
- セクション見出し – セクション見出し行を追加します
コンテンツエリアのセクションは、WordPressの投稿エディターと同じです。動画、画像、引用ブロック、ツイート、またはFacebookの投稿を埋め込むことができます。
ページ全体と同様に、マルチカラムのコンテンツエリアも完全にレスポンシブです。画面の小さいユーザーには、コンテンツは1カラムで表示されます。
ページにいくつかのセクションを追加したら、一番上にある「保存して公開」ボタンをクリックします。ボタンには「公開」と表示されますが、ページは下書きとして保存されます。
クローズボタンをクリックして、カスタム設定を終了する必要があります。
これによりWordPressの投稿編集画面に戻り、ページまたは投稿を公開するか、下書きとして保存するかを選択できます。
以上で、StoryBuilderを使用してWordPressで美しい長文コンテンツを作成する方法を学んでいただけたことを願っています。StoryBuilderのドラッグ＆ドロップ機能がお気に召した場合は、WordPressのベストドラッグ＆ドロップページビルダーの比較もご覧ください。
この記事が気に入った場合は、WordPressのビデオチュートリアルをご覧ください。YouTubeチャンネルに登録してください。また、TwitterやFacebookでもフォローできます。
Robert Vodicka
1. ページの先頭にツールバーまたはリンクを追加して、ホームページに戻るにはどうすればよいですか？
2. フル機能の画像がスクロールできず、次のテキストブロックに移動するにはドラッグバーを使用する必要があります。修正方法はありますか？
WPBeginnerサポート
ロバートさん、こんにちは。
ツールバーがナビゲーションメニューを指す場合、外観 » メニューページにアクセスして、サイトのトップナビゲーションバーにリンクを追加できます。WordPressでナビゲーションメニューを追加する方法については、WordPressでナビゲーションメニューを追加する方法のガイドを参照してください。ステップバイステップの説明があります。
おすすめ画像に関しては、問題がよく理解できていません。以下をお試しください。ウェブサイトを一時的にTwentySeventeenのようなデフォルトテーマに切り替えます。ウェブサイトにアクセスして、これで画像の問題が解決したかどうかを確認します。解決した場合、テーマに問題がある可能性が高いです。
お役に立てれば幸いです
管理者
Robert Vodicka
ご返信ありがとうございます。最初の質問については、ご提案いただいた修正を試してみます。2番目の画像がスクロールしない件についてですが、該当のページを確認していただけますでしょうか？以下のURLにあります：. コンテンツセクションはマウスホイールでスクロールできるのに、フル機能セクション（画像で構成されている）はスクロールできないことに気づかれるはずです。よろしくお願いします。
WPBeginnerサポート
ロバートさん、こんにちは。
これらの画像はバグやエラーではありません。スクロールしても背景に固定されるこれらの画像は、「パララックス背景効果」と呼ばれます。多くのウェブサイトで一般的に使用されています。ただし、気に入らない場合は、削除して投稿エディター内に画像を挿入することもできます。
Janet Fuller
あなたの記事をすべて読みました。WordPressの良いプラグインに関する素晴らしい投稿です。StoryBuilderを使用し、良い結果を得ました。ユーザー管理に役立ちました。ユーザーは簡単に登録・ログインできます。私はいつも友人にStoryBuilderを使うように勧めています。
Lars Eriksson
「Press75 Long Form Storybuilder」プラグインは、1年以上更新されていません。
アクティブなインストール数は100件強です。
他に代替手段はありませんか？
アビシェク・プラカーシュ
このプラグインを削除すると、コンテンツはどうなりますか？
Safar Fiertze
このプラグインをすぐに使い始めたいのですが、インストール直後に問題が発生しました。下書き保存を押すと、予想通りカスタマイザーにリダイレクトされましたが、ロードされませんでした。ウィンドウには「カスタマイズ：読み込み中」と表示され、そのままの状態です。
現在、ブログはローカルでホストされており、Press75のテーマは使用していません。どちらかが原因かどうかはわかりません。アドバイスをいただけると幸いです。ありがとうございます！
WPBeginnerサポート
これは、お使いのテーマまたはサイトのプラグインとの競合である可能性があります。デフォルトのテーマに切り替えて、すべてのプラグインを無効にすることでトラブルシューティングできます。これで問題が解決するかどうかを確認してください。
管理者
Safar Fiertze
返信ありがとうございます。色々試してみたのですが、プラグインかテーマの問題かもしれないと思いました。すべてのプラグインを無効にし、ブログを受け取った当初にあった3つのTwentyテーマのデフォルトを試しました。それがデフォルトテーマという意味だと思いますが、問題は解決できませんでした。
pohchue
プラグインをインストールしました。「長文コンテンツとして表示」にチェックを入れて下書き保存しても、新しいブラウザページに遷移しないのはなぜですか？
Khürt L. Williams
その記事は有益でした。しかし、StoryBuilderを使用しているウェブサイトへのリンクがいくつかあれば、もっと良かったでしょう。
Gopinath
Wpbeginer様
WordPress.comのブログを使用しています。Firestormの長文コンテンツが気に入っています。
このような長文コンテンツのテーマまたはソリューションを、私のwordpress.comブログで実現したいです。どうすればできますか。教えてください。
WPBeginnerサポート
WordPress.comでこれを達成するのはかなり難しいでしょう。WordPress.comの制限事項に関するガイドを参照してください。
管理者
Gopinath
はい、これらの制限については承知しております。そのため、同じ結果を得るための他の解決策を求めています。wp.comで方法がない場合は、ありがとうございました。もし方法がある場合は、教えていただけますでしょうか。
Khürt L. Williams
彼は、WordPress.comとWordPressの違いについてのリンクを提供してあなたの質問に答えました。基本的に、WordPress.comではプラグインのインストールが許可されていないため、これを行うことはできません。
Cristi Pitner
素晴らしい内容です – 試す価値があります！ありがとうございます！