Tweet Like Google +1 and Share

Tweet, Like, Google +1 and Shareは、Twitter、Facebook、Google+のソーシャルメディアのシェアボタン(共有ボタン)を自分のWebサイトに簡単に表示できるWordPressプラグインです。縦表示の共有ボタンやスクロール表示する共有ボタンも利用できます。

このWPプラグインはインストールして有効にするだけで簡単に利用できます。初期設定は簡単です。

共有ボタンは最大5個まで表示できます。カスタムボタンを1個追加できるので、はてなブックマーク等の共有ボタンを追加することもできます。

はじめに

このプラグインが優れている点

  1. Twitter、Facebook、Google+のソーシャルメディアのシェアボタン(共有ボタン)を利用できる。
  2. 共有ボタンの表示位置は、記事の上部、記事の下部、フローティング・サイドバーに対応している。
  3. テンプレートを編集しなくても表示位置や設定を変更できる。
  4. カスタムの共有ボタンを追加できる。
  5. OGP(Open Graph Protocol)のタグを出力できる。

共有ボタンの見本

大きい共有ボタン(縦表示)

大きい共有ボタンを記事の上部又は下部に配置した場合の表示例です。

tls_img01

小さい共有ボタン

小さい共有ボタンを記事の上部又は下部に配置した場合の表示例です。

tls_img01e

スクロールして追尾する共有ボタン

スクロールして追尾する共有ボタンを利用した場合の表示例です。画像を見て分かる通り、表示範囲から少しはみ出し、表示が少し崩れています。正直言って、微妙です。

tls_img01c

インストール方法

管理画面から検索してインストールして下さい。もしくは、WordPress.org からダウンロードし、アップロードしてインストールして下さい。

  1. WordPress管理画面 > プラグイン > 新規追加 >「Tweet, Like, Google +1 and Share」で検索
  2. WordPress.org からダウンロード

管理画面の設定

Tweet, Like, Google +1 and Shareは、インストールして有効にすれば、初期設定のままでも利用できますが、必要に応じて設定を変更しましょう。

管理画面の場所

管理画面は下記の場所にあります。

WP管理画面 > 設定 > Tweet Like Plusone

Tweet, Like, Google +1 and Shareの管理画面

tls_img

カスタムボタンに「はてなブックマーク」を追加する方法

カスタムボタンに「はてなブックマーク」を追加するサンプルコードを紹介します。使用する際は、下記のコードをコピペして貼り付けて下さい。

共有ボタンに「はてなブックマーク」を追加した例

Large button Code

<a href="http://b.hatena.ne.jp/entry/%%URL%%" class="hatena-bookmark-button" data-hatena-bookmark-title="%%TITLE%%" data-hatena-bookmark-layout="vertical-balloon" data-hatena-bookmark-lang="ja" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only@2x.png" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a><script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script>

Small button Code

<a href="http://b.hatena.ne.jp/entry/%%URL%%" class="hatena-bookmark-button" data-hatena-bookmark-title="%%TITLE%%" data-hatena-bookmark-layout="standard-balloon" data-hatena-bookmark-lang="ja" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only@2x.png" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a><script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script>

メモ

Webサイトのディレクトリ名に日本語の文字を利用している場合は、URLエンコードが必要です。URLエンコードを利用する場合は、「%%URL%%」の部分を「%%EURL%%」に変更して下さい。

参考

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

まとめ

Tweet, Like, Google +1 and Shareは、ソーシャルメディアの共有ボタンを自分のWebサイトに簡単に表示できるプラグインです。縦表示の共有ボタンやスクロールして追尾する共有ボタンが利用できます。設定が簡単なので活用しましょう。

もし、もっと多くのソーシャルメディアの共有ボタンを表示させたい場合は、「WP Social Bookmarking Light」のプラグインを試してみて下さい。いろいろ試してみて、自分のWebサイトに合うものを探してみましょう。

スポンサーリンク