はてなブログの「読者になるボタン」を記事を読んだ人が目に入りやすいよう記事直下に配置する方法を調べたので、他にも設置しようと考えている方向けに設置方法のご紹介になります。
やり方の流れざっくり
- ①"読者になるボタン"のHTMLを調べる
- ②記事直下に貼り付けるコードの中①のコードを入れる
- ③デザイン⇒カスタマイズ⇒記事⇒記事下欄に貼り付ける
完成形
こんな感じになります。
なお②を抜かして①⇒③でもボタン配置は出来ますが、以下のように記事からは離れて配置されるため目に留まりにくくなってしまいます。
設置方法
①読者になるボタンを表示するHTMLを調べる
ダッシュボード⇒設定⇒詳細設定にいきます。
下の方へスクロールすると、「読者になるボタン」項目があるので、そこに表示されているHTMLをコピーしてメモ帳などに貼り付けておきます。
②記事直下に貼り付けるコードの中①のコードを入れる
はてなブログには記事の下に表示させるコードがあり、そのコードをメモ帳などにコピーしてその中で①でコピーしたコードを入れます。以下記事から拝借させていただきました。内容がとてもわかり易く参考になりました。
記事下に表示させるコード
<div id="my-footer">
※ここに①でコピーしたコードを入れる
</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>
③デザイン⇒カスタマイズ⇒記事⇒記事下欄に貼り付ける
管理画面からデザインを選択
カスタマイズ(スパナマーク)⇒記事を選択
「記事下HTML」の欄に②で作ったコードを貼り付けます。
上部にある「変更を保存する」で完了です
おわりに
上記設定をすると以後追加する記事すべて自動挿入されるので、都度入れたりとかのお手間はありません。記事が参考になりましたら幸いでゴザイマス。
