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サイトの内容に興味をもってくれたユーザーに対して、資料請求やお問い合わせ、メールマガジンの登録を促しやすいので、是非、設置するようにしましょう。