すなばいじり

はてなブログを使って、トンピーを揃えるまで止めないブログ。ふっくらかわいい。

はてブロのソーシャルボタン下にある広告の場所を入れ替えたい

どれでも(動けば)正解なのですが、色々あった方が選べて良い。
というエントリー。

 

どういうこと?

記事下のソーシャルボタンとGoogleAdsesneの位置を入れ替える方法 - 攻めは飛車角銀桂守りは金銀三枚

ブログProであれば、既存広告をオフにしてから広告表示用のタグを差し込んで、発火(表示開始)させても良さそうです。

2015/01/16 14:51


ブログProであれば、既存広告をオフにしてから広告表示用のタグを差し込んで、発火(表示開始)させても良さそうです。 - psne のコメント / はてなブックマーク

 

こうなっているものを

footer .entry-footer

div.hatena-star-container (metadata)

div.social-buttons

div.google-afc-image

div.customized-footer

 

こうしたい

footer .entry-footer

div.hatena-star-container (metadata)

div.google-afc-image

div.social-buttons

div.customized-footer

 

では、初めからこうして

footer .entry-footer

div.hatena-star-container (metadata)

div.social-buttons

div.customized-footer

 

後から差し込んで

footer .entry-footer

div.hatena-star-container (metadata)

div.google-afc-image (新しく作る)

<ins class="adsbygoogle my_adslot">(広告の任意貼り付け場所)</ins>

div.social-buttons

div.customized-footer

 

表示させる

var atokara = '<div class="google-afc-image test-google-rectangle-ads ">(広告とか)</div>';
document.querySelector("div.social-buttons").insertAdjacentHTML('beforebegin', atokara);

//Gads追加スクリプトの読み込み
(function(b,d){var a=document.createElement(b);a.async=1;a.src=d;var c=document.getElementsByTagName(b)[0];c.parentNode.insertBefore(a,c)})('script','//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js');

//表示
(adsbygoogle = window.adsbygoogle || []).push({});

※現時点では書いただけなので、未検証。

記事一覧にも表示させたい場合は、後から表示させるやつの例のコードと大体同じなので、適宜参照をお願いします。
querySelectorAllで回してガンガン付ければ良いでしょう。

 


はてなブログのカテゴリーや記事一覧にアドセンスなどを表示させるやつ - すなばいじり

 

 

最初は.replaceChild辺りで入れ替えれば良いじゃない と考えたのですが、後から発火(表示)させるタイプの場合、素のHTML(空表示)になり二度手間なので、どうせ発火させるなら一度にしましょうね。という流れです。

入れ替えるコストや速度については、ソーシャルボタン付けている時点でガリガリ書き換えているので許容する方向に考慮しない。というスタンスです。

 

enjoy :)