【一番簡単/はてなブログカスタマイズ】PC版とスマホ版にフォローボタンを表示する方法まとめ

はてなブログのフォローボタンのやり方を解説しているブログはいろいろありますが、TwitterとかFacebookとかのボタンだけでいろんなSNS網羅していないブログばっかだしYouTubeとSpotifyのフォローボタンを作りたかった私は全然参考にならず。

 

しかも、どれもやり方がまじでめんどくせえ(作れないくせに)しデザインが私的にすごく微妙。

フォローボタンってリンク貼るようなやり方だけじゃだめなんだね(URLだったりアカウント名だったりでサイトによって違ってくる)

他のブログ参考にしても結局SNSによってボタンの作り方が違うから、ぜんぜん貼れない!!!!つらい!!!!

 

もっと良いデザインでURL書くだけでさくっとフォローボタン作れないかなーと必死にぐぐったらやっとこすばらしい作り方を解説しているブログ様を発見。こちら。

goo.gl/EHXUz1

色々試しましたが、最も簡単に表示させることができました。各SNSの本人ページのURLを貼り付けるだけ。デザインも一番好きでした。(●^o^●)

そして、ぐぐった中で一番フォローボタンの種類が多かったです。ありがたすぎや。

 

んで、ですよ。

 

スマホ版にも同じようにフォローボタン追加しようと思ってhtmlを貼り付けたんですが、何も表示されない。ナンテコッタ。

 

スマホ版にフォローボタンを表示する方法

CSSはすでにPC版の「カスタマイズ」→「デザインCSS」の場所に記述していたので新しく記述する必要は無いと思っていたのですが、スマホ版にもちゃんとCSSを記述する必要がありました。

玄人の方からするとなんでそんなアホな間違いするんやという感じでしょうねw(●^o^●)

 

でも、スマホ版のカスタマイズの場所に「デザインCSS」って無いんですよね。どこに書けばいいんじゃ。

 

んで、スマホカスタマイズ欄の「ヘッダ」→「タイトル下」にCSSをコピペして貼り付ければいいだけでした。

f:id:HYLE:20170702012358p:plain

ここ。

 

CSSはPC版カスタマイズの「デザインCSS」に貼り付けたやつそのまんまコピペしました。

からの、htmlも全く同じものをフォローボタンを表示させたい場所(記事下とかフッタとか)にコピペしました。