医療・美容業界に最適なLP型のWordPressテーマ「OPTIMIZE」を使用してTOPページを制作する手順と設定項目をまとめています。
設定手順
コンテンツの表示と順序を設定
このメニューでは、TOPページのコンテンツの表示/非表示と順番の並び替えを設定することができます。別記事で解説していますので、そちらをご確認ください。
キャッチコピーと見出しのフォント設定
フォント設定をクリックし、TOPページに表示されるキャッチコピーと見出しについて、フォントの書体とフォントサイズを設定できます。別記事で解説していますので、そちらをご確認ください。
ファーストビュー
この設定項目ではファーストビューに表示するキャッチコピーや画像を設定できます。
表示イメージ
設定画面
- ファーストビューに表示するキャッチコピー
-
文字数制限はありませんが、25文字程度を推奨します。ユーザーにパッと伝わる言葉を設定します。
スマホ表示でテキストの改行を調整したい場合は、「キャッチコピー(スマホ)」に入力するとスマホ表示のみを編集することができます。
- キャチコピーの補足文(最大50文字程度を推奨)
-
キャッチコピーに補足がある場合、キャッチコピー下にテキストを表示することができます。
空欄にすると非表示になります。
- キャッチコピーの横方向の位置
-
左寄せ・中央寄せ・右寄せから選択します。
- キャッチコピーの縦方向の位置
-
上寄せ・中央寄せ・下寄せから選択します。
- キャッチコピーの色
-
キャッチコピーのテキストカラーを変更できます。
- キャッチコピーのシャドウ
-
視認性を上げるためにシャドウを入れることができます。シャドウなし・黒シャドウ・白シャドウから選択できます。
表示イメージ
- 背景画像
-
ビジネスのイメージが湧きやすい写真やイラストを推奨します。
サイトの表示を早くするために、パソコン表示用とスマホ表示用をそれぞれ用意します。
パソコン用背景画像の作り方
STEP画像編集ツールに画像をアップロードする画像、写真をサイズ変更できる無料アプリ|Adobe Express 画像、写真をサイズ変更できる無料アプリCreative Cloud Expressを使えば、簡単に画像サイズをリサイズ(拡大、縮小)することができます。画像をアップロードし、自由にサイ…STEPサイズを「幅:1920px 高さ:830px」に変更し、ダウンロードするSTEP画像圧縮ツールにダウンロードした画像をアップロードして、圧縮する
圧縮した画像をダウンロードするTinyPNG – Compress WebP, PNG and JPEG images intelligently Free online image compressor for faster websites! Reduce the file size of your WEBP, JPEG, and PNG images with TinyPNG’s smart lossy compression engine.STEPダウンロードした画像を背景画像(PC)に画像を設定する詳しい手順は別マニュアルで解説しています!
スマホ用背景画像の作り方
STEP画像編集ツールに画像をアップロードする画像、写真をサイズ変更できる無料アプリ|Adobe Express 画像、写真をサイズ変更できる無料アプリCreative Cloud Expressを使えば、簡単に画像サイズをリサイズ(拡大、縮小)することができます。画像をアップロードし、自由にサイ…STEPサイズを「幅:800px 高さ:1040px」に変更し、ダウンロードするSTEP画像圧縮ツールにダウンロードした画像をアップロードして、圧縮する
圧縮した画像をダウンロードするTinyPNG – Compress WebP, PNG and JPEG images intelligently Free online image compressor for faster websites! Reduce the file size of your WEBP, JPEG, and PNG images with TinyPNG’s smart lossy compression engine.STEPダウンロードした画像を背景画像(SP)に画像を設定する詳しい手順は別マニュアルで解説しています!
- オーバーレイの色・透明度
-
キャッチコピーが読みやすい色と濃さに調整します。
お悩み
この設定項目では、ターゲットの悩みに対してあなたが解決できることをテキストで掲載することができます。
表示イメージ
設定画面
表示したくない項目があれば、空欄にすると非表示になります。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
- お悩み内容(最大20字程度を推奨)
-
ターゲットのお悩み内容を記入します。
- 解決方法の提案内容(最大120字程度を推奨)
-
お悩みを解決する提案内容を記入します。
- ボタンのテキストとリンク先URL
-
解決方法の案内ページやサービスなどへのリンクなど、ボタンから遷移するページ名とURLを設定します。サイト内のページでもURLで設定します。
サイト内のページのURL取得方法は別記事で詳しく解説しています。
- 画像
-
テキストの上に表示される画像を設定します。
サイトの読み込みをなるべく軽くするため、「画像圧縮ツールでの圧縮」を推奨します。
TinyPNG – Compress WebP, PNG and JPEG images intelligently Free online image compressor for faster websites! Reduce the file size of your WEBP, JPEG, and PNG images with TinyPNG’s smart lossy compression engine.
動画
この設定項目では、TOPページに動画コンテンツを設置することができます。
表示イメージ
設定画面
表示したくない項目があれば、空欄にすると非表示になります。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
- 動画のURL・動画ファイル
-
TOPページに表示するYouTube動画のURLもしくはMP4の動画ファイルを設定します。
- 動画に関する解説
-
動画の解説文など説明テキストを入力することがします。
- ボタンのテキスト・リンク先
-
ボタンから遷移するページ名とURLを設定します。サイト内のページでもURLで設定します。
メッセージ
この設定項目では、サイトに来てくれた人へのメッセージを設置することができます。
表示イメージ
設定画面
表示したくない項目があれば、空欄にすると非表示になります。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
- 画像
-
画像を2枚まで設定することができます。
サイトの読み込みをなるべく軽くするため、「画像圧縮ツールでの圧縮」を推奨します。
TinyPNG – Compress WebP, PNG and JPEG images intelligently Free online image compressor for faster websites! Reduce the file size of your WEBP, JPEG, and PNG images with TinyPNG’s smart lossy compression engine. - メッセージのリード文・補足説明
-
リード文:伝えたいメッセージを最大32字程度にまとめます。
補足説明:伝えたいメッセージを150字程度で記入します。
- ボタンのテキスト・リンク先
-
ボタンから遷移するページ名とURLを設定します。サイト内のページでもURLで設定します。
サイト内のページのURL取得方法は別記事で詳しく解説しています。
サービス
この項目では、サービスの投稿を使用するセクションの見出しと補足テキストの設定ができます。サービスは投稿コンテンツのため、表示するコンテンツの内容やリンク先は投稿で用意します。
表示イメージ
設定画面
表示したくない項目があれば、空欄にすると非表示になります。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
特徴
この設定項目では、自社の特徴や強みを伝えることができます。
表示イメージ
設定画面
表示したくない項目があれば、空欄にすると非表示になります。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
- 特徴5つ
-
独自の強みのリード文と補足説明を5つまで記入することができます。
リード文は25字程度・補足説明は最大120字程度を推奨します。
- 画像
-
特徴を表現する画像を設定します。
サイトの読み込みをなるべく軽くするため、「画像圧縮ツールでの圧縮」を推奨します。
TinyPNG – Compress WebP, PNG and JPEG images intelligently Free online image compressor for faster websites! Reduce the file size of your WEBP, JPEG, and PNG images with TinyPNG’s smart lossy compression engine. - ボタンのテキスト・リンク先
-
選ばれる理由へのリンクなど、ボタンから遷移するページ名とURLを設定します。サイト内のページでもURLで設定します。
サイト内のページのURL取得方法は別記事で詳しく解説しています。
お客様の声
この項目では、お客様の声の投稿を使用するセクションの見出しと補足テキストの設定ができます。実績は投稿コンテンツのため、表示するコンテンツの内容やリンク先は投稿で用意します。
表示イメージ
設定画面
表示したくない項目があれば、空欄にすると非表示になります。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
- スライド表示数
-
TOPページのスライドに表示する最大件数を指定します。
フロー
この項目では、施術の流れを設定することができます。
表示イメージ
設定画面
表示したくない項目があれば、空欄にすると非表示になります。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
- 手順の画像と作業内容(最大10個)
-
流れを端的に伝えるテキストと画像を設定できます。
- ボタンのテキスト・リンク先
-
施術の流れを詳しく解説したページへのリンクなど、ボタンから遷移するページ名とURLを設定します。サイト内のページでもURLで設定します。
サイト内のページのURL取得方法は別記事で詳しく解説しています。
おすすめ情報
この設定項目では、サイト訪問者へ特に見てほしいコンテンツを4つまで設定できます。
表示イメージ
設定画面
表示したくない項目があれば、空欄にすると非表示になります。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
- TOPページに表示するコンテンツのタイトル
-
設定したコンテンツのタイトルを記入します。タイトルが長い場合は改行されます。
- コンテンツのURL
-
コンテンツのページURLを記入します。同サイト内のページでもURLで設定します。 外部サイトのコンテンツを設置する場合は、別タブで開くをクリックしておくとサイトから離脱することを防ぐことができます。
サイト内のページのURL取得方法は別記事で詳しく解説しています。
- コンテンツのサムネイル
-
おすすめコンテンツに関係する画像を設定します。設定がない場合、Noimageと表示されます。
ブログ
この項目では、ブログのコンテンツを使用するセクションの見出しと補足テキストの設定ができます。ブログは投稿コンテンツのため、表示するコンテンツの内容やリンク先は投稿で用意します。
表示イメージ
設定画面
表示したくない項目があれば、空欄にすると非表示になります。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
ニュース
この項目では、ニュースのコンテンツを使用するセクションの見出しと補足テキストの設定ができます。ニュースは投稿コンテンツのため、表示するコンテンツの内容やリンク先は投稿で用意します。
表示イメージ
設定画面
表示したくない項目があれば、空欄にすると非表示になります。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
よくある質問
この項目では、よくある質問のコンテンツを使用するセクションの見出しと補足テキストの設定ができます。よくある質問は投稿コンテンツのため、表示するコンテンツの内容やカテゴリー、リンク先は投稿で用意します。
表示イメージ
設定画面
表示したくない項目があれば、空欄にすると非表示になります。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
- 画像
-
セクション左側に表示する画像を設定します。
フリースペース
HTMLを使用してコンテンツを作成する場合にフリースペースをご活用いただけます。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
- コンテンツ
-
HTMLを記述してコンテンツを追加できます。
ブロックエディタの内容
ホームページ設定で作った、「TOPページ」の固定ページに入力した内容を表示させることができます。
- TOPページに表示する見出し(英語・日本語)
-
TOPページに表示するセクションの英語見出しと日本語見出しを記入します。
スマホ表示で英語見出しの改行を調整したい場合は、「このセクションの英語見出し(SP)」に入力するとスマホ表示のみを編集することができます。
- 概要説明(最大115字程度を推奨)
-
見出しの下に表示する概要テキストを記入します。
公開ボタンのクリックを忘れずに!
公開ボタンをクリックすることで、編集内容を反映することができます。公開ボタンをクリックしないと編集内容が破棄されますので、忘れずにクリックしてください!