注目度の高い記事
Diver の CTA とは? 設定方法やおすすめの使い方を解説します

 

わかば
山本さん、Diver って記事の下に、広告設置用のスペースがあるんですよね
それって、どうやって設定すればいいんですかね?

山本
わかばちゃんが言ってるのって「 CTA 」のことかな?

わかば
そう!それです、それ!
いつもみたく使い方教えてもらっていいですか!?

山本
もちろんOKだよ!

 

ワードプレステーマ Diver の記事の下に

目立つ広告スペースを設置できる「 CTA 」の設定方法と使い方を解説します。

 

ページ下部では、山本がおすすめする CTA の使い方についても

解説しているので、あわせて参考にしてください。

 

1.Diver の CTAとは? 設定項目が2つある!?

Diver の CTAとは? 設定項目が2つある!?

CTA とは「Call To Action」(コールトゥーアクション)の略で

日本語に訳すると「行動喚起」と言った意味合いの言葉です。

 

ブログの場合だと、訪問してくれた読者に行動喚起を促すということ。

 

では、どのようにして読者に行動喚起を促すのかと言うと

コンテンツ下のエリアに、CTA 用の目立つスペースを用意して

そこに、広告や資料請求などの、簡単な説明とリンクを設置して

行動してもらうということになります。

 

わかば
へーそうなんですねー
でもそれってサイドバーじゃダメなんですか?

山本
サイドバーって、実は意外と気付かれにくかったりするんだよね

 

「コンテンツ下に表示しても気付かれにくいんじゃないの?」

と思ったかも知れませんが、読者がコンテンツを読み終わって

次の行動を考えるエリアなので、実はクリック率が高いのが CTA の特徴です。

 

とはいえ、CTA のテンプレを作ったとしても

記事を作る度に毎回記事下に設置するのは、さすがに面倒ですよね?

 

その面倒な作業を、まとめて設定することができるのが

Diver の「 CTA 」設定機能なんです。

 

さて、CTA の意味もわかったところで、いざ設定してみようと思った時に

管理画面に CTA の項目が、2つある事に気付いた方もおられるのではないでしょうか。

 

そうです、Diver には

「 CTA 」「フッターCTA 」の2つの設定項目があるんです。

CTA
Diver の CTAとは? 設定項目が2つある!?
フッターCTA
Diver の CTAとは? 設定項目が2つある!?

 

実はこれ、名前は似ているけど全く違った機能なんです。

実際にわー研。に CTA を表示させた画像で、その違いを見てみましょう。

 

通常の CTA の表示サンプル

こちらが通常の CTA の表示サンプル画像です。

記事のコンテンツ下に、でかでかと表示されていて目に付きやすいですよね。

Diver の CTAとは? 設定項目が2つある!?

 

フッターCTA の表示サンプル

次にフッターCTA の表示サンプルです。

 

画面を下にスクロールしていくと、下からにょきっと出てきます。

スマホには表示されず、PCのみの表示となります。左のバツボタンで消すことができます。

Diver の CTAとは? 設定項目が2つある!?

山本
画面にかぶさって表示されることから
「オーバーレイ」と呼ばれることもあります

 

これで CTAフッターCTA の違いはわかりましたね。

それでは、次からはそれぞれの設定方法を解説していきます。

 

2.Diver の CTA の設定方法

管理画面 > CTA から CTA の設定画面に移動します。

はじめて作成するときは画面上にある、新規追加 をクリックしましょう。

Diver の CTA の設定方法

 

こちらが、新規CTAを作成 画面です。

Diver の CTA の設定方法

 

CTA 作成画面で設定する項目は、全部で7つあります。

  • タイトル
  • 説明文
  • ボタン設定
  • アイキャッチ画像
  • 画像位置
  • CTA カラー
  • カスタム CSS

各項目の設定方法を解説していきます。

 

2-1 タイトル

CTA のタイトルをここに入力します。(CTA に表示されます)

Diver の CTA の設定方法

 

2-2 説明文

CTA の説明文をここに入力します。

投稿ページと同じ感覚で、テキストの装飾や、入力補助なども使用可能です。

Diver の CTA の設定方法

 

2-3 ボタン設定

CTA に表示するボタンの設定を、ここでおこないます。

ボタンテキスト、リンクに加えて、色設定もあわせておこないましょう。

Diver の CTA の設定方法

 

チェックボックスは、以下のように設定します。

別タブで開く 広告含めて他サイトへのリンクの場合は「オン」にしましょう
rel="nofollow" 広告リンクを設置する場合は「オン」にしましょう

 

2ー4 アイキャッチ画像

アイキャッチ画像をここで設定します。

投稿ページのアイキャッチ画像とは違って、CTA のエリアの中に表示されます。

Diver の CTA の設定方法

 

2-5 画像位置

上で設定した、アイキャッチ画像の表示位置を設定します。

※どれにもチェックを入れない場合だと、右に表示されます。

Diver の CTA の設定方法

 

確認用に、各位置の表示サンプル画像もおいておきます。

表示位置「右」
Diver の CTA の設定方法
表示位置「左」
Diver の CTA の設定方法
表示位置「中央」
Diver の CTA の設定方法

 

2-6 CTA カラー

CTA 各部分の色を、ここで設定します。

Diver の CTA の設定方法

 

2-7 カスタムCSS

追加で、CSS を入力することで、さらに自由度の高いデザイン設定ができます。

山本
わからなければ「空欄」のままで大丈夫です

Diver の CTA の設定方法

 

さて、これで設定が一通り終わりました。

実際に出来上がった CTA の画像を見てみましょう!

Diver の CTA の設定方法

わかば
おおっ!これはなかなか目立ちますねー!!

山本
今、簡単に設定しただけでも
それなりのデザインに仕上がってて、いい雰囲気だよね!

 

2-8 投稿ページごとに CTA を出し分けする方法

同じ手順で、CTA をいくつでもつくることができ

ページ下の設定から、作成した CTA を出し分けすることができます。

 

やり方は簡単。投稿編集画面の下にあるCTA の項目で

そのページに表示させたい CTA を選択するだけです。非表示にすることもできます。

Diver の CTA の設定方法

 

選択項目にある、デフォルトの CTA は

管理画面 > Diverオプション > 投稿設定 の、デフォルトCTA設定 から設定できます。

Diver の CTA の設定方法

 

山本
それでは続いて、フッターCTAの設定解説にいきます

 

3.Diver のフッターCTA の設定方法

フッターCTA は、管理画面 > Diverオプション > フッターCTA から設定できます。

 

上でも触れましたが、フッターCTA は PCのみに表示されるのでご注意ください。

Diver のフッターCTA の設定方法

 

フッターCTA の設定項目は、以下の9つです。

  • タイトル
  • テキスト
  • 画像
  • 背景カラー
  • テキストカラー
  • リンク先URL
  • リンク先オプション
  • 表示設定

それぞれ解説します。

 

3-1 タイトル

フッターCTA のタイトルをここに入力します。

Diver のフッターCTA の設定方法

 

3-2 テキスト

フッターCTA の説明文をここに入力します。

Diver のフッターCTA の設定方法

 

3-3 画像

フッターCTA の画像をここに設定します。

画像サイズは、「728×90px」の横長のものを使いましょう。

Diver のフッターCTA の設定方法

山本
今回は、サンプル用に Diver の横長バナー画像をお借りしました

 

3-4 背景カラー&透明度

フッターCTA の背景色と透明度をここで設定します。

透明度の数字は、「1」で完全に透明、「0」で不透明になります。(デフォルトは0.4)

Diver のフッターCTA の設定方法

 

3-5 テキストカラー

フッターCTA のテキストの色をここで設定します。

Diver のフッターCTA の設定方法

 

3-6 リンク先URL

フッターCTA をクリックした時の、リンク先URL をここで設定します。

Diver のフッターCTA の設定方法

 

3-7 リンク先オプション

リンク先URL のオプション設定です。

デフォルトで両方オンになっているので、基本的にはそのままでOK。

Diver のフッターCTA の設定方法

別タブで開く 広告含めて他サイトへのリンクの場合は「オン」にしましょう
rel="nofollow" 広告リンクを設置する場合は「オン」にしましょう

 

3-8 表示設定

フッターCTA を、どのページに表示させるのかを設定します。

Diver のフッターCTA の設定方法

 

すべての設定が完了したら、最後に 変更を保存 をクリックすれば表示されます。

Diver のフッターCTA の設定方法

 

ここで出来上がったフッターCTAを見てみましょう!

Diver のフッターCTA の設定方法

山本
フッターCTA は ”エリア全体がリンク” になっているので
どこをクリックしても、設定したURLに移動します

 

4.CTA のおすすめの使い方

わかば
CTA の使い方はわかりましたけど
一体なにを表示させましょうかね??

山本
そうだねー こんな使い方はどうかな?

 

ここまでで CTA の設定方法解説は終了ですが

「じゃあ CTA になにを表示させればいいの?」と思ったかも知れません。

 

そこでここからは、わー研。おすすめの CTA 設定について解説します。

 

CTA について検索してみると

設定する例として、よく見かけるのが「資料請求」というものです。

 

もし会社のサイトだったなら、資料請求でいいと思うんですが

わー研。を見ていただいている方の多くは

”個人” でブログを運営している、または、したいと思っている方がほとんどだと思います。

 

自分の商品があるわけでもないのに

資料請求と言われても、なにを配布したらいいのか困ってしまいますよね(笑)

 

そんな個人ブログにおすすめの CTA の使い方が、以下の3つです。

  • 紹介した商品ページへのアフィリエイトリンク
  • 無料特典ページへのリンク
  • メルマガ登録リンク

 

その1:紹介した商品ページへのアフィリエイトリンク

それがもし、なにか商品を紹介しているページだったなら

CTA には、その商品の簡単な紹介文と、アフィリエイトリンクを設置しましょう。

 

あなたの紹介文やレビューなどを読んだ読者が

その商品に対するモチベーションが最も高まったところで

迷わず商品リンクをクリックできるような配置だったら理想的ですよね。

 

その2:無料特典ページへのリンク

特に紹介している商品がない場合は

無料特典を用意しておくのも、CTA の効果的な使い方の一つです。

 

「無料でサービスしてどうすんの?」と思いましたか?

しかし、ネットビジネスでは、その ”無料” こそが最強なんです。

 

その理由については、また後々語っていくとして、

無料特典の具体的な内容としては

「特典PDF」や「特設ページ」などのサービスが考えられます。

 

インターネットに星の数ほどあるブログ群から

わざわざあなたのブログを訪れてくれた読者には

あなたができる最大のサービスで満足してもらうようにしましょう。

 

その3:メルマガ登録リンク

最後のおすすめ CTA は、メルマガ登録リンクです。

 

ブログが「プル型営業」(お客が来るのを待つ)なのに対して

メルマガは「プッシュ型営業」(こちらから営業をかける)タイプになります。

 

詳しく解説すると長くなってしまうので、ここでは割愛しますが

メルマガはブログとはまた違った意味での、あなたの強力な武器になります。

 

もしまだメルマガがない状態でも

CTA にリンクを設置しておくことで、リストを集めることができるのが利点です。

 

以上、山本がおすすめする3つの CTA の使い方でした。

 

どれも有用な使い方だと言えますが

これを効果的にするには、ある程度ブログに集客できていることが前提となります。

 

記事が充実してないうちから、CTA に力を入れても効力を発揮してくれないので

まずは、ブログの記事を充実させることに注力しましょう。

 

さいごに

今回は Diver の CTA と、フッターCTA の設定方法について解説しました。

 

しっかりと集客できているブログでは、大きな効果が期待できる機能なので

しっかりと使いこなせるようになっておきましょう。

 

さいごに、このページのまとめをしておきます。

  • Diver の CTA は2種類ある
  • CTA の設定方法
  • フッターCTA の設定方法
  • CTA のおすすめの使い方

 

わかば
まずはブログの集客をがんばらないとですね!

山本
そうだね!
どちらかというと CTA は、集客できるようになってから
使うことで威力を発揮する機能だと言えるね

 

注目の記事現役アフィリエイターが Diver をおすすめする7つの理由

注目の記事Diver の共通コンテンツって一体なに?この機能の意味とおすすめの使い方を解説します

 

ゼロから始める!ワードプレスブログ スタートマニュアル
ワードプレスブログスタートマニュアル

ブログには興味があるけど、ワードプレスってなんか難しそうだなぁなんて思ってませんか?

わー研。では、そんなあなたのために、手順通り進めるだけでワードプレスブログが開設できるマニュアル(特設ページ)をご用意しました!

もちろん無料で利用が可能ですので、はじめての方はぜひご活用ください!

Twitterでフォローしよう

おすすめの記事