AirLife Blog

人生の活動記録。ヘリコプターを始め航空関連を中心に日常で感じた事や健康・書評・音楽・映画・食レポなどの情報発信。調べごとや思考したことをOUTPUTしていきます。役立つ情報を共有できることが喜び。

ブログにSNSシェアボタンを設置する2つの方法(はてなブログ)

ブログのアクセス数を増やすためにSNSは欠かせないツール。
そこで、はてなブログにSNSシェアボタンを設置する方法を紹介する。
1つ目は、はてなブログ標準の機能を使って簡単に設置する方法
2つ目は、アイコンをカスタマイズして設置する方法
標準のSNSシェアボタンに物足りなさを感じたら、2つ目の方法を試して欲しい。

はてなブログ標準の機能で簡単に設置する手順

設置イメージ

f:id:r246toshi:20191203131533p:plain

1.ダッシュボードから「デザイン」をクリック

2.「カスタマイズアイコン」をクリック

3.「記事」をクリック

4.ソーシャルパーツの下記6つの中から設置したいものにチェックをつける

  • はてなブックマークボタン
  • Facebook「シェア」ボタン
  • ツイートボタン
  • Tumblr共有ボタン
  • LINEで送るボタン
  • pocket追加ボタン

5.表示設定から「記事上下に表示」 or「記事下にのみ表示(デフォルト)」を選択する(※記事上下に表示がオススメ)

6.「変更を保存する」をクリック

 

アイコンをカスタマイズして設置する方法

設置方法は色々あり、アイコンのデザインも自分好みに変えることが可能な方法となりますが、一からCSS等を自分で作成するのはハードルが高過ぎます。
そこで、既にSNSシェアボタンを作成して頂いている記事がありますので、参考にしてコピペでサクッと対応しましょう。
紹介させて頂く記事は、沢山ある方法や記事の中で、私自身が一番参考になり実際に私のブログでも採用させてもらっている方法です。

設置イメージ(記事上)

f:id:r246toshi:20191203133941p:plain

設置イメージ (記事下)

f:id:r246toshi:20191203131923p:plain

下記5つのSNSシェアアイコンを設置できる

  • はてなブックマーク
  • Facebook
  • Twitter
  • Pocket
  • LINE

<参考記事>

www.secret-base.org