WordPressテーマ Cocoonの広告ラベルの文字サイズを小さくする方法

CocoonWordPress
この記事は約2分で読めます。

WordPressテーマのCocoonは、無料で使える高機能テーマで、僕も利用させていただいています。

そんなCocoonですが、広告ラベルのデフォルトの文字サイズが本文と同じでかなり自己主張が強いです。
そこで、広告ラベルの文字サイズを少し小さくするカスタマイズ方法を紹介します。

なお、今回のバージョンは以下の通りです。

  • WordPress 5.2.2
  • Cocoon 1.9.4

広告ラベルの文字サイズを調整するCSSを追加

Cocoon 広告ラベル 文字サイズ調整

早速結論から、WordPressメニューの「外観」⇒「カスタマイズ」⇒「追加CSS」で以下のスタイルを追加しました。

/* Cocoon Ad Label */
.ad-area .ad-label {
  font-size: 80% !important;
}
Cocoon 広告ラベル 文字サイズ調整

画像上が調整前、画像下が調整後です。
こちらは本文内に表示している記事内広告ですが、広告ラベルのフォントサイズを80%にして、本文よりも少し小さめにしました。
本文以外のサイドバーなどに設置した場合も、このスタイルが反映されます。
これで自己主張を控えめにできたかな。サイズはお好みで。

広告ラベルの文言・非表示設定

Googleアドセンスの場合、広告ラベルの文言は「広告」と「スポンサーリンク」のいずれかのみが許可されています。

Cocoon 広告ラベル 文字サイズ調整

Cocoonでの広告ラベルの文言設定は、WordPressメニューの「Cocoon設定」⇒「広告」タブ⇒「広告設定」で行います。

広告ラベルの表示/非表示の設定は、各広告単位で可能です。

Cocoon 広告ラベル 文字サイズ調整

Cocoon設定で広告設定を行っている場合は、「Cocoon設定」⇒「広告」タブ⇒「広告の表示位置」で各箇所の「広告ラベルを表示」のチェックで変更できます。

Cocoon 広告ラベル 文字サイズ調整

ウィジェットで広告設定を行っている場合は、各広告ウィジェットの「広告ラベルを表示する」のチェックで変更できます。

広告ラベルを非表示にした場合は「display:none;」のスタイルが適用されます。

Googleアドセンスの記事内広告は、広告内に「広告」と記載されているので、わざわざ広告ラベルを付ける必要もないかも…。

最後に

今回は、WordPressテーマのCocoonで広告ラベルの文字サイズを調整する方法を紹介しました。
本文よりも小さめにするのが見た目も良いかと思います。

WordPress
えふめん

大阪在住、30代。
業務系SE・社内SEの仕事を通じて学んだこと、PCトラブルで困って調べたこと、手作業を効率化して改善したこと、WordPressのブログ運営などの記事を書いています。

えふめんをフォローする
\よかったらシェアしてね/
この記事が気に入ったら
いいね!しよう
最新情報をお届けします。
俺の開発研究所

コメント

タイトルとURLをコピーしました