のんびりよりみちきっぷ

考えた事や実施したことをのんびりと。

はてなブログPro開始。とりあえずこんな感じで広告設置した。

こんにちは。

先日晴れて「はてなブログPro」に変更しました!

 

まだ右も左も分からない知識不足の素人ですが、とりあえずProで可能となる「広告の非表示」を行ってから、Google AdSenseと楽天のモーションウィジェットを貼り付けました。

 

Pro費用くらいは稼げそうだってことで始めましたから、最低でもそれくらいは得たいですね。。。

こちらに記録しておきます。

追記:広告の配置を更新しました。

広告非表示

こちらはブログメニューの「設定」→上のタブの「詳細設定」真ん中くらいの「広告を非表示」から行うことができました。

 f:id:yorimichi_ticket:20170602221535p:plain

 

ついでにキーワードリンクもオフにしておきます。

勝手にブログの単語にはてなキーワードのリンクが付けられてしまうあれです。

 

検索サイトで「はてなキーワード」って検索するとすぐに「うざい」って出てくるくらい嫌がられていますね。

 

Google AdSenseを設置

Google AdSenseの広告はログインして「広告ユニット」から「新しい広告ユニット」をクリックすると作れます。

f:id:yorimichi_ticket:20170602221248p:plain

 

これはサイドメニューに設置しました。

はてなブログのメニューの「デザイン」→上のタブの「カスタマイズ」「サイドバー」→「モジュールの追加」→「HTML」から行うことができます。

f:id:yorimichi_ticket:20170602220940p:plain

 

タイトルには"広告"だったり"スポンサーリンク"などと書いておきましょう。

 

楽天モーションウィジェットを設置

楽天アフィリエイト(https://affiliate.rakuten.co.jp/widget/)にアクセスして「リンクを作成する」ってところから作れます。

 

「掲載したい商品を選択」という部分は、デフォルトのままでもユーザー関連の商品を紹介してくれるってことで、下手にいじりませんでした。

(この辺が素人なんでしょうね。。。)

 

この広告は記事下に追加したかったので横長とは決めていたんですが、サイズに結構悩みました。

色々試してみてPCの表示上は600×200が良かったんですが、スマホで見てみると右側が切れる。。。

 

直し方分からなかったので、スマホでもちゃんと収まるサイズの300×160にしました。

 (やっぱりこの辺が素人なんですね。。。表示して見たらすごい控えめな広告笑)

 

レスポンシブデザインをONにしていてPCと同じように表示されるから、画面幅の小さいスマホでは端が切れてしまうってこと何ですかね。

でも修正方法が分からなかった!

 

選んだのがこれ↓

f:id:yorimichi_ticket:20170602220423p:plain

 

 

 

はてなブログ側ではメニューの「デザイン」→上のタブの「カスタマイズ」「記事」→「記事下」にHTMLソースを貼り付ければOK。

f:id:yorimichi_ticket:20170602220751p:plain

 

これでなんとか広告の設置完了です。

あとは少しの間クリック数なんかをウォッチしようと思います。