RECOMEND
You are here: HomeCaseTipsソーシャル連携でワンランク上のブログに

ソーシャル連携でワンランク上のブログに


みなさま、こんにちは。

本日はソーシャルボタンについてお話したいと思います。
先日の日記の最後に、Twitterからフォローボタンがリリースされたことに触れましたが、ソーシャル系のサイトはこのようなボタンを多数公開しています。いまやブログやホームページのいたるところにツイートボタンやいいねボタンを見かけるのではないでしょうか?

そこで今回は各種ソーシャルボタンの機能と設置方法についてご説明します。


Twitter

・ツイートボタン
これは絶対に設置したいボタンです。これをクリックするとそのサイトのタイトルとURLをツイートに表示することができます。いちいち入力する手間が省けますね。

コードはこちらから入手できます。

アイコンの形は三種類から選べます。
tweet1

そして、フォローボタンはこちらから。
ツイッター公式に飛ばずにワンクリックでフォローできるのは嬉しいですね。

Facebook

・いいねボタン
こちらをクリックするとカウントが増え、自分のFacebookウォールにクリック先の情報が表示だれます。

コードはこちらから。
FBアカウントの携帯認証が済んでいないと発行されないのでご注意ください。(自分はここでひっかかりました汗)

こちらもアイコンが三種類選べます。ツイートボタンとおそろいにするといい感じです。likebutton

また、sendボタンも同時に表示するか選択できます。こちらはあまり使っている人見かけないですね。

Showfacesではいいねを押した人のアイコンが表示されます。オンにした場合結構なスペースを占領するのでレイアウトの際は気をつけましょう。

Fontは日本語になってしまうので選択しなくて大丈夫です。

Mixi

日本のSNSからもソーシャルボタンが多数発表されています。

・Mixiチェックボタン

まず、Mixi Developer Centerにアクセス、利用登録を行います。
次にこちらから管理画面にアクセス。mixi Pluginのページでボタンを貼り付けたいサイトの登録を行います。
そうすると識別キーが表示されます。これを使うので「コピーしておいてください。
ここまでが前段階、なかなか大変ですね…

そして、ここでチェックボタンのコードを取得します。
設置方法について詳細に説明されています。やはりこういう時、日本製のサービスは頼もしいですね。ただ、いいねボタンのように自動でコードを表示してくれないの、各自でコードを書き換える必要があります。

とりあえず、よくわからないという人は、テンプレのコードのclass=”mixi-check-button”の後ろにdata-key=”先程コピーした識別キー”を挿入すればOKです。

・Mixiいいねボタン

さて、mixiはチェックボタンに加えていいねボタンも発表しています。インスパイアというやつですね。
こちらの取得方法は幾分か簡単です。
さきぼどの管理画面の下部にコード発行画面があります。ワンクリックて発行されます。

チェックを選ぶかいいねを選ぶかは意見の分かれるところですね。
両者の違いはここで説明されています。
私は、いいねはFBだけで十分だと思ったのでチェックを選びました。

GREE

・Social Feedback

mixiチェックボタンに近い機能のサービスです。

こちらからコードを入手できます。
各項目を選択し、ワンクリックで取得できます。

アイコンはオススメ、いいね、シェアなどいろいろな表示がありますが機能はみな一緒です笑

はてなブックマーク

・はてなブックマークボタン

こちらはツイート、いいねボタンに次いでよく見かけますね。日本のブロガーには根強い人気があるみたいです。
入手はこちらから、とても分かりやすいです。

EVERNOTE

ウェブページや写真、文書など様々なものを保存できる先進的なサービスでいま人気急上昇のEvernoteですがこれもボタンが登場しています。

・Site Memory Button

こちらからアクセス、英語なので少々とっつきにくいですが、基本は他のボタンと一緒です。

ever1

まずアイコンを選び、保存させたいサイトのURLを入力。

ever2

3の項目はオプションなので空欄で特に構いません。4に表示されたコードをコピペすれば完了です。

Google

ついにGoogleもソーシャルボタンを発表しました。
最後にこちらについて説明を。

・+1ボタン
押されることで検索結果やアドワーズに反映されるようなのですが、まだ英語圏で試験的に実施されている状況。
よって日本ではあまり意味がないのですが、とりあえず話の種に設置してもいいのでは。

入手はこちらから

他のボタンと違い、ヘッダ部分にもコードを設置しなくてはいけないので気をつけてください。

以上、ソーシャルボタンの説明でした。
上記すべてを設置しようとするとなかなか骨が折れます。
なのでまずは気に入ったものだけでも試してみるといいかもしれませんね。

 


Comments are closed.