あなたは、はてなブログを読むのはPCで?スマートフォンで?
スマートフォン派の方は、読者になりたい時に困る場合がありませんか?
今回は「読者になる」ボタンがない時の対処法と、ボタンの設置方法について書いてみたいと思います。

初期状態なら「読者になる」ボタンはここにある
スマホ版は、デザインを何もいじらなければ「読者になる」ボタンが2つ用意されています。
※自分のサイトの現状を確認する場合は、ログアウトしてから見にいくとわかりやすいです。
ヘッダーと記事の下の方


でも、デザインをいじっている方がほとんどですよね。
レスポンシブデザインを使っている方はPC版のサイドバーのプロフィール欄が表示されて、そこにボタンが設置されていることがほとんどなのでほぼ大丈夫です。
ただ、スマホ版をカスタマイズしている場合、上で紹介した場所にボタンが表示されている方はほとんどいません。
なので、頑張って自作のボタンを探してみるのですが、残念ながら設置されていない場合も。
困りますねー(>_<)
それでも読者になりたい
PC版に切り替える
まずは、スマホ版からPC版に切り替える。
Chromeなら右上の三点リーダをタップして、「PC版サイトをみる」にチェックを入れる。


PC版に切り替わったら、画面上の左側

もしくはプロフィールを見に行く


大体どちらかでなんとかなるはず。
しかし、それでもボタンが無い場合も。
「読者になる」ボタンの繋がる先
自分のサイトで試してみます。
「読者になる」を押してみると……


URLはこれでした。
「http://blog.hatena.ne.jp/snow0303/www.snow0303.com/subscribe」
他の方の「読者になる」ページも拝見させていただきましたが、同じ構造でした。
「http://blog.hatena.ne.jp/snow0303/www.snow0303.com/subscribe」
赤文字には、はてなのID
青文字には、ブログのドメイン※が入っています。
これを手打ちすれば良いってことですね。
現在のこのページのURLで説明すると、
http://www.snow0303.com/entry/2017/10/23/【お願い】読者登録ボタンを付けよう
の「http://」と最初の「/」の間の部分。
よって、
www.snow0303.com
となるのですが、該当ブログの記事ページではなくトップページ(ホームページ、メインページ)に行った方が分かりやすいです。
トップページのURLから「http://」を省いた部分がドメインです。
http://snow156.hatenablog.com
→snow156.hatenablog.com
http://www.snow0303.com
→www.snow0303.com
ひろしサン (id:ex02xx)の記事を拝見したところ、
http://blog.hatena.ne.jp/hatenasupport/ドメイン/subscribe
でも、大丈夫なようです。
こちらの方がドメインだけで良いので楽ですね。IDがわからなくも大丈夫だし。
Everyday is like Sunday
とは言え、やっぱり一手間かかってしまう。
「読者になる」ボタンを設置しよう
一番簡単
はてなサンが用意してくれているので、コピペするのが一番簡単。
ダッシュボード→設定


詳細設定→読者になるボタンの赤枠内をコピー


本文内に張り付けるとこんな感じ。
読者さんが少ないのは気にしない。気にしない。
自作したい
カスタマイズでお世話になっている方々の「読者なる」ボタンのカスタマイズ記事をご紹介。
シンプルなボタン
シロマサン (id:shiromatakumi)
http://www.notitle-weblog.com/entry/2015/12/18/165017NO TITLE
awaサン (id:buchibuchi4647)
英語とappleとDIYと
Twitterなどのボタンも一緒に
ゆきひーサン (id:ftmaccho)
Yukihy Life
私の
私が使っているボタンはこちらの記事で紹介しています。
フォローボタンをカスタマイズ
このボタンを作る際に参考にさせていただいたサイトがこちら。
じょーじサン (id:george-gogo) の記事
http://georges.hatenablog.jp/entry/blog-custom15急がば 急いでまわれ!
↑
こちらのサイトは消してしまったようです(泣)
スマホ版のCSSを書く際の注意
<style type="text/css">と</style>の間にコードを入れてください。
例えば
見出し用のコード
</style>
見出し用のコード
今回のフォローボタンのコード
</style>
詳しくは→こちら
ここでは紹介しきれないほどたくさんの方がカスタマイズ方法を紹介してくださっていますので、
「はてなブログ 読者になるボタン カスタマイズ」
で検索してみましょう。
なるべく多くの方が設置してくれることを願っております。