本日より僕もCTAの作成に着手し、無事にCTAの作成を終えましたので、作り方をご紹介したいと思います。
出来栄えは一切無視してください。自分のセンスの無さが判明しました。笑
目次
CTAとは
CTAという専門用語をご存じでしょうか？
Call To Actionといって「行動喚起」という類のものです。
CTAのサンプル
どのように利用するのかというと、ブログの下部に設置しておき
「記事を読み終わったユーザーに対して次のアクションを促す」
という目的があります。
次のアクションとは、
- 新たなページをアクセスしてもらう
- 商品を購入してもらう
- SNSをフォローしてもらう
といった行動ですね。新たなページとしてランディングページに誘導しても良いですし、そのまま商品購入してもらうもアリです。
サイトの目的やページの内容により設置するCTAは異なります。
CTAがあるのとないのとではコンバージョンに大きな差が出てきます。
WordPressテーマ『Diver』でCTAを作成する方法の流れ
ブログをやっている以上、おそらくほとんどのブロガーの目的は収益化だと思います。
そのため、成約率向上に繋がるCTAの重要性は理解できたかと思います。
そんなCTAをDiverで簡単に作成することができたので、ご紹介したいと思います。
私が作成したCTAは以下のようなものです。Diverのデモサイトにあるような形のものです。
手順は非常に簡単な７ステップです。
- CTA作成ページへアクセス
- アイキャッチ画像を設置する
- タイトルを入力する
- 文字を入力する
- ボタンを作成する
- 全体カラー設定
- （デフォルトのCTAを決める）
これらはDiverの場合は全て１つのページで作成可能です。
５の”デフォルトのCTAを決める”ですが、
CTAはいくつも作成することが可能です。紹介したい商品・記事毎に作成することができます。
そして複数作成したCTAは、各記事ごとにどのCTAを表示させるかを選ぶことが可能です。
なので、例えばスマホを紹介している記事ではスマホに関するCTAを表示させ、ゲームを紹介している記事ではゲームに関するCTAを表示させるといった使い分けができるようになります。
その為、見込み客を逃がさず捕まえられる確率がぐんと上がります。
Diver以外の他のテーマだと、カテゴリ毎にしかCTAを設定できないということもあるみたいなので、記事毎に設定できるのはDiverならではの特徴かもしれません。
それでは早速、本題に入っていきたいと思います。
CTA作成ページへアクセス
さっそくですが、管理画面の左メニューから「CTA」→「新規作成」を選択しましょう。
すると、以下のような画面が開きます。ここで全てが完結しますので配置を覚えておきましょう。
（僕の画面、右サイドバーの配置をデフォルト値から変更しているかもしれません。）
画像クリックで拡大されます。
アイキャッチ画像を設置する
まずは、アイキャッチ画像を選定しましょう。（画像右下）
その後、画像位置を変更します。
上記のようにアイキャッチ画像を右側、文字を左側にしたい場合は「画像位置」を”右”に設定しましょう。（画像を左、文字を右にしたい場合は”左”）
このようにすることでいとも簡単に画像の挿入が可能です。
タイトルを入力する
タイトルを入力しましょう。
このあたりの編集方法は記事を執筆するときと同じ感覚です。
せっかくのCTAなので、クリックしたくなるようなタイトルが良いでしょう。
- 〇〇に満足していますか？
- 〇〇で十分ですか？
- 〇〇の決定版！
などなど。人により様々なキャッチコピーを作成しています。僕はセンスがありません。。。
文字を入力する
こちらもタイトルと同様、ブログ記事を書くのと同じ感覚だと思います。
目立たせたい文字に関しては、サイズを大きくしたり色を変えたりすることで人を引き付けるCTAになります。
綺麗にCTAを作成するポイントとしては、文字の量は画像の高さと同じ程度かそれ以下にしておくことをお勧めします。
文字と画像の高さが揃ってそれだけでおしゃれ感が出ます。
ボタンを作成する
ボタン押下時にアクセス先のURLを入力します。
次に、ボタンに表示するテキストを入力します。
最後に、ボタンの背景色、文字色を設定します。
全体カラー設定
CTAカラーという項目で
- CTAタイトル背景
- CTAタイトル
- CTA背景
- CTAテキスト
を選択しましょう。
下記のサンプルだと、CTAタイトル背景は「黒」、CTAタイトルは「白」。
CTA背景（内容の部分）は「白」、CTAテキストは「黒」ということになります。
例えばタイトル部分と内容部分、アイキャッチの背景色を全部色を統一することであえて目立たせるといった方法もおもしろいです。（実際僕も利用しています。）
デフォルトのCTAを決める
複数のCTAがある場合に「どのCTAをデフォルト値にするか」を決めることができます。
「Diverオプション」→「投稿設定」→「デフォルトCTA設定」で選択が可能です。
もっとも汎用性のあるCTAをデフォルト値に設定しておきましょう。
各記事編集画面から利用するCTAを選択
記事編集画面の右サイドの項目（または記事作成コンテナの下部分）にCTAというコンテナがあります。
ここから使用するCTAを選択することが可能です。デフォルト値のままで良いのであれば、意識する必要はなくなります。
まとめ
本記事ではCTAの作成手順をご紹介しました。Diverでは非常に簡単な手順でCTAを作成することができます。
- CTA作成ページへアクセス
- アイキャッチ画像を設置する
- タイトルを入力する
- 文字を入力する
- ボタンを作成する
- 全体カラー設定
- （デフォルトのCTAを決める）
簡単に作成できるので、初心者の方にも使いやすいのがDiverの特徴でもあると思います。
ぜひCTAを作成してコンバージョンを高めていきましょう。
