はてなブログのSNSシェアボタンは、デフォルトだとデザインがバラバラで統一感がないのでカスタマイズしました。今回も先人の知恵をお借りしてシェアボタンを記事上と記事下に表示できるようにさせてもらいました。
参考にさせて頂いたのはこちら↓↓↓の記事です。
SHIROMAさん、ありがとうございます！
最初はSHIROMAさんの記事からそのままコピペをさせてもらったのですが、私のブログでは、はてブとfacebookとtwitterの３つにしたかったので、少し変更をしました。仕上がりは下のような感じです！
SHIROMAさんコードなのでここではコピーできる形で掲載しておりません。SHIROMAさんのサイトへ訪問してくださいね。SHIROMAさんのサイトには１０種類のデザインがあります。
ここからは、私が設定した手順です。
SNSシェアボタンのカスタマイズ
１ 気に入ったデザインのHTMLをコピー。
※これは画像です。コードはSHIROMAさんのサイトへ！
２ 自分のブログの管理画面からデザイン→記事→記事上（記事下）へ進み貼り付ける。
３ 使わないボタンのコードを削除する。
４ CSSのコードをコピーする。コードはSHIROMAさんのサイトで！
５ デザインCSSに貼り付け数値を変更する。私の場合はボタンを３つにしたので３３％に変更しました。
６ 不要なコードを削除する。
以上の設定でSNSボタンが表示されました！
だがしかし！新たな問題が発生！その対処方法もSHIROMAさんのサイトで教えて頂きました。
次回へ続きます！
コメント