２.ランディングページを作成する

ランディングページは、集客効果を最大化する上で不可欠なツールです。
ターゲットの心に響くメッセージを的確に届けることで、コンバージョン率を劇的に向上させられます。
ここでは、以下の手順でランディングページの設定方法をご説明します。

手順１：ランディングページ作成
手順２：コード・meta情報などの設定

※未入力の項目は、初期設定として自動入力されるか、現在のマーケティング戦略に合わせて非表示にできます。

ランディングページ作成
コード・meta情報などの設定
- ランディングページ設定（申込完了ページも同様の仕様です）
- ランディングページを複数作成

ランディングページ作成

① カラーパターンを選択し、[保存して次へ]をクリックする

ランディングページに使用する配色を選択します。
※選んだカラーは後からでも変更できます。

② テンプレートを選択し、[保存して次へ]をクリックする

弊社の支援実績をもとに、成果につながりやすい構成を整理し、テンプレートとしてご用意しています。
※選んだテンプレートは後から自由にカスタマイズできます。

ポイント自身の構想しているセミナー内容に近いテンプレートを選択することで、構成設計の手間を抑えつつ、ランディングページを作成できます。

[新規作成]を選択した場合

テンプレートを使用せず、何も設定されていない状態からブロックを追加して、ランディングページを作成します。

③ テンプレートに合わせてテキスト・画像を置き換えていく

【テキストを置き換える場合】

テキスト部分をクリックすると、内容を編集できます。
本文だけでなく、題名やCTAボタンのテキストも変更可能です。
上部メニューから、太字・マーカー・文字色・フォントなどの装飾を設定できます。

※自動保存機能はありません。保存せずにタブを閉じたり、回線が切断された場合、作成中のデータが失われる可能性があります。こまめに［保存する］をクリックしてください。

ポイント ⅰ. 上部のアイコンから、PC・タブレット・スマートフォンそれぞれの表示を確認できます。ターゲットが主に使用する端末に合わせて、レイアウトや文字サイズを調整することで、読みやすいページ設計が可能です。
ⅱ. 左上の矢印ボタンをクリックすると、直前の操作に戻ることができます。修正を繰り返しながら作業を進める際に便利です。

【画像を置き換える場合】

⑴ 画像部分にカーソルを合わせて[編集]をクリックする

⑵ PC・モバイルそれぞれの表示画像を設定する

表示端末に適したサイズの画像を設定することで、ランディングページの読みやすさが向上します。

※PC用・モバイル用のいずれか一方に画像を設定すると、もう一方にも自動的に反映されます。

④ [＋ボタン]でブロックを追加

ブロック間に表示される［＋ボタン］をクリックすると、新しいブロックを追加できます。
不要なブロックや、ブロック内のテキスト・画像は削除することも可能です。

ポイント ⅰ.多様なブロックを用意しているため、目的やデザインに合わせてブロックを追加し、視覚的に整理されたランディングページを作成できます。
ⅱ.[プレビュー]をクリックし、配色ごとの見え方を確認することもできます。

⑤ セミナー概要のブロック

セミナータイトル{{seminar_title}}、開催日時{{schedules}}、参加費{{seminar_fee}}は自動入力されます。
これらの項目は、手動で変更することも可能です。

⑥ セミナー申し込みフォームのブロック

テキストの編集に加え、フォーム項目やプライバシーポリシーの内容を変更できます。
また、フォームの埋め込みコードを取得することも可能です。

フォームを編集するする手順は以下です。

⑴ フォームにカーソルを合わせて[編集]をクリックする

⑵ [＋追加]をクリックしてフォーム項目を追加

不要な項目は削除することも可能です。【※1】
用意されている選択肢以外にも、［＋項目追加］をクリックすると、新しい項目を追加できます。【※2】
また、［テンプレート保存］から、作成したフォーム項目をテンプレートとして保存でき、【※3】保存したテンプレートは、［テンプレート選択］をクリックして使用できます。【※4】

※セミナー開催日、メールアドレスは必須項目です。
※メールアドレスは、半角英数字、半角英字（大文字・小文字）、および特殊文字（. – _ +）のみ使用できます。

⑶ [プライバシーポリシー編集]をクリックして編集

テキストを直接入力する方法に加え、「URL」を選択すると、別ページで作成したプライバシーポリシーへ遷移させることも可能です。

⑷ 別サイトに申し込みフォームを埋め込みたい場合

外部ツールで作成したランディングページに、申込フォームを埋め込むことができます。
[埋め込みコード（iframe）をコピー]をクリックし、申込フォームを挿入したいランディングページのHTMLに貼り付けてください。

※埋め込んだランディングページから申し込みがあった場合、申込リストに表示されます。
※使用したランディングページは、URLが分析レポートに表示されるため、アクセス元の特定が可能です。

⑦[プレビュー]をクリックする

ランディングページをプレビュー画面で確認できます。
選択しているデバイス（PC・タブレット・スマートフォン）の表示が反映されます。

⑧[保存して次へ]をクリックする

コード・meta情報などの設定

ランディングページと申込完了ページそれぞれのコードやmeta情報など、作成以外に必要な設定は、画面左上の[設定]から行えます。詳細は以下に記載しています。
※ここでの設定は任意項目です。

ランディングページ設定（申込完了ページも同様の仕様です）

① ページ設定

ランディングページの管理名とURLを設定することができます。

⑴ ページ管理名を編集

ここで設定した管理名は、ランディングページ一覧など管理画面上にのみ表示され、ユーザーには表示されません。
識別しやすい管理名を設定してください。

⑵ URLを設定する

※WebinarBaseのサブドメインを使用します。末尾の文字列は任意で設定可能です。
※未入力の場合、自動でURLが生成されます。

② カラーパターン

ランディングページ作成時に設定した配色を変更できます。

③ フォント

ランディングページで使用するフォントを選択できます。
ここで選択したフォントはデフォルト設定として適用されますが、各テキストごとに変更することも可能です。

④ CSS設定

CSSを直接記述して、フォントや色などのデザインを細かく調整できます。

⑤ Metaタグ設定

⑴ ランディングページのタイトル（title）と説明文（description）

ポイント titleとdescriptionに適切なキーワードを含めることで、検索エンジンがページの内容を正しく理解し、検索結果での表示順位向上に繋がります。
これにより、検索エンジンからの自然流入を増加させることができ、またユーザーは検索結果に表示されるtitleとdescriptionを見てページの内容を判断するため、的確な情報を設定することで、クリック率を高めることができます。

⑵ タグの埋め込み

【タグの埋め込みについて】

ページのheadタグまたは、bodyタグにお好きなタグを追加することができます。

※埋め込むタグによっては、ウェビナーベースの機能と干渉しうまく表示されない場合があります。
※入力するタグや埋め込みコードの詳細について、サポートはできかねますので、あらかじめご了承ください。

headタグ

headタグとは、ブラウザや検索エンジンのクローラーに対してWebサイトの情報を伝えるものです。
使用できるタグは <meta>、<script>、<style>、<link>、<noscript>、<!– –>(コメント)のみ、埋め込むことができるタグとして、Googleタグマネージャー、Facebookピクセルなどがあります。

ⅰ.<head>タグの直後にタグを入れたい場合
ⅱ.</head>タグの直前にタグを入れたい場合