WordPress | はてなブックマークの共有ボタンの追加方法

こんばんは、tapunです。

まだブログを初めて1週間なので、いろいろ試行錯誤しているのですが、WordPressにデフォルトでついているSNS共有機能では、「はてなブックマーク」が選択できないことに不満をお持ちの方はいませんか？

確かに日本を中心に使われているサービスですが日本国内においては便利なサービスなので、ぜひ共有ボタンに追加したい！ということで、追加しました～。

記事の下部につける共有ボタンと、記事の上部につけるボタンそれぞれのつけ方を解説します！

記事の下部につける[はてブ]ボタン

一般的にSNS共有ボタンは記事が終了したところ（下部）につけるのが効果が高いといわれています。

WordPressのデフォルトの共有ボタンも、記事の下部に挿入されます。

はてなブックマークのSNSボタンのソースを取得します。
こちらのページではてなブックマークボタンのソースを取得できます。
> はてなブックマークボタン
こちらの画面ショットを参考に、はてなブックマークボタンを作成します。
※URLとタイトルは後ほど書き換えるので、図のようにあとから分かりやすい文言を入れておきます。
右側に表示されたソースコードをメモ帳などにコピペします。

<a href=”http://b.hatena.ne.jp/entry/★テストアドレス★” class=”hatena-bookmark-button” data-hatena-bookmark-title=”★タイトル★” data-hatena-bookmark-layout=”simple-balloon” title=”このエントリーをはてなブックマークに追加”><img src=”https://b.st-hatena.com/images/entry-button/button-only@2x.png” alt=”このエントリーをはてなブックマークに追加” width=”20″ height=”20″ style=”border: none;” /></a><script type=”text/javascript” src=”https://b.st-hatena.com/js/bookmark_button.js” charset=”utf-8″ async=”async”></script>
WordPress管理画面で[設定]-[共有]メニューにアクセスします。
共有ボタンのところにある[新サービス追加]を押します。
先ほどコピペしたソースを一部改変して登録します。
サービス名：　はてな（任意です）
共有URL：　http://b.hatena.ne.jp/entry/★テストアドレス★　
　　　　　　　　の★テストアドレス★を%post_full_url%に変えます。
アイコンURL：　https://b.st-hatena.com/images/entry-button/button-only@2x.png
そうすると”利用可能なサービス”に”はてな”が追加されるので、そのボタンを
下の”有効化済のサービス”にドラッグしてください。
設定を保存して、完了です。