【第11章】②サンクスページ作成
ページ設定
・次に『サンクスページ』を作成します。『サンクスページ』とは、お問い合わせフォームでお問い合わせ内容を送信した後に表示されるページのことです。お問い合わせページとサンクスページはセットで作成すると覚えておいてください。
・固定ページ一覧から『サンクスページ』の固定ページを選択します。『サンクスページ』の設定ページの上部にある『Elementorで編集』をクリックして固定ページの編集画面に入ります。
・編集画面に入ったら、左パネルの一番下の『⚙️(歯車マーク)』の設定ボタンをクリックして『固定ページレイアウト』を『Elementor Full Width』にしましょう。設定できたら『更新』ボタンをクリックしておきましょう。
・タブバーの右側のタブをクリックするとコンタクトフォーム一覧の画面が開いていると思います。左サイドバーの『固定ページ』を選択し、固定ページ一覧から『お問い合わせ』のElementor編集画面を開きます。
・お問い合わせページに入ったら、TOPのセクションをコピーします。
・左タブをクリックして『サンクスページ』に貼り付けます。貼り付けられたらセクションのピンクタブをクリックして『スタイル』から『背景オーバーレイ』の設定をします。一番上の『普通』ボタンを選択したあと、『色』項目からカラーピッカーを開きます。カラーピッカーの色コードの入力フォームに『242424D4』と入れてください。
・見出しの削除をします。『お問い合わせ』の見出しにカーソルを合わせると右上に『ペンマーク』が出てくるので『ペンマーク』の上で右クリックしてコンテキストメニューを開き、『削除』を選択しましょう。
・見出しが入っていた場所に『テキストエディターウィジェット』を入れます。新しいセクションからウィジェット一覧を開き、『テキストエディター』をドラッグ＆ドロップでスペーサーとスペーサーの間に入れます。テキストエディターウィジェットのスタイル設定は以下の通りです。
※見出し設定内容はこちら↓
【スタイル】
配置：中央
『タイポグラフィ』
フォント：Noto Serif JP
サイズ：30
太さ：600 (Semi Bold)
Line Height：2
段落間隔：6
文字色：FFFFFF
・設定できたら、『コンテンツ』を開いてテキストエディターに『お問い合わせありがとうございます。』と入れます。
・『お問い合わせありがとうございます。』と入れたテキストエディターを複製します。複製したテキストエディターをクリックして『コンテンツ』を開き、テキストエディターに以下の文章を入れます。
このたびはご連絡いただき、誠にありがとうございます。
お問い合わせ内容を確認の上、担当者より改めてご連絡させていただきます。
・文章が入ったら『スタイル』を開き、タイポグラフィから『サイズ：20』に設定します。
・ページの一番下にスペーサー(スペース：100)を入れたらデスクトップ版のデザインは完成です。パネルの『更新』をクリックして編集内容を保存しておきましょう。
レスポンシブ設定：タブレット
・ページ一番下のスペーサーを『スペース：80』にします。最後、パネルの『更新』をクリックして編集内容を保存しておきましょう。
レスポンシブ設定：スマートフォン
・『お問い合わせ～・・・』のテキストエディターをクリックしてタイポグラフィから『サイス：20』に設定します。次はその下にある『このたびは～・・・』のテキストエディターをクリックしてタイポグラフィから『サイズ：16』にします。
・ページ一番下のスペーサーを『スペース：50』にします。
・パネルの『更新』をクリックして編集内容を保存しておきましょう。
・画面上の黒いバーからデスクトップ版の編集画面に戻ります。プレビューで最終確認をしましょう。確認が終わったら今開いているタブを消して、TOPページの編集画面に戻ります。『更新』ボタンがピンクではなく黒になっていることを確認し、パネルの左上にある『ハンバーガーメニュー』をクリックしてその中から『終了』をクリックします。Elementorの編集画面が終了し、固定ページの編集画面が出てきます。一番左上の『サイトアイコン』をクリックすると、『固定ページ一覧』の画面に戻ることができます。
・複製したタブはタブバーから消して、このサイトのタブは1つだけにしておきましょう。