東京都府中市のWeb制作会社が運営するブログです。

2016.11.28

chie

簡単に設定したい!人気SNSのデフォルトボタンをまとめてみました!

  • このエントリーをはてなブックマークに追加

こんにちは!Maromaroのchieです。
26日、27日はデザインフェスタvol44でしたね!去年は見に行ったのですが、今年は体調不良で行くことができなく残念です・・・。

さて今回は、SNSのデフォルトボタンについてまとめてみました。
まとめ系のサイトは結構多くあるにはあるのですが、私が欲しかった情報はどんな種類のデフォルトボタンがあるのか?
ということで、ちょうど調べる機会もあったのでまとめてみました。

どこのSNSでもデフォルトボタンを使用するには、公式の構成ツールを使用するのが一番簡単!
構成ツールで必要なことを選択し、生成されたコードをHTMLに貼付けるだけです。
プレビューも表示されるのでとってもわかりやすいですね。

Facebook

「いいね!」、「シェア」ボタン(ウェブ用)

facebook

アクションタイプ[like]の場合は「いいね」ボタン

facebook_like

アクションタイプ[recommend]の場合は「おすすめ」ボタン

「いいね」の部分が「おすすめ」になります。
facebook_recommend

ボタンのサイズ

small と large があります。
facebook_size

>>Facbook公式の構成ツール

「いいね」ボタンだけを表示したい場合は、レイアウトを「button」にし、シェアボタンを追加のチェックを外せばシンプルな「いいね」ボタンだけになりますよ!

Twitter

「リンクを共有する」、「フォローする」、「ハッシュタグ」、「@ツイート」ボタン

twitter

ボタンの種類

twitter_bt

ボタンのサイズ

(大) があります。

twitter_size

>>Twitterの公式構成ツール

よく聞かれるのがTwitterボタンのシェア数表示についてなのですが、デフォルトでのシェア数の表示は廃止されてしまいました。

LINE

「LINEで送る」ボタン

line

ボタンの種類

line_size

>>LINEの公式構成ツール

LINEはシンプルな設定のみで、サイズの選択もツールではないので、変えたい場合は自分で数値を設定する必要があります。

Google+

「Google+」ボタン

g

ボタンの種類

g_button

ボタンのサイズ

g_size

>>Google+の公式構成ツール

Google+はボタンのサイズが豊富です!

はてなブックマーク

「はてなブックマーク」ボタン
hatena

ボタンの種類

hatena

>>はてなブックマークの公式構成ツール

Pocket

「Pocket」ボタン

pocket

ボタンの種類

pocket

>>POCKETの公式構成ツール

まとめ

各サービスによって、ボタンの種類やサイズもいろいろですが、基本的には選択して生成されたコードをHTMLに貼付ければ良いだけなので、簡単にボタンを設定できますね!

SNSボタンについては、カスタマイズされている方も多くいますが、まずはデフォルトボタンで気軽に設定してみるのもオススメです!

SNS系記事が気になる方はこちらもおススメ!

  • このエントリーをはてなブックマークに追加