My Photo

« PL/pgSQL その2 | Main | Facebookで自分の過去の投稿やいいね!を見る »

September 08, 2014

ソーシャルボタンの設置方法

tweetボタンやいいね!ボタンなどのソーシャルボタンをテスト用ページに設置してみた。
はてブのボタンまではレイアウトとか意識せずに並べて記述したら横に並んでボタンが表示されたが、Pocketのボタンだけなぜか改行されて左端に表示されてしまう。よくわからないのでとりあえずCSSで "foat: left;" なdiv要素でボタン毎にくくって横並びにした。

テスト

以下、ソーシャルボタンの設定方法について参考リンク。


tweetボタン(twitter)

まぁなんだ…その…あれだ ブログに色々なボタンを設置してみた。「Twitterツイートボタン」編
Twitterボタン | About


いいね!ボタン(Facebook)

Facebook「いいね!」ボタンをBlogに設置する方法 | nanapi [ナナピ]
Like Button


+1ボタン(Google+)

+1 ボタン - Google+ Platform — Google Developers


はてなブックマーク

はてなブックマークボタンの作成・設置について - はてなブックマーク


Pocektボタン(Pocket)

Pocket は一言で言えば「後で読む」サービス。

【連載】バルーン型のソーシャルボタンをブログに設置する方法。 (4)Pocket編 - Hike×Hack
Pocket for Publishers: Pocket Button


ソーシャルボタンをまとめて設置する方法

ソーシャルボタンを1つずつ設置するのではなくまとめて設置する方法もある。しかし、下記の参考サイトに書いてある方法はサービスを利用するためにアカウントの新規作成が必要(忍者ツールズ)、Pocketのボタンに対応してない(他の2つ)という理由で使わなかった。

いろんなソーシャルボタン(SNSボタン)をまとめて簡単に設置する方法|厳選!フリーツール

« PL/pgSQL その2 | Main | Facebookで自分の過去の投稿やいいね!を見る »

「ウェブログ・ココログ関連」カテゴリの記事

「パソコン・インターネット」カテゴリの記事

プログラミング、技術情報」カテゴリの記事

Comments

Post a comment

(Not displayed with comment.)

TrackBack

TrackBack URL for this entry:
http://app.cocolog-nifty.com/t/trackback/26461/60284708

Listed below are links to weblogs that reference ソーシャルボタンの設置方法:

« PL/pgSQL その2 | Main | Facebookで自分の過去の投稿やいいね!を見る »

March 2017
Sun Mon Tue Wed Thu Fri Sat
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31  
無料ブログはココログ

日本blog村

  • にほんブログ村 IT技術ブログへ
  • にほんブログ村 アニメブログへ
  • にほんブログ村 サッカーブログ アルビレックス新潟へ

好きな音楽家

メモ

XI-Prof