SWELLボタンブロックの使い方を徹底解説｜広告タグ設置＆クリック計測の設定方法

SWELLの「SWELLボタン」ブロックの使い方を初心者さん向けに解説します。

それではご覧ください。

SWELLボタンブロックとは？

SWELLボタンのサンプル

SWELLボタンブロックは、WordPressテーマ「SWELL」に搭載された専用のボタン機能です。

標準のWordPressボタンよりもデザイン性が高く、シンプルからカラフルまで多彩なスタイルが揃っているのが大きな特徴です。

さらに、ただの装飾用ボタンではなく、アフィリエイト広告のタグを直接設置できる機能や、クリック数を計測できる機能があるため、ブログ収益化にも直結する便利なツールです。

ブログを運営する上で「見た目のデザインを整えたい人」や「クリック率を改善したい人」にとって、SWELLボタンブロックは欠かせない存在といえます。

投稿（エディター）画面からは、サンプルのように用意された5種類のスタイルを選んで利用できます。

また、「SWELL設定 ＞ エディター設定」から、よく使うデザインの初期設定が可能です。ここで基本カラーやボタンの角丸（丸み）などをあらかじめ設定しておけば、毎回の作業がスムーズになります。

WordPress標準のボタンブロックとの違い

WordPress標準ボタンのサンプル

• 上のサンプルは、SWELLボタンに似せた形状を掲載しています。

WordPress標準のボタンブロックは、シンプルなデザインとカラー・角丸の調整しかできないため、カスタマイズ性は限られます。

比較項目	WordPress標準ボタンブロック	SWELLボタンブロック
デザイン種類	シンプルなボタンスタイル「塗りつぶし・輪郭」の2種類	豊富なデザイン「ノーマル・立体・キラッと・アウトライン・MOREボタン」の5種類
カスタマイズ性	「角丸・色・グラデーション・サイズ」を自由に調整できますが、設定は毎回行う必要があります。	「角丸・色・グラデーション・サイズ」を自由に調整でき、グローバル設定に登録しておけば、よく使うデザインパターン3種類を簡単に呼び出すことができます。
広告タグの設置	不可（基本リンクのみ）	直接広告タグを埋め込み可能
クリック計測	不可	標準機能でクリック数を計測可能
収益化への活用	向かない	アフィリエイトに最適
操作のしやすさ	シンプルで初心者向け	機能が豊富で初心者〜上級者まで対応

アフィリエイトに便利な機能（広告タグ＆クリック計測）

SWELLボタンブロックは、ただ見た目を整えるだけのボタンではなく、アフィリエイト運用にも便利な機能が充実しています。

1. 広告タグの直接入力が可能
   • 通常のリンクではなく、アフィリエイトタグ（HTMLやJavaScript）を直接埋め込めます。
   • 広告リンクの設置が簡単になり、CTAボタンとして活用できます。
2. クリック計測機能
   • ボタンのクリック数をSWELL標準機能で計測可能。
   • Googleアナリティクスと連携すれば、より詳細なデータ分析も可能です。
   • クリック率（CTR）の改善や広告効果の検証に役立ちます。

これにより、デザイン性と収益性の両立が簡単に実現できます。
SWELLボタンを使えば、ブログやアフィリエイトサイトでの収益化を意識したボタン設計が可能です。

設定方法の詳細は後述します。

SWELLボタンブロックの基本的な使い方

SWELLボタンブロックは、投稿や固定ページの編集画面から簡単に追加でき、クリック率を上げるおしゃれなボタンを手軽に作成できます。

ここでは、基本的な操作手順とカスタマイズ方法を解説します。

SWELLボタンブロックの挿入手順

※ 作業は 投稿（エディター）画面での作業になります。

基本的なSWELLボタンブロックの挿入手順をご紹介します。

SWELLボタンの基本設定

この章では、投稿画面右側に表示される「ブロックタブメニュー」の概略をご紹介します。（基本）

設定メニューの場所は、投稿（記事編集）画面の右側に表示される『設定＞ブロック』タブメニューです。

表示されていない場合は、以下の画面を参考に設定アイコンをクリックしてください。

ブロックタブメニュー詳細設定項目

SWELLボタンの応用設定＆便利な裏技テクニック

ここでは、

広告タグ設定：広告タグを直接入力時にアイコンを挿入する

ASP広告のテキスト部分の改変か許されているか？！規約を必ず確認しておきましょう。
「ペナルティーが発生する場合があります」

広告タグのテキスト部分に「アイコンのショートコード」を追加します。

広告タグを直接入力時のエディター画面とプレビュー画面は以下のようになります。
エディター画面ではショートコードが表示されますが、プレビュー画面ではアイコンが表示されます。

広告タグ設定：広告タグ「呼び出しコード」を使用する

広告タグブロックで ASPの広告を登録している場合「呼び出しコード」を『広告タグを直接入力』の枠欄にペーストすることでボタンリンクができます。

SWELL 広告タグ管理機能と広告タグブロックの使い方！広告の張り替えが超簡単！（仮）
工事中

  広告タグのタイプごとにSWELLボタンブロックを作ってみた結果（参考）

結論から言うと…テキスト型以外は使えません。他はボタンとして表示されません。
広告タグにボタンの設定が入り込んでしまい広告としてもボタンとしてもNGです。
テキスト型も含め、この方法でボタンを作成した場合は必ず！プレビューで確認するようにしましょう。

広告タグのタイプ	表示される不具合
テキスト バナー アフィリエイト Amazon ランキング	良好（テキストがボタンに表示） 広告として表示される 広告として表示される（画像の背景にボタン背景の色が入り込む） 広告として表示される（画像の背景にボタン背景の色が入り込む） 広告として表示される（画像の背景にボタン背景の色が入り込む）

マイクロコピーとアイコン付きのボタンを挿入する

ブロック挿入ツールから 以下のような「マイクロコピーとアイコン付きのボタン」をパターンから呼び出せます。
マイクロコピーとは、ボタンの上側にある短いテキスト（訴求を促す文）のことです。
以下サンプルの場合「＼ ぼたんだよ ／」がそれにあたります。

「マイクロコピーとアイコン付きのボタン」サンプルです。

• ボタンは、リンク先 未設定です。

上記のサンプルは、SWELL標準のブロック挿入ツール内に［SWELL］汎用パターンとして用意されています。

それでは挿入手順を見ていきましょう。

ボタンカラーとデザインの設定（グローバル設定）

ここでは、SWELLボタンブロックのグローバル設定についてご紹介します。
ボタンの基本カラー3種類と、基本スタイル4種類のボタンの丸み（角丸）を設定することができます。

グローバル設定に登録しておけば、毎回デザインを設定する手間が省け、よく使うパターンをすぐに呼び出せるので、作業効率が大幅にアップします。

Menu『WordPress管理＞ダッシュボード＞SWELL設定＞エディター設定＞ボタン（タブ）』をクリックします。

エディター設定での変更は、全てのSWELLボタンブロックに反映されます。

エディター設定でのボタン形状の違いをタブごとに分けてみました。設定後の表示イメージが掴めると思います。タブを切り替えると「ボタンの丸み』設定が変わります。

まとめ！SWELLボタンブロックの使い方を徹底解説｜広告タグ設置＆クリック計測の設定方法

SWELLボタンブロックの使い方をご紹介しました。SWELLのボタンブロックは、デザイン性の高いボタンを簡単に設置できます。広告タグを埋め込むことでアフィリエイトリンクとして使え、さらにクリック計測を設定すれば効果測定も可能です。基本の使い方を覚えて、ブログ運営にしっかり活かしていきましょう。

この記事がお役に立てば嬉しいです。

「最後まで、ご観覧いただきありがとうございました。」
また、次の記事で…お会いしましょう。＼^^／