2014年8月23日土曜日

複数のソーシャルボタンをまとめて設置するShareThisの使い方

以前はFacebookやTwitterなどの複数のソーシャルボタンを個別に貼り付けていました。しかし、ブラウザによってはきれいに並ばないので、手間のわりに報われません。そこで、海外のウェブサイトでよく見かけるShareThisを使うことにしました。

Facebookの「いいね」ボタン、Twitterの「ツイート」ボタンなどの複数のソーシャルボタンを簡単に貼れて、きれいに並ぶ非常に便利なツールです。ここでは、Bloggerを例にShareThisの使い方をまとめます。

ShareThisにアクセスして[Get the code - it's free!]ボタンをクリックします。

ソーシャルボタンを貼り付けるプラットフォームを選びます。

ソーシャルボタンのスタイルを選びます。

[Selected Services]欄から要らないボタンを[Sharing Buttons]にドラッグ&ドロップします。

追加したいボタンを[Sharing Buttons]または[Other Social Plugins]から[Selected Services]にドラッグ&ドロップして[Get the Code!]をクリックします。[Search]にSNS名を入れてボタンを検索することもできます。
[Search]にSNS名を入れてボタンを検索することもできます。このブログには[Other Social Plugins]から[Facebook Like(いいね)]と[Google +1]を追加し、[Sharing Buttons]から[hatena]で検索して「はてなブックマーク」を追加しています。

SNSのボタンをクリックしてSNSに連携させるか、メールアドレス、パスワードを入力するかして、[Create Account]でShareThisのアカウントを作ります。

[Code section]からコードをコピーします。

Bloggerの管理画面にアクセスして「レイアウト」のフッターかどこかに「ガジェットを追加」します。

[HTML/JavaScript]を選んで[+]をクリックしてから、「HTML/JavaScriptの設定」画面の「コンテンツ」にコードを貼り付けます。「タイトル」はブランクのままで「保存」します。
↓このように複数のソーシャルボタンがまとめて貼り付けられます。

0 件のコメント:

コメントを投稿