Bootstrapモビライズ Googleアドセンス設定法

Bootstrapモビライズ Googleアドセンス設定法

Googleアドセンス運用は可能か?

モビライズでサイト制作を行い、メディアサイトとしてGoogleアドセンス運用を行いたい方も多いかと存じます。結論から申し上げると完全無料でアドセンスの運用が可能となります。

しかしページの特定箇所、要所要所にこのプロバイダーのASPコードを入れたい、というような細かな設定には、無料版での運用は難しいと言わざるを得ません。
この場合には、カスタムHTMLのコードエディター(有料エクステンション)を購入し、ブロック単位での追加運用を行います。


アドセンス審査用コード

Mobiriseアドセンス審査用コードの貼り方
</head>の上にAdsenseコード(審査用コード)を追加

2020年現在、Googleアドセンスはサイトごとの審査が必要となります。

サイトが完成したら、アドセンスの審査用コード(Adsenseコード)をサイト内の全てのページに埋め込む必要があります。このAdsenseコードは <head>〜</head>タグの間に記述しなければなりません。

モビライズ無料版ではheadタグへのかんたん追加の機能がありませんので、パブリッシュした後のhtmlファイルをテキストエディターで開き、Google AdsenseでコピーしたAdsense審査用コードをの上に貼り付けて保存します。作成した全てのHTMLページへ貼り付けてください。
なお審査合格後には、このAdsenseコードは自動広告表示用のコードとしてそのまま利用できますので削除しないようにお願いします。


Mobirise無料版でどこまで出来るか?

Mobirise無料版アドセンス設定
広告ユニットコードを追加

Google Adsenseの審査合格後に、広告ユニットコードをBody直下(コンテンツ開始エリア)に入れる場合、Analyticsボックスの活用が有効です。

左メニューSite SettingsからSEO&Analyticsに進みます。Analyticsのボックスが現れますので、ここに任意の広告コードを追加します。

このボックスには複数のスクリプトコード記述が可能ですので、Google Analyticsのトラッキングコードと併記しても問題ありません
改行だけするようにして下さい。


Mobiriseコードエディターの活用

Mobiriseコードエディターの活用
カスタムHTMLエディターの利用は大変便利

有料のアドオンとなりますが、カスタムHTMLコードエディターを一度購入するとアドセンス運用が大変便利になります。
前述のHead内へのコード記述も、Bootstrapソフトウェア上から設定が可能です。
コードエディターの導入後、追記したいページ設定を開くと、ページのメタタグ記述とプレビュー画面の下に、3つのボックスが追加されます。それぞれ、

◆ Inside<head>code: ヘッドタグ内に記述
◆ End of <body>code: ボディタグ内に記述
◆ Before <!DOCTYPE>,<html>and<head>tags: HTML最上部に記述

と、追加したいスクリプトを指定の場所に簡単に埋め込むことができるようになります。
これでテキストエディター上での編集は不要となりますね。


広告ユニットコードを任意の場所へ追加

Mobirise
広告を配置したい場所へ、カスタムHTMLをドラッグ

カスタムHTMLエディターを使えば、ページ内の任意の場所へコードを設置できるようになります。

最適な広告サイズのユニットコードは、Google Adsenseから事前に取得して下さい。
ブロックを設置したら、ブロックをクリックしエディターを開きます。<div>と</div>間にあるサンプルコードは削除し、代わりにアドセンスからコピーしてきたコードを貼り付けます。

右下のグリーンのチェックマークをクリックし保存完了です。ページがオンラインで広告コードが読み込まれると指定の場所に広告が表示されるようになります。
なおこの設置方法はアドセンスに限らず他のASPプロバイダーのトラッキングコードなどでも動作します。

制作した大切なサイトがソフトやPCのクラッシュなどの事態に見舞われないようバックアップはきちんと取得しておきましょう。次にサイトのエクスポート、インポートについてみていきましょう。

モビライズのサイトエクスポート・インポート機能について