こんにちは!ブログを書いて1年で月収60万円突破したみのりんです。
稼ぐ系のブログを運営している場合、一番キモとなるのは記事を読み終えた後の出口です。ラストに行動喚起をしてもらう場所を設けて商品の購入なり、メルマガへの誘導だったりしてもらいます。
ラストで決める場所がCTA(Call To Action)というもので、THE THORにも備わっています。そこで、CTAの使い方や設置方法をお伝えしていきます。
THE THORのCTAはどんなもの?
CTAとは、基本的に記事の文末のスペースに配置されたボタンをイメージしますが、大きくわけるとトップページの中にあるボタンなどもCTAのひとつと言えます。
THE THORでもトップページの画像内にあるボタン以外のCTAとして文末もしくは文中に差し込むCTAを取り上げます。このブログのCTAは以下のようになっています。
背景画像と画像の窓、ボタンとテキストを指定することでこの部分が出来上がりますが、THE THORの場合CTA管理画面でいくつか候補を作って他の部分に設置もできます。
THE THORのCTA新規追加
まずは、CTAを新しく作る方法をお伝えします。いくつか作っておいて管理もできますので、最初に作っておけば後で変更も可能です。「CTA作成」しておき「配置」の設定をします。


作成手順
- ビジュアルエディター「カラム」をクリック
- 2カラム7:3を選択
- 左にテキストと右に画像挿入
- スタイルからボタンを選択
1. ビジュアルエディター「カラム」をクリック
THE THORを導入するとエディターの中にカラムという文字が出てきますので▼をクリックして展開してください。
2. 2カラム7:3を選択
上記が展開できたら、その中の2カラム7:3を選びます。ここでは、どのカラムでもOKですし、テキストと画像を縦に並べても問題なければそのままでも構いません。
全体像を見ながらちょうどよいレイアウトを選んでください。
3. 左にテキストと右に画像挿入
カラムのレイアウトが配置されたら、テキストや画像を入力していきます。
4. スタイルからボタンを選択
最後に、CTAには出口が必要ですのでボタンを配置します。

THE THORのCTA管理と色調整
CTAを新規で作るとCTA管理一覧に追加されます。投稿ぺージや固定ページにおいて、ここで設置したCTAを選ぶ画面がでてきます。
投稿画面の右側に「記事下CTA設定」という部分がありますので、ここでどのCTAを表示させたいか指示します。
すると投稿画面に以下のようなCTAが表示されることになります。このやり方ならば、たとえばアフィリエイトでページごとに違う商品を扱う場合などにはとても便利ですよね。
さらに、この枠の色などの設定を説明します。
THE THORのCTAの全体の設定方法
CTA管理で作成するCTAの色などの設置方法です。上記のCTAの枠にはボタンと同じ系統の色を設置しています。これは、カスタマイザー部分で変更が必要なのでCTAを作成した後にやっておきましょう。
投稿ページのCTA色設定

選択可能なデザイン
- フレーム無し[カラー:無]
- シャドウフレーム[カラー:無]
- ボーダーフレーム[カラー:線]
- ベタ塗背景(文字白)[カラー:背景]
ここで設定をするCTAは、トップページで見るような画像等を入れればできるものではなく自分で自由に作成するものです。次の章では、トップページなどで見かける定型のものを説明します。
固定ページのCTA色設定
固定ページも投稿ページのCTAと同じようにレイアウトや色の変更が可能です。設定できる内容も同じです。
選択可能なデザイン
- フレーム無し[カラー:無]
- シャドウフレーム[カラー:無]
- ボーダーフレーム[カラー:線]
- ベタ塗背景(文字白)[カラー:背景]
THE THOR、共通エリアのCTA
共通エリアのCTAはフッターのトップエリアの表示となります。



THE THORのCTAのIDコード
THE THORでCTAを作るとIDコードがカウントされます。基本的に、上記で説明した内容でほぼ設置ができると思いますが、IDコードも便利な使い方がありますのでここでお伝えします。
IDコードはどこに出てくるの?
CTAの管理画面の一覧管理にIDコードがでてきます。
このIDコードを使って、指定するCTAをデフォルトにしたりできます。
投稿ページのCTA設定
まずは、投稿ページの記事下にCTAを入れていく場合、記事を書く都度設定するのは面倒です。もし、どのCTAにするのか決まっていたらIDで指定をしてデフォルトにしていおけばいちいち設定する必要はありません。
使い方として・・・
- 記事の後になにか入会をしてもらいたい場合
- 特定のメルマガに誘導したい場合
- クリックしてほしい場合など
「デフォルトCTAコンテンツ設定」にIDコードを入力して「公開」をクリックします。
ここにIDコードを設置すると、投稿ページの記事下CTA設定でデフォルトのCTAに設定されます。
固定ページのCTA設定
投稿ページと同じことが固定ページでできるようになっています。

THE THORのCTAのまとめ
THE THORのCTAには2種類あります。トップページなど共通フッターに位置するものとレイアウトなど自分自身で作るもの。
トップページのフッター部分に設置するCTA
背景画像、テキスト、ボタン、画像を設置するCTA
共通ページ全体で設定をするので、何もしなくてもブログのフッターに設置される。
投稿ページと固定ページに個別に設置するCTA
自分の作ったレイアウトと色合いのものをそれぞれの記事下に設定するCTA
投稿ページや固定ページでそれぞれどのCTAを設置するのかなど細かく決めることができます。
共通ページのCTAは、記事から少し遠い場所にあるのでユーザーが見てくれるか心配な時などに投稿ページや固定ページ個別に設定をしても良いですし、ケースバイケースで設置していってください。