あずきです🐥
WordPressブログにおける…
各種「広告コード」の基本的な貼り方(=挿入手順)
について、ブログ初心者さん向けに1から解説していきます
大きく2つのパターンです
- 広告コードを「手動挿入」する手順(「クラシックエディタ」における解説です)
- 広告コードを「自動挿入」する手順(WordPressテーマ「AFFINGER5」における解説です)
さっそく見ていきましょー🐥
-
【愛用】「WING AFFINGER5」って実際どうなの?気に入ってる点・気になる点をガチレビュー【WordPressのおすすめテーマ】
続きを見る
-
WordPressの「タグ管理」とは?どれだけブログに必須な機能か、3分で解説【よく使う文章や広告をテンプレート化/一括修正が最強に便利】
続きを見る
今回の記事はこちらの章に属しています
About me
- 専業ブロガー・フリーランス -
あずき
独立3年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^
Contents
【はじめに①】広告コードの取得はすでに済ませていますか?【各種ASPの登録&提携審査 → プログラム提携&広告コードの取得】
まず本題へ入る前に、これからWordPressブログに貼ろうと思っている広告について…
その「広告コード」自体はすでに取得している
という前提で解説していきます
もしも「え、広告コードなんて取得してないけど…」という場合は、下記の記事でわかりやすく解説しています

▼ 主要ASPの新規登録はこちら ▼
-
【ブログ】おすすめなASPサービス「8つ」と、新規登録の手順【アフィリエイト広告】
続きを見る

▼ 主要ASPごとの、広告コードの取得はこちら ▼
-
「Googleアドセンス」3つの広告タイプの使い分け & 各広告リンクの取得方法【ディスプレイ広告・インフィード広告・記事内広告】
続きを見る
-
Amazonアソシエイトで、広告コードを取得する手順【ブログ/アフィリエイト】
続きを見る
-
楽天アフィリエイトで、広告リンクを作成する(コードの取得)手順【ブログ/アフィリエイト】
続きを見る
-
もしもアフィリエイトで、広告の「プログラム提携」と「コード取得」をする手順【ブログ/アフィリエイト】
続きを見る
-
afbで、広告の「プログラム提携」と「コード取得」をする手順【ブログ/アフィリエイト】
続きを見る
-
A8.netで、広告の「プログラム提携」と「コード取得」をする手順【ブログ】
続きを見る
-
バリューコマースで、広告の「プログラム提携」と「コード取得」をする手順【ブログ】
続きを見る
【はじめに②】WordPressブログへの広告の貼り方は、大きく2パターン【手動 or 自動】
もう1点、大事な補足です
そもそもWordPressブログへの各種広告コードの挿入方法というのは、大きく「2パターン」にわかれます
- パターン①:手動挿入
- パターン②:自動挿入
まず「手動挿入」というのは、広告を載せたい「1つ1つの記事ごと」に、手動でコードを貼っていく方法です

一方で「自動挿入」というのは、「全記事」の特定エリアに、コードが自動挿入されるよう設定していく方法になります

この2パターンの使い分けとしては…
- 「記事ごと」の好きな場所に、(その都度)別々の広告を貼りたい場合 ⇒ 手動挿入
- 「全記事」の特定エリアに、一括して同じ広告を貼りたい場合 ⇒ 自動挿入
こんなふうにイメージしておけば、とりあえずはOKです
例えば!
よくブログで見かける「各見出し前」や「記事おわり」のアドセンス広告とかだと、「自動挿入」が圧倒的に便利です

ということで、ここから本題です🐥
【本題】WordPressブログにおける、各種「広告コード」の基本的な貼り方【手動と自動で2パターン】
パターン①:広告コードを「手動」で挿入
注意
今回の解説は、WordPressの旧エディタ「クラシックエディタ」の場合における手順になります
新エディタ「グーテンベルグ」の場合は対象外になりますので、ご了承ください
「クラシックエディタとグーテンベルグってなに…?」という方はこちら ↓
-
【2021年】WordPressのクラシックエディタとグーテンベルグとは?初心者向けに1から解説【プラグイン「Classic Editor」の導入方法】
続きを見る
それでは本題の手順です
「手動挿入」の場合は、結論から言ってしまうと…
- 記事の編集画面で、「テキスト」モードに切り替える
- 広告を載せたい箇所に、その広告コードを貼りつける
これだけです
実際に画像つきで見ていきますね🐥
今回は例として…
↑ このオレンジ枠の部分に、広告を貼ってみたいと思います
記事の編集画面を開いたら…
↑ 右上の、「テキスト」というタブをクリックしましょう
これで、編集モードが「ビジュアル」から「テキスト」へと切り替わります
「ビジュアルとテキストって何?」という方は、↓ をどうぞ♪
-
WordPressの「ビジュアルエディタ&テキストエディタ」とは?【クラシックエディタにおけるブログ記事編集】
続きを見る
「テキスト」モードに切り替えたら…
↑ 広告を貼る予定の箇所を探して、その1つ上の行から…
↑ Enterキー で1行空け、そこに…
↑ 取得しておいた広告コードを、丸々貼りつけましょう
コードを貼りつけたら…
↑ 右上の「ビジュアル」タブをクリックで、編集モードを「ビジュアル」に戻してOKです
これでもう広告は貼れています🐥
さきほどの行を改めて「ビジュアル」モードで見てみると…
↑ バナー広告が反映されてます(便宜上モザイクをかけてます)
今回はバナー広告(=「画像」タイプの広告)を例に解説しましたが、「テキスト」タイプの広告でもやり方はまったく同じです
注意ポイント
実際にブログ上に反映されるまでには、多少時間がかかります
「キャッシュ削除」と「パーマリンク設定の再保存」をしたうえで、数十分ほど置いてからチェックしてみましょう
簡単でしたね♪

広告コードを「自動」で挿入
ブログ広告は、「自動挿入」の機能を使いこなすことで、「手動挿入」の100倍は平気で楽になります

ただこの自動挿入の機能は、使用する「WordPressテーマ」によって…
- 機能そのものの有無
- 具体的な機能の中身
が変わってきます
このブログでも愛用中のWordPressテーマ「WING(AFFINGER5)」における、広告コードの「自動挿入」機能については、下記の通り🐥
設置場所として代表的な、「3つ」の機能をご紹介します
全記事の、「各見出し前」へアドセンス広告を自動設置する手順です ↓
-
AFFINGER5で、アドセンス広告を「n番目の見出し前」に自動で挿入する手順【ブログ】
続きを見る
全記事の、「記事おわり」へアドセンス広告を自動設置する手順です ↓
-
AFFINGER5で、アドセンス広告を「記事おわり」に自動で挿入する手順【PC並列/スマホ単体】
続きを見る

「記事一覧」エリアへ、アドセンス広告を自動設置する手順です ↓
-
AFFINGER5で、アドセンスの「インフィード広告」を記事一覧に挿入する手順【ブログ】
続きを見る
ちなみに、上記の方法以外にも…
- アドセンス広告に限らず
- かつ、「好きなエリア」へのコード挿入を簡単に行えて
- かつ、挿入後の「差し替え」や「削除」も飛躍的にラクになる
そんな、超おすすめな機能もあります
ズバリ…
- タグ管理
という機能
ブログで広告を貼るようになったら、個人的には「タグ管理を使わないのは本当に考えられない」と断言できるくらい…
そのくらい便利な機能です
くわしくはこちら ↓
-
WordPressの「タグ管理」とは?どれだけブログに必須な機能か、3分で解説【よく使う文章や広告をテンプレート化/一括修正が最強に便利】
続きを見る
-
【WING AFFINGER5対応】「STINGERタグ管理プラグイン3」の導入手順を1から解説【ダウンロード&解凍/インストール&有効化】
続きを見る
おしまい♪
あずき(Twitter:@azuki_rinrin)
\ このブログでも愛用中!/
―― 検証と改善を重ねた唯一無二のテーマ ――
WING AFFINGER5
✔ 洗練された美しいデザイン性と、「変幻自在」な圧巻のバリエーション
✔ 時間のかかる面倒なカスタマイズも、「クリック1つ」でさくさく実現
✔ 「本気で戦う」ための、最適化されたSEO対策と収益UPの機能が標準装備
今なら超時短ツール「タグ管理プラグイン(4,980円)」の無料配布キャンペーン中!
-
WordPressの「タグ管理」とは?どれだけブログに必須な機能か、3分で解説【よく使う文章や広告をテンプレート化/一括修正が最強に便利】
続きを見る
今回の記事はこちらの章に属しています
About me
- 専業ブロガー・フリーランス -
あずき
独立3年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^