ブログ運営 ブログ運営-コスパのいいブログ運営研究

【中級者向け】ブログ記事直下(ソーシャルボタン上)に自動でブログ村ランキングボタン・twitterフォローボタン等を配置する方法

僕は少し前まで、ブログ記事を書いたあとに手動でブログ村やブログランキングのHTMLを記事直下にコピペしていました。
けどそれだと微妙にめんどくさい。

 

なので最近は記事直下になにも置かず、記事下にランキングボタンを配置しました。
でもそれだとソーシャルボタン群の向こう側になるので記事から微妙に距離があるし、記事直下は少し寂しい状態でした。

※ちなみに少し前まで関連過去記事も手動で記事直下に配置していましたが、これはMilliardの導入により解消しました。ブログカードそのままで入れるとガタガタになるしね!

『はてなブログ』PC画面のサイドバー情報を断捨離し、Milliardを導入してみた! - A1理論はミニマリストなIT系営業マン

 

で、最近、NHKミニマリスト特集の放映などでブログ村のミニマリストランキングが群雄割拠になってきて、僕のこのブログも50位以下に落ちてしまいました。

50位以下に落ちてしまうと1ページ目から外れます。ブログ村ランキングの2ページ目はなかなかクリックしてもらえません。
どうにか50位以内はキープしておきたいな、と思っていました。

(「自分押し」&割合100%&記事下クリックだけでは50位以内は厳しくなってきました。)

 

スラスラわかるHTML&CSSのきほん

スラスラわかるHTML&CSSのきほん

 

 

そんな折、昨日、ヒトデ氏のこの記事を読んで、

【コピペでOK】はてなブログでアドセンスの配置に役立つコードの書いてある記事をまとめたよ!(スポンサーリンク表記、横並び、ソーシャルボタン下、記事中) - 今日はヒトデ祭りだぞ!

この記事を参照にして記事直下、ソーシャルボタン上にアドセンス広告を配置してみました!

【はてなブログ】記事本文の直下にアドセンスを設置する方法 - チップの日常

アドセンスが二連続は美しくなかったし、画面をアドセンスが埋め尽くしてしまうのも問題だった、さらに下のアドセンスはクリック率が低かったのでそれらはこれ一発で解消されました。

 

そして今日、ふと、
「それならブログ村ランキングボタンやtwitterフォローボタンもその上に配置できるんじゃないのかな?」
と思い、配置してみたら簡単にできましたw

 

アドセンス広告の上に配置するだけでした!w
こんな感じです。

 

<div id="my-footer">

▼(例)毎日元気につぶやき中!

<br>

※ここにtwitterフォローボタンのコード貼り付け
<br>

▼(例)クリック頂けると励みになります!

<br>
※ここにブログ村・ブログランキング等のコード貼り付け
<br>
【スポンサーリンク】

<br>

※ここにアドセンスのコード貼り付け
</div>
 <script>
 var myFooter=document.getElementById("my-footer");var temp=myFooter.cloneNode(true);myFooter.parentNode.removeChild(myFooter);document.getElementsByClassName("entry-content")[0].appendChild(temp);
 </script>

 

これで、モバイル・PC画面共に、読者の方が記事を読み終わった後に、

・twitterフォローボタン・ランキングパーツ

・アドセンス広告

ソーシャルパーツ群・読者登録ボタン・ランキングパーツ(再)

・アドセンス広告

関連記事・注目記事・関連記事(再)

という美しい流れができて満足していますw

この応用技でfeedlyボタンやはてなブログの「読者になる」ボタン、プルダウンメニュー等をソーシャルボタン上に設置してもいいかもです!

 

【いくつかアドバイス】

作業はモバイル画面から先に手を付けたほうがいいです。

モバイル画面完成後、うまく行ったコードをPC画面にコピペして調整。

 

あと、ボタン上等に付ける、

▼毎日元気につぶやき中!

等の例文はあまり長いとスマホによっては二行になるのでこれくらいの長さがいいと思います。

twitterのフォローボタンのコードは▼ここで手に入ります。

Twitterボタン | About
ブログ村やブログランキングボタンのサイズと合わせて大きいボタンにしたほうが見栄えがいいと思います。

<br>

のタグはめんどくさいのですが、これがないとパーツや文章が並べて表示されてしまうので挟みましょう。

逆にブログ村ボタンとブログランキングは離さず、左右に並べて表示ほうがいいと思います。
▼こちらをご参照。

バナーを並べて表示したいのですが・・・ - にほんブログ村 メンバー要望掲示板

要はブログ村画面上の「バナーのテキスト表示をオフにする」にチェックです!

 

皆様のブログコスパが上がることを願っています♪

ブログ運営 ブログ運営-このブログについて ミニマリズム ミニマリズム-生活

2022/6/18

僕は1998年の春から今日も、インターネット上に「なんてことない雑文」ばかり書き続けている。

「インターネットに雑文を書き続けて、まもなく四半世紀になるなぁ。」 と、先日ふと思ったので、そんな「僕は雑文ばかり書いてきた」という雑文を書いてみることにしました。 この記事は毒にも薬にもならない記事で、生活お役立ち記事でもないです。SEOも意識していないですし、バズることもありません。最近、「ブログの神様」と言われ始めた僕の昔のブログ仲間のヒトデがよく言うベネフィット()も特にありませんw 目次1 『なんでもない日記』がインターネットから「フェードアウト」している。2 日本の『平成』時代は『コミュニティ ...

ReadMore

ミニマリズム ミニマリズム-生活

2022/6/17

家に送られてきた住民税の税額決定・納税通知書を確認したらふるさと納税の控除が反映されてなかった!確認方法と対処法をお伝えします!

昨年から楽天経済圏の住民のA1理論です! 昨年末に人生初の楽天ふるさと納税を行い、今年2月に確定申告を行いましたが、今月6月に家に送付されてきた上記アイキャッチ写真の住民税の納付書(『特別区民税・都民税 税額決定・納税通知書』これは東京都新宿区の場合。自治体によって名称は異なると思います)にふるさと納税の控除が反映されていませんでした!今回はその確認方法と対処方法をシェアします! 初めてふるさと納税した方、住民税にふるさと納税の控除が反映されているかどうかの確認方法を知りたい方、反映されていなかった場合の ...

ReadMore

ミニマリズム ミニマリズム-生活

2022/6/8

2022年の健康診査&がん検診!健康体すぎて病院の先生にめっちゃ褒められたよ!

ここ1年間ほど仕事そっちのけで『健康活動』にいそしんできた44歳男子のA1理論です! 今年も6月になり、僕が住んでいる自治体(市区町村、僕の場合は東京都新宿区)から健康診査とがん検診のご案内の封筒が届いたので、最速で健康診査とがん検診を受診しました!最終の検査結果が出るのは約1ヶ月後ですが、予想通り今回の健康診査とがん検診では先生にめっちゃ褒められました!今回のこの記事では全日本人、特に40歳以上の健康診査やがん検診について語りたいと思っています! この記事が、長らく健康診査やがん検診に行っていない方、健 ...

ReadMore

ミニマリズム ミニマリズム-ミニマリスト本 ミニマリズム-ミニマリズム論

2022/6/5

『2010年代のミニマリスト』と『2020年代のミニマリスト』の違いを考えてみた!

※今回の記事は個人の経験の範囲で考えて書いた極めて主観的な記事です。 「ミニマリストを分析するのが大好きなミニマリスト」のA1理論です。僕の狭いアパートの部屋にはミニマリスト本がいっぱいで、もう「ミニマリスト評論家」を名乗ろうかなwさて、そんな僕は1年ほどまえの昨年6月ごろから「2010年代のミニマリスト」と「2020年代のミニマリスト」の違いをぼーっと考えていました。▼この2者の違い。 ●「2010年代のミニマリスト」は3.11からコロナ前までのミニマリスト●「2020年代のミニマリスト」はコロナ後のミ ...

ReadMore

ブログ運営 ブログ運営-コスパのいいブログ運営研究 ミニマリズム

2022/6/4

【2022年夏】ブログ初心者&中級者向けのRinker登録オススメASP!(Amazon &楽天市場&もしもアフィリエイト&バリューコマース)

ここ2週間以上、ワードプレスの物販プラグインである『Rinker』に登録するベストなASPに関して調べて考えまくっていたRinker初心者のA1理論です!(ブログ歴は無駄に長い) Rinkerに登録するASPに関してはいろんなブログ記事や動画でいろんな情報が錯綜していて、かつ2020年前後の古い情報も多いので、今回、僕なりに情報を整理し、そこからベストな登録ASPを考えてみたのでその理由とともに書いていきたいと思います。またこの記事はブログ初心者の方と中級者以上の方、両方に向けて分けて書いてみました!(多 ...

ReadMore

-ブログ運営, ブログ運営-コスパのいいブログ運営研究

© 2022 A1理論はミニマリスト Powered by AFFINGER5