LightningテーマでCTAを作成・設置する方法
acquiesce.inc
- 1. CTAとは？
- 2. lightningテーマでCTA作成する
- 2.1.1. 左メニュー 「CTA」＞「CTAの新規作成」をクリック
- 2.1.2. CTAにタイトルをつける
- 3. 【作成方法A】 自分でCTAを作成する
- 4. 【作成方法B】 ブロックパターンを使ってCTAを作成する
- 4.1. VK Pattern Library
- 4.2. 無料パターンを利用
- 4.3. CTAに貼り付け（ペースト）
- 4.4. 見た目・内容の編集
- 5. 作成したCTAを設定する
- 5.1.1. 画面左メニュー「ExUnit」>メイン設定
- 5.1.2. Call To Actionの部分へスクロール
- 5.1.3. Call To Action設定
- 5.1.4. footer上にCTAが表示
- 6. LightningでCTAを非表示にしたい
- 6.1.1. 固定ページ編集画面の右上のアイコンをクリック
- 6.1.2. CTA設定
- 6.1.3. 「保存」
CTAとは？
CTA（Call To Action）とは、Webサイトの訪問者に特定の行動を促すための仕組みです。主に「お問い合わせ」「資料請求」「商品購入」などのボタンや案内文を指します。ページの途中やフッターの上など、目につきやすい場所に設置することで、訪問者を目的のページへ誘導し、問い合わせや購入などの成果につなげる役割があります。
lightningテーマでCTA作成する
左メニュー
「CTA」＞「CTAの新規作成」をクリック
CTAにタイトルをつける
設定する際にわかりやすいタイトルをつけます。
【作成方法A】
自分でCTAを作成する
ブロックを組み合わせてオリジナルデザインのCTAを作成できます。
【作成方法B】
ブロックパターンを使ってCTAを作成する
K Pattern Libraryで公開されているブロックパターンを利用して、色、文字だけ変えて簡単に作成する方法です。
画面左上の「VK Pattern Library」をクリックします。
無料パターンを利用
赤いボタンで「コピーする」と記載があるパーツは無料で利用可能です。
「プレミアム」と表記があるものは、Vektor Passportのライセンス登録が必要です。
よさそうなパターンを見つけたら、「コピーする」をクリックします。
ボタンに「コピー完了」と表示されます。
CTAに貼り付け（ペースト）
windows：Ctrl + V
mac : command（⌘） ＋ V
で貼り付け（ペースト）します。
見た目・内容の編集
電話番号やメールフォームのリンク先、ボタンの色等を編集し
画面右上の青いボタン「公開」をクリックして、編集内容を保存します。
作成したCTAを設定する
画面左メニュー「ExUnit」>メイン設定
Call To Actionの部分へスクロール
結構下の方に設定項目があります。
Call To Action設定
- 投稿、固定ページに先ほど作成したCTAのを選択
- 表示場所（オプション）にlightning_site_footer_before
- 「変更を保存」をクリック
footer上にCTAが表示
LightningでCTAを非表示にしたい
お問い合わせページや、送信完了ページなどCTAを表示したくないページには個別に非表示の設定が可能です。
固定ページ編集画面の右上のアイコンをクリック
CTAを非表示にしたいページの編集画面を開き、
画面右上のロボットの様なアイコンをクリックします。
CTA設定
画面右の「CTA設定」をクリックして、
「表示しない」を選択します。
「保存」
画面右上青いボタン「保存」をクリックして、設定を保存します。
これでこのページではCTAが表示されません。
