SNSシェアボタンをオリジナルで設置する
| HTML/CSS/PHP、JavaScript今回はSNSのシェアボタンの設置方法です。
設置するSNSのシェアボタンは、Twitter、Facebook、LINEが最近はおおいので
それらについて書いていきやす。
Facebook シェアボタン
公式
シェアボタン – ソーシャルプラグイン – ドキュメンテーション – Facebook for Developers
手なわけで自分の好きなようにできるかたちですね。
オリジナル
<a href="http://www.facebook.com/share.php?u=URL">シェア</a>
- URLにアドレス
Twitter ツイートボタン
公式
オリジナル
<a href="https://twitter.com/share?url=URL&text=本文&hashtags=ハッシュタグ">ツイートする</a>
- URLにアドレス
- 本文に本文
- ハッシュタグにハッシュタグ(複数の場合は(,)カンマ区切り
LINE 送るボタン
公式
オリジナル
<a href="https://social-plugins.line.me/lineit/share?url=URL">LINEで送る</a>
- URLにアドレス
公式
Pocket for Publishers: Pocket Button
オリジナル
<a href="http://getpocket.com/edit?url=URL&title=本文" rel="nofollow noopener" target="_blank">Pocket</a>
- URLにアドレス
- 本文に本文
はてなブックマーク
公式
オリジナル
<a href="http://b.hatena.ne.jp/add?mode=confirm&url=URL&title=本文" target="_blank" rel="nofollow noopener">はてブ</a>
公式のボタンを使えば多分仕様とかの変更にも対応できたりするんだろうと思うんですが、統一性の問題があるので何かしら、いじらないとってイメージです。
僕はオリジナルつかってFontAwesomeとかのアイコンつかえるのが楽で良いですね。
(FontAwesomeのLINEのはなんか周りに白がでてめんどうでしたw)