LightningテーマのCTAを設置する方法をお探しの方向け。
Lightningテーマ推奨プラグイン「ExUnit（VK All in One Expansion Unit）」、を使うとCTAを簡単に設定できます。
この記事では、Lightningテーマを使っているサイトにCTAを設置する方法を解説します。
好きなところから読めます
LightningテーマのCTA機能を使ってできること
Lightningテーマ推奨プラグイン「ExUnit」には、コンテンツの下にCTAを表示できる機能が付いており、投稿・固定ページの本文下に、画像やテキストを表示できます。
本文下にCTAを設置することで、ユーザーの目にとまりやすくなりますので、ユーザーに次の行動につなげやすくなります。
CTAとは
CTAとは「Call To Action（コールトゥアクション）」の略で、日本語に訳すと「行動喚起」という意味です。
行動喚起とは、つまり、ユーザーに取ってもらいたい行動を喚起する（呼びかける）イメージです。
CTA設置することで、資料請求やサンプル請求ページへの移動を促したり、ランディングページやメルマガ登録ページへの誘導を促しやすくなります。
LightningテーマにCTAを設置する手順
LightningテーマにCTAを設置する手順を解説します。
- 手順①：ExUnitのメイン設定を開く
- 手順②：ExUnitのCTAを選択
- 手順③：新規CTAの作成
- 手順④：作成したCTAを公開する
上記のとおりです。
手順①：ExUnitのメイン設定を開く
ExUnitのメイン設定を開きます。
ダッシュボード＞ExUnit＞メイン設定 を選択します。
手順②：ExUnitのCTAから一覧を表示を選択
「ExUnit」の設定画面が表示されますので、左側メニューの「Call To Action」をクリックしてCTAの設定画面に移動し、「CTAの一覧を表示」をクリックします。
手順③：新規CTAの作成
CTAの管理画面が表示されます。新たにCTAを作成するので「新規作成」ボタンをクリックします。
ちなみに、CTAを作る方法は以下2パターンあり、やりやすい方法でCTAを作りましょう。
- ブロックエディタで作る
- ExUnitの機能を使って作る
上記の順に解説します。
ブロックエディタで作る
一つ目の方法はブロックエディタで作る方法です。
使い方は、投稿・固定ページと使い方は殆ど同じです。
各項目の設定方法は次のとおりです。
- ①：CTAのタイトルを入力します
- ②：CTAの本文や画像を設定します。
- ③：公開を押して終了です。
サンプルとして下図のように入力してみました。
ExUnitの機能を使って作る
2つ目の方法は、ExUnitの機能を使ってCTAを作る方法です。
最初に、ページのタイトルを入力して下さい。
タイトルを入力したら、ブロックエディタ下部にある、下図入力項目にCTAの内容を入力します。
各項目の設定方法は次のとおりです。
- ①従来のレイアウトを使用する：必ずチェックを入れて下さい。
- ②CTA画像：CTAに表示する画像を追加します。
- ③CTA画像の位置：画像の位置を指定します。
- ④ボタンのテキスト：ボタンテキストを指定します。例）「ダウンロードはこちら」など
- ⑤ボタンアイコン：ボタンテキストの前後にアイコンフォントを追加できます。
- ⑥ボタンのリンク先URL：移動先のURLを指定します。
- ⑦リンク先ターゲット：移動先URLを開く際に別ウィンドウを開く場合はチェックを入れます。
- ⑧テキストメッセージ：CTAに表示するテキストメッセージを入力します。
サンプルとして下図のように入力してみました。
CTAを作成したら、ブロックエディタ（記事編集画面）右上にある「公開」ボタンをクリックします。
以上でCTAの作成は完了です。
手順④：CTAの公開
作成したCTAを公開します。
CTAの公開はExUnitのメイン設定から行います。
ダッシュボード＞ExUnit＞メイン設定 を選択します。
「ExUnit」の設定画面が表示されますので、「Call To Action」をクリックしてCTAの設定画面に移動します。
公開したいCTAを選択する
公開したいCTAを選択します。
公開したいCTAをページタイプ（投稿・固定ページ）単位で選択できます。
サンプルとして、投稿にCTAを公開します。
①公開したいCTAを選択して、②「変更を保存」をクリックします。
これで、投稿の記事下にCTAが表示されるようになります。
プレビューで表示を確認
記事を表示してみると、CTAが反映されることが確認できます。
以上でLightningテーマのExUnitでCTAを設置する方法は完了です。
LightningテーマのCTAの表示設定
最後に、LightningテーマのCTAの表示設定を2つ紹介します。
- CTAのランダム表示
- ページ毎に異なるCTAを表示
上記のとおりです。
CTAのランダム表示
複数のCTAを作成している場合、プルダウンで「ランダム表示」を選択すると、複数のCTAをランダムで表示させることが可能です。
ページ毎に異なるCTAを表示
予め、複数のCTAを作成しておく事で、ページ毎に異なるCTAを表示させる事ができます。
例えば、記事AにはCTA1を表示させて、記事BにはCTA2を表示させる、といった設定ができます。
- 記事A → CTA1
- 記事B → CTA2
ページ毎に異なるCTAを表示させる設定方法
投稿・固定ページの編集画面下部に、VK All in One Expansion Unit（ExUnit）があり、その中に「CTA設定」という項目があります。
ここでページ毎に異なるCTAを表示させる設定を行います。
- 共通設定 → 「手順④：CTAの公開」で解説した設定が優先されます。
- 表示しない → 「このページにCTAを表示させたくない」という場合はチェックを入れれば表示されません。
まとめ
以上、LightningテーマのCTAを設置する方法を解説しました。
記事の最後に表示されるCTAは、Webサイトの内容に興味をもってくれたユーザーに対して、資料請求やお問い合わせ、メールマガジンの登録を促しやすいので、是非、設置するようにしましょう。
