TwitterやFacebook、Google+の投稿ボタン

TwitterやFacebook、Google+などソーシャルメディアからのアクセス数は凄まじい物になっています。SMOを勘違いしている人も多いのですが、良い記事を書いても埋もれてしまってはもったいないので、少しでも拡散する可能性を高めるにSNSの投稿ボタンを設置しておきましょう。

当サイトでも記事の上下にTwitterやFacebook、Google+のボタンを設置していますが、WordPressのプラグインを使えば誰にでも簡単に設置することができます。

こんな感じで、ボタンを並べることができます。当サイトのように全く拡散していないと悲しいことになるのですが、気にせずにとりあえず設置して、良い記事を書きましょう。

はてな、Yahoo、livedoor、Buzzurlなどのソーシャルブックマークボタンを設置したい場合は、WordPressにソーシャルブックマークボタンを設置するをご覧ください。

WP Social Bookmarking Lightの設定

»WP Social Bookmarking Light

  • 位置:設置する位置をTop、Bottomで選択
  • 個別記事のみ:Noにするとトップページにも載る
  • ページ:Yesにすると固定ページにも載る
  • 上下の間隔:ボタンの上下に余白を設けたい場合は数字を選択
  • 整列:ボタンを左揃えにするか右揃えにするか
  • サービス:設置したいボタンをドラッグ&ドロップする

設定画面が全て日本語になっていますので、特に説明の必要はないと思いますが、TwitterやFacebook、Google+については、細かい設定が出来るようになっています。デフォルトのままでも特に問題はないのですが、気になる人は設定してみましょう。

Twitter

  • Via:自分のTwitterアカウントIDを入力
  • Language:ボタンを日本語にするか英語にするか
  • Count::ツイート数を表示するかしないか
  • Width:横幅
  • Height:高さ

Facebook

  • Locale:ボタンの表記。日本語の場合はja_JP
  • Version:ボタンの表示形式。xfbmlで表示されない場合はhiframeを選択
  • Action:ボタンの種類。いいねの場合はlikeを選択
  • Color Scheme:ボタンの色
  • Send button:送信ボタンの表示
  • Width:横幅
  • Font:フォント

Google+1

  • Button size:ボタンサイズ。mediumにすると他のSNSボタンと同じサイズになる
  • Language:言語設定
  • Include count:+1された数の表示

記事の上下にボタンを設置する

当サイトでは、記事の上下にソーシャルボタンを設置していますが、これはWP Social Bookmarking Lightで上に設置して、下のはsingle.phpにボタン用のコードを直書きしています。

はてな

»はてなブックマークボタンのコードを取得する

当サイトの場合は以下のコードになっています。

<a href="http://b.hatena.ne.jp/entry/" data-hatena-bookmark-layout="standard" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only.gif" 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>

Twitter

»ツイートボタンのコードを取得する

当サイトの場合は以下のコードになっています。

<a href="http://twitter.com/share" data-count="horizontal" data-lang="ja" data-via="pacificus">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

Facebook

»いいねボタンのコードを取得する
»日本語解説記事はこちら

私の環境(Firefox)だとボタンのコードを取得するための画面がうまく表示されませんでしたが、Internet Explorerを使えば大丈夫でした。

当サイトの場合は以下のコードになっています。

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php the_permalink() ?>&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=90" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:40px;" allowTransparency="true"></iframe>

Google+1

»+1ボタンのコードを取得する

当サイトの場合は以下のコードになっています。

<g:plusone size="medium"></g:plusone>

目的別 おすすめレンタルサーバー

コストパフォーマンスが高いレンタルサーバー
WordPress向け
法人レンタルサーバー
激安料金

管理人イチオシのレンタルサーバー

当サイトでも使っているエックスサーバーは、ディスク容量が200Gと大きく、MySQLが50個まで使えますので、1つの契約でいくつものサイトを運営することができます。

転送量が月2,000G、メモリ192Gと他の格安サーバーでは見られないスペックとなっており、アクセス数の多いサイトや複数のWordPressサイトを運営するのにも向いています。

自動バックアップと電話サポートが付いているので、初心者の方でも安心!

エックスサーバーの無料お試し申し込みはこちら

公開日:2011年11月22日
最終更新日:2013年12月4日

カテゴリー:WordPressのプラグイン WordPressの使い方

コメント

コメントは受け付けていません。

このページの先頭へ