アフィリエイトサイトを作っていると、商品を紹介する記事を書くたびに、
「この記事にはアフィリエイト広告が含まれています」
という表示を入れる必要があります。
毎回コピー＆ペーストする方法もありますが、記事を書くたびに入れるのは少し面倒ですよね。
そこで今回は、WordPressのCocoon Childを使って、投稿記事の冒頭にアフィリエイト広告についての表示を自動で入れる設定をしてみました。
一度設定しておけば、記事を書くたびに文章を入力する必要がありません。
今回設定した方法
今回使ったのは、
- WordPress
- Cocoon Child
- ウィジェットの「投稿本文上」
- カスタムHTML
- 追加CSS
です。
HTMLで広告表示の文章を入れ、CSSで見た目を整えました。
①「投稿本文上」にカスタムHTMLを追加
WordPress管理画面から、
外観 → ウィジェット
を開きます。
Cocoonには、投稿記事の本文より上に表示できる**「投稿本文上」**というウィジェットエリアがあります。
ここに「カスタムHTML」を追加します。
今回使用したHTMLはこちらです。
<div class="affiliate-notice">
当サイトでは、商品やサービスをご紹介する記事に、アフィリエイト広告を利用しています。
<br>
記事内のテキストや写真などから、商品・サービスの詳細ページへご案内する場合があります。
<br>
ご購入・ご利用の際は、リンク先の公式サイトで内容をご確認のうえ、ご自身の判断でお願いいたします。
</div>入力したら保存します。
②追加CSSでデザインを整える
HTMLを入れただけでも文章は表示されますが、そのままだと少し味気ないので、CSSで見た目を整えます。
Cocoon Childでは、
外観 → カスタマイズ → 追加CSS
からCSSを追加できます。
今回のHTMLでは、
.affiliate-notice
というクラスを指定しています。
このクラスに対してCSSを設定することで、広告表示の背景や枠、文字サイズなどを調整できます。
例えば、
.affiliate-notice {
padding: 12px 15px;
margin-bottom: 20px;
background: #f7f7f7;
border: 1px solid #ddd;
font-size: 13px;
line-height: 1.7;
}のように設定できます。
※実際のデザインは、サイトの雰囲気に合わせて調整できます。
③記事を確認する
設定が終わったら、投稿記事を表示して確認します。
すると、記事本文の前に広告についての案内が自動的に表示されます。
これなら新しく記事を書くたびに、広告表示の文章をコピーして貼り付ける必要がありません。
毎回入力しなくていいのが便利
今回この設定をしてみて、一番便利だと思ったのは、記事を書くときに広告表示を毎回入れなくていいことです。
特に商品紹介記事をたくさん作っていく場合、毎回同じ文章を入力するよりも、サイト側で自動表示できるようにしておくと作業が楽になります。
また、文章を変更したくなった場合も、ウィジェットの内容を変更すれば、設定した場所に表示される文章をまとめて変更できます。
まとめ
Cocoon Childでは、ウィジェットの「投稿本文上」とカスタムHTML、追加CSSを使って、記事冒頭にアフィリエイト広告についての案内を自動表示できます。
今回の設定は、
外観 → ウィジェット → 投稿本文上 → カスタムHTML
に広告表示用のHTMLを入れ、
外観 → カスタマイズ → 追加CSS
でデザインを整えるという方法です。
記事を書くたびに同じ文章を入力する手間を減らしたい方は、こうした方法を使ってみると便利だと思います。
