PinterestとInstagramのボタンを追加

いつからかわかりませんが、利用しているWordPressのプラグイン「Share This」にPinterestとInstagramのボタンが追加になっていたので、追加してみました。
sharethis20130426
(画像をクリックすると拡大画像を表示します。)

各エントリー下のボタンが以下のようになりました。(下記は画像です。)
sharethis20130426-2

Pinterestボタンをクリックすると以下のようにPinterest投稿画面が開きます。
sharethis20130426-3
(画像をクリックすると拡大画像を表示します。)

Instagramボタンの方は残念ながらクリックしても投稿できるわけではなく、Feedページが開くのみです。Instagramはスマホからの投稿しかサポートしていないので、スマホでアクセス時しかこのボタンは意味がないようです。
sharethis20130426-4
(画像をクリックすると拡大画像を表示します。)

スマホでアクセス時はプラグインWPtouchでスマホ対応の表示するようにしているので、ShareThisのボタンが表示されるのか心配でしたが、個別エントリーページを開いた際にはちゃんと表示されておりました。
Screenmemo_share_2013-04-26-23-10-45
(画像をクリックすると拡大画像を表示します。)

Instagramボタンをタップしてみたら・・・
Screenmemo_share_2013-04-26-23-14-04
(画像をクリックすると拡大画像を表示します。)

orz…

ダメじゃん、、、

My関連エントリー
ShareThisボタンを変更 at 2011.10.06
ShareThisボタンのカスタマイズ at 2011.09.03
ShareThisボタンがバージョンアップ at 2011.08.25
ShareThisボタンを設置 at 2011.08.14

ShareThisボタンを変更

WordPress PluginのShareThisボタンでもボタンの表示形式をいくつか選択できるようになっていたので、アイコンだけのタイプに変更してみました。

変更前

変更後

いい感じになったんだけど、FacebookのLikeボタンとGoogle+の+1ボタンの間が空いてしまう理由がわからない、、、
ちなみに、以前全角空白を入れたのはもう解除されてるっぽい。どうも「いいね」が「Like」に変わった時点で、個人的に入れていた全角空白はなくなったけど、Google+との間が空いてしまうようになってしまっていた模様。

My関連エントリー
ShareThisボタンのカスタマイズ at 2011年9月3日
ShareThisボタンがバージョンアップ at 2011年8月25日
ShareThisボタンを設置 at 2011年8月14日

ShareThisボタンのカスタマイズ

このブログの個別エントリーページにおいて、ShareThisボタンの「+1」ボタンと自分が個別に設置していた「+1」ボタンの2つが表示されていました。

ShareThisボタンはWordPressプラグインを利用していたのですが、そのカスタマイズを行う場所をやっと見つけました(^^;
Plugin一覧の「ShareThis」の下記をクリック。

表示されたページの中の下記のチェックをはずすと「+1」ボタンをはずせます。

「+1」ボタンが1つになりました。

あぁ、でもこれだと、個別エントリーページでは「+1」ボタンが表示されるけど、トップページでは表示されなくなってしまうなぁ。。。
ということで、ShareThisボタンの「+1」ボタンを生かし、自分が個別に設置していた「+1」ボタンの方をはずすことにしました。

そういえば、「+1」ボタンでGoogle+に共有できるようになったので、Google+の「Share」ボタンもいらなくなったなぁ、ということでついでにはずしました。

すっきりした感じ。
あとは、ボタンの重なりを何とかしたいなぁ。。。

先ほどのShareThisボタンのカスタマイズのページの以下の箇所で、Facebookの「いいね!」ボタンとGoogleも「+1」ボタンの間に全角の空白を挿入してみました。

結果・・・

うまくいったようです。
あとは「いいね!」ボタンの右端がちょん切れているのを・・・

My関連エントリー
外部+1ボタンでGoogle+に共有可能に at 2011年8月26日
ShareThisボタンがバージョンアップ at 2011年8月25日
ShareThisボタンを設置 at 2011年8月14日
Google+の共有ボタンを設置 at 2011年8月10日
「Google+1」を設置 at 2011年6月3日

ShareThisボタンがバージョンアップ

WordPressプラグインの「ShareThis」ボタンを設置しておりましたが、バージョンアップによって見た目が変わりました。

変更前

(上記は画像です。)

変更後

(上記は画像です。)

前と比べるといい感じになったのですが、「いいね!」と「+1」ボタンが重なっているのがとーっても残念。。。

My関連エントリー
ShareThisボタンを設置 at 2011年8月14日

ShareThisボタンを設置

様々なサービスへの共有が行える「ShareThis」ボタンを設置してみました。
WordPressの場合はプラグインが用意されており、それをインストールして有効化すればOKです。

各エントリーの記事の下の以下のようなボタンです。

(上記は画像です。)

Facebookボタンを押すと、以下のようなFacebookの投稿画面が開きます。

Facebookに投稿されました。

(一部ぼかしを入れています。)

Twitterボタンを押すと以下のように表示されます。

Twitterに投稿されました。

(画像をクリックするとTwitterの個別Tweetページを表示します)

メールボタンを押すと以下のような表示に。

メールの確認は省略。

Shareボタンを押すと以下のような表示に。

右下の「More」をクリックするとさらに多くのサービスが。

残念ながらまだ「Google+」はありませんが、そのうちサポートされるものと思われます。
試しに「LinkedIn」に投稿してみました。
無事投稿されました。

中々便利なボタンですが、ブログの表示がますます重くなってしまったような・・・

Tumblr「あたしンちのおとうさんのtumblr」にも設置してみました。
こちらはテーマに生成したHTMLコードを貼り付ける必要がありますが、多少カスタマイズできるので、小さなボタンにしてみました。

 
Tumblrのテーマの編集箇所をメモ。
/head の前に下記赤字を追加。

<script type=”text/javascript”>var switchTo5x=true;</script><script type=”text/javascript” src=”http://w.sharethis.com/button/buttons.js”></script><script type=”text/javascript”>stLight.options({publisher:’f6317d17-d4d7-4d87-9f48-ad43485e47bb’});</script>
</head>

/block:Link と block:Date の間に下記赤字を追加。

{/block:Link}
<span st_url='{Permalink}’ st_title='{Title}’ class=’st_twitter’ ></span><span st_url='{Permalink}’ st_title='{Title}’ class=’st_facebook’ ></span><span st_url='{Permalink}’ st_title='{Title}’ class=’st_evernote’ ></span><span st_url='{Permalink}’ st_title='{Title}’ class=’st_delicious’ ></span><span st_url='{Permalink}’ st_title='{Title}’ class=’st_hatena’ ></span><span st_url='{Permalink}’ st_title='{Title}’ class=’st_email’ ></span><span st_url='{Permalink}’ st_title='{Title}’ class=’st_sharethis’ ></span>
{block:Date}