WORDPRESS

WordPressブログにおける、各種「広告コード」の基本的な貼り方【アフィリエイト広告の挿入方法】

WordPressブログにおける、各種「広告コード」の基本的な貼り方 アイキャッチ



あずきです🐥

WordPressブログにおける…

各種「広告コード」の基本的な貼り方(=挿入手順)

について、ブログ初心者さん向けに1から解説していきます

大きく2つのパターンです

  • 広告コードを「手動挿入」する手順(「クラシックエディタ」における解説です)
  • 広告コードを「自動挿入」する手順(WordPressテーマ「AFFINGER5」における解説です)

さっそく見ていきましょー🐥

\「本気」で戦うなら /

WING AFFINGER5 バナー 02

―― 検証と改善を重ねた唯一無二のテーマ ――

WING AFFINGER5

今なら超時短ツール「タグ管理プラグイン(4,980円)」の無料配布キャンペーン中!

ブログの「タグ管理」機能とは?仕組み&使い方から、メリット&デメリットまで アイキャッチ
【超時短】ブログの「タグ管理」機能とは?仕組み&使い方から、メリット&デメリットまで【WordPress】

続きを見る

 

今回の記事はこちらの章に属しています

WordPressブログガイド 第8章「広告」編 

About me

あずきアイコン main-01 背景透過

- 専業ブロガー・フリーランス -

あずき

独立3年目 / 元アパレル → 歴10年

20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます

普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^

Twitter

【はじめに①】広告コードの取得はすでに済ませていますか?【各種ASPの登録&提携審査 → プログラム提携&広告コードの取得】

WordPressブログ「完全初心者」ガイド 見出し a-01

まず本題へ入る前に、これからWordPressブログに貼ろうと思っている広告について…

その「広告コード」自体はすでに取得している

という前提で解説していきます

もしも「え、広告コードなんて取得してないけど…」という場合は、下記の記事でわかりやすく解説しています

まずは各種ASPへの登録から ↓

▼ 主要ASPの新規登録はこちら ▼

おすすめなASPサービス「8つ」と、新規登録の手順 アイキャッチ
【ブログ】おすすめなASPサービス「8つ」と、新規登録の手順【アフィリエイト広告】

続きを見る

ASPに登録(&提携審査にクリア)できたら ↓

▼ 主要ASPごとの、広告コードの取得はこちら ▼

「Googleアドセンス」3つの広告タイプの使い分け & 各広告リンクの取得方法 アイキャッチ
「Googleアドセンス」3つの広告タイプの使い分け & 各広告リンクの取得方法【ディスプレイ広告・インフィード広告・記事内広告】

続きを見る

Amazonアソシエイトで、広告コードを取得する手順 アイキャッチ
Amazonアソシエイトで、広告コードを取得する手順【ブログ/アフィリエイト】

続きを見る

楽天アフィリエイトにおける広告コードの取得手順 アイキャッチ
楽天アフィリエイトで、広告リンクを作成する(コードの取得)手順【ブログ/アフィリエイト】

続きを見る

もしもアフィリエイトで、広告の「プログラム提携」と「コード取得」をする手順 アイキャッチ
もしもアフィリエイトで、広告の「プログラム提携」と「コード取得」をする手順【ブログ/アフィリエイト】

続きを見る

afbで、広告の「プログラム提携」と「コード取得」をする手順 アイキャッチ
afbで、広告の「プログラム提携」と「コード取得」をする手順【ブログ/アフィリエイト】

続きを見る

A8.netで、広告の「プログラム提携」と「コード取得」をする手順 アイキャッチ
A8.netで、広告の「プログラム提携」と「コード取得」をする手順【ブログ】

続きを見る

バリューコマースで、広告の「プログラム提携」と「コード取得」をする手順 アイキャッチ
バリューコマースで、広告の「プログラム提携」と「コード取得」をする手順【ブログ】

続きを見る

【はじめに②】WordPressブログへの広告の貼り方は、大きく2パターン【手動 or 自動】

WordPressブログ「完全初心者」ガイド 見出し a-02

もう1点、大事な補足です

そもそもWordPressブログへの各種広告コードの挿入方法というのは、大きく「2パターン」にわかれます

  • パターン①:手動挿入
  • パターン②:自動挿入

まず「手動挿入」というのは、広告を載せたい「1つ1つの記事ごと」に、手動でコードを貼っていく方法です

いわゆる普通の貼り方!

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

ちょっと応用の貼り方!(でも手順は簡単で、めちゃめちゃ実践的!)

この2パターンの使い分けとしては…

  • 「記事ごと」の好きな場所に、(その都度)別々の広告を貼りたい場合 ⇒ 手動挿入
  • 「全記事」の特定エリアに、一括して同じ広告を貼りたい場合 ⇒ 自動挿入

こんなふうにイメージしておけば、とりあえずはOKです

例えば!

よくブログで見かける「各見出し前」や「記事おわり」のアドセンス広告とかだと、「自動挿入」が圧倒的に便利です

これから広告を貼っていくなら、この「2パターン」ともちゃんと押さえておくべし!

ということで、ここから本題です🐥

【本題】WordPressブログにおける、各種「広告コード」の基本的な貼り方【手動と自動で2パターン】

パターン①:広告コードを「手動」で挿入

WordPressブログ「完全初心者」ガイド 見出し a-03

注意

今回の解説は、WordPressの旧エディタ「クラシックエディタ」の場合における手順になります

新エディタ「グーテンベルグ」の場合は対象外になりますので、ご了承ください

「クラシックエディタとグーテンベルグってなに…?」という方はこちら ↓

WordPressの「グーテンベルグ&クラシックエディタ」とは?どっちがおすすめ? アイキャッチ
WordPressの「グーテンベルグ&クラシックエディタ」とは?どっちがおすすめ?【ブログ記事編集の新エディタ・旧エディタ】

続きを見る

それでは本題の手順です

「手動挿入」の場合は、結論から言ってしまうと…

  1. 記事の編集画面で、「テキスト」モードに切り替える
  2. 広告を載せたい箇所に、その広告コードを貼りつける

これだけです

実際に画像つきで見ていきますね🐥

今回は例として…

WordPress_広告コードの挿入手順_1-01

↑ このオレンジ枠の部分に、広告を貼ってみたいと思います

記事の編集画面を開いたら…

WordPress_広告コードの挿入手順_1-01

↑ 右上の、「テキスト」というタブをクリックしましょう

これで、編集モードが「ビジュアル」から「テキスト」へと切り替わります

「ビジュアルとテキストって何?」という方は、↓ をどうぞ♪

WordPressの「ビジュアルエディタ&テキストエディタ」とは? アイキャッチ
WordPressの「ビジュアルエディタ&テキストエディタ」とは?【クラシックエディタにおけるブログ記事編集】

続きを見る

「テキスト」モードに切り替えたら…

WordPress_広告コードの挿入手順_1-01

↑ 広告を貼る予定の箇所を探して、その1つ上の行から…

WordPress_広告コードの挿入手順_1-04

↑ Enterキー で1行空け、そこに…

WordPress_広告コードの挿入手順_1-05

↑ 取得しておいた広告コードを、丸々貼りつけましょう

コードを貼りつけたら…

WordPress_広告コードの挿入手順_1-06

↑ 右上の「ビジュアル」タブをクリックで、編集モードを「ビジュアル」に戻してOKです

これでもう広告は貼れています🐥

さきほどの行を改めて「ビジュアル」モードで見てみると…

WordPress_広告コードの挿入手順_1-07

↑ バナー広告が反映されてます(便宜上モザイクをかけてます)

今回はバナー広告(=「画像」タイプの広告)を例に解説しましたが、「テキスト」タイプの広告でもやり方はまったく同じです

注意ポイント

実際にブログ上に反映されるまでには、多少時間がかかります

「キャッシュ削除」と「パーマリンク設定の再保存」をしたうえで、数十分ほど置いてからチェックしてみましょう

簡単でしたね♪

今度は、「自動挿入」の手順を見ていくよ!

\「本気」で戦うなら /

WING AFFINGER5 バナー 02

―― 検証と改善を重ねた唯一無二のテーマ ――

WING AFFINGER5

今なら超時短ツール「タグ管理プラグイン(4,980円)」の無料配布キャンペーン中!

広告コードを「自動」で挿入

WordPressブログ「完全初心者」ガイド 見出し a-04

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

わりと大げさじゃなく

ただこの自動挿入の機能は、使用する「WordPressテーマ」によって…

  • 機能そのものの有無
  • 具体的な機能の中身

が変わってきます

このブログでも愛用中のWordPressテーマ「WING(AFFINGER5)」における、広告コードの「自動挿入」機能については、下記の通り🐥

設置場所として代表的な、「3つ」の機能をご紹介します

全記事の、「各見出し前」へアドセンス広告を自動設置する手順です ↓

AFFINGER5で、アドセンス広告を「n番目の見出し前」に自動で挿入する手順 アイキャッチ
AFFINGER5で、アドセンス広告を「n番目の見出し前」に自動で挿入する手順【ブログ】

続きを見る

全記事の、「記事おわり」へアドセンス広告を自動設置する手順です ↓

AFFINGER5で、アドセンス広告を「記事おわり」に自動で挿入する手順 アイキャッチ
AFFINGER5で、アドセンス広告を「記事おわり」に自動で挿入する手順【PC並列/スマホ単体】

続きを見る

「PC表示=横並び」「スマホ表示=単体」で設置できるよ!

「記事一覧」エリアへ、アドセンス広告を自動設置する手順です ↓

AFFINGER5で、アドセンスの「インフィード広告」を記事一覧に挿入する手順 アイキャッチ
AFFINGER5で、アドセンスの「インフィード広告」を記事一覧に挿入する手順【ブログ】

続きを見る

ちなみに、上記の方法以外にも…

  • アドセンス広告に限らず
  • かつ、「好きなエリア」へのコード挿入を簡単に行えて
  • かつ、挿入後の「差し替え」や「削除」も飛躍的にラクになる

そんな、超おすすめな機能もあります

ズバリ…

  • タグ管理

という機能

ブログで広告を貼るようになったら、個人的には「タグ管理を使わないのは本当に考えられない」と断言できるくらい…

そのくらい便利な機能です

くわしくはこちら ↓

ブログの「タグ管理」機能とは?仕組み&使い方から、メリット&デメリットまで アイキャッチ
【超時短】ブログの「タグ管理」機能とは?仕組み&使い方から、メリット&デメリットまで【WordPress】

続きを見る

AFFINGER5の超時短ツール「STINGERタグ管理プラグイン3」の導入方法 アイキャッチ
AFFINGER5の超時短ツール「STINGERタグ管理プラグイン3」の導入方法【ダウンロード&解凍/インストール&有効化】

続きを見る

おしまい♪

あずき(Twitter:@azuki_rinrin

\「本気」で戦うなら /

WING AFFINGER5 バナー 02

―― 検証と改善を重ねた唯一無二のテーマ ――

WING AFFINGER5

 ✔ 洗練された美しいデザインと、「変幻自在」な圧巻のバリエーション!

 ✔ 時間のかかる面倒なカスタマイズも、「クリック1つ」でさくさく実現!

 ✔ 「本気で戦う」ための、最適化されたSEO対策と収益UPの機能が標準装備!

今なら超時短ツール「タグ管理プラグイン(4,980円)」の無料配布キャンペーン中!

公式:「稼ぐ」に特化したWordPress テーマ『WING AFFINGER5』

関連:「AFFINGER5」の購入&導入ステップを画像つきで1から解説

ブログの「タグ管理」機能とは?仕組み&使い方から、メリット&デメリットまで アイキャッチ
【超時短】ブログの「タグ管理」機能とは?仕組み&使い方から、メリット&デメリットまで【WordPress】

続きを見る

 

今回の記事はこちらの章に属しています

WordPressブログガイド 第8章「広告」編 

あずきのWordPressブログガイド 総合TOP 

About me

あずきアイコン main-01 背景透過

- 専業ブロガー・フリーランス -

あずき

独立3年目 / 元アパレル → 歴10年

20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます

普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^

Twitter

-WORDPRESS

© 2020 あずきのぶろぐ