【WP】ソーシャルボタンを設置できる「WP Social Bookmarking Light」の導入方法

wp-social-bookmarking-light

ソーシャルメディアを通じて「いいね」と評価される記事が共有され多くの人に広がることは、第三者から好評を得ている、評判がいいことが多いと思います。

またSEOにおいては、内容が良いものはより上位に掲載されるという考え方があり、ソーシャルメディアで評価されることはSEO対策にも通じるものがあると考えられています。

そこで今回は、ソーシャルメディアに自身の記事を伝播させやすくするために各ソーシャルメディアの「共有ボタン」を簡単に設置することができるWordPressのプラグイン「WP Social Bookmarking Light」の導入方法をご紹介します。

WP Social Bookmarking Light

「WP Social Bookmarking Light」は、固定ページや投稿記事にFacebookやTwitterといったソーシャルメディアの共有ボタン(ソーシャルボタン)を付けてくれるプラグインです。

国産プラグインということもあり、mixiやHatena、nifty といったメディアにも幅広く対応しているのが特徴です。

まずは「WP Social Bookmarking Light」プラグインをインストールして有効化をします。

ソーシャルボタンの表示場所

プラグインが有効化されていると投稿された本文の上、下、または両方にソーシャルボタンが表示されます。

wp-social-bookmarking-light-01

「WP Social Bookmarking Light」は、WordPress上で投稿された本文を表示する「the_content関数」にフックしているので、page.phpやsingle.phpでthe_content()が使われいる場所にソーシャルボタンが表示されるようになっています。

「WP Social Bookmarking Light」を有効化してもソーシャルボタンが表示されない場合、テーマファイル内にthe_content()が使われているのかを確認してみるとよさそうです。

好きな場所にソーシャルボタンを表示させたい場合はテーマファイル内に直接表示するコードを記述します。

<?php echo wp_social_bookmarking_light_output_e(null, get_permalink(), the_title("", "", false)); ?>

このコードを記述する場合「the_content関数」があるとソーシャルボタンが重複してしまうので、一般設定で「none(表示しない)」に設定しておきます。

一般設定

「設定」メニューに「WP Social Bookmarking Light」が追加されていますので、「WP Social Bookmarking Light」の設定画面を開きます。

「一般設定」で表示内容など基本的な項目を設定することができます。

wp-social-bookmarking-light-02

設定名 説明 設定内容
位置 ソーシャルボタンの表示を設定します。
  • Top:本文上に表示する
  • Bottom:本文下に表示する
  • Both:本文上下の両方に表示する
  • None:表示しない
個別記事のみ singleタイプの記事での表示を設定します。
  • Yes:表示する
  • No:表示しない
ページ pageタイプの記事での表示を設定します。
  • Yes:表示する
  • No:表示しない
サービス 表示するソーシャルメディアを設定します。
  • Hatena
  • Facebook
  • Facebook Like Button
  • Facebook Share Button
  • Facebook Send Button
  • Twitter
  • Livedoor Clip
  • BuzzURL
  • @nifty clip
  • Tumblr
  • FC2 Bookmark
  • newsing
  • Choix
  • Yahoo!JAPAN Bookmark
  • Yahoo!Buzz
  • Google Bookmark
  • Google Buzz
  • Google +1
  • Delicious
  • Digg
  • FriendFeed
  • reddit
  • LinkedIn
  • Evernote
  • Instapaper
  • StumbleUpon
  • mixi Check
  • mixi Like
  • GREE Social Feedback
  • atode (toread)
  • LINE
  • Pocket

Styles

「Custom CSS」にスタイルを記述することで表示を調整することができます。

wp-social-bookmarking-light-03

各ソーシャルボタン

表示するソーシャルボタンの設定をすることができます。設定内容はソーシャルメディアによって異なります。

wp-social-bookmarking-light-0

関連記事

【無料】商用利用OKシームレステクスチャ「岩石(花崗岩風)」素材

自然の岩肌を表現したシームレスの無料で使えるテクスチャです。花崗岩のような灰色の岩の質感を再現しています。継ぎ目のないシームレス加工をしているテクスチャです。テクスチャマッピングやタイル敷の背景素材などにお使いいただけます。商用利用OKのフリー素材となっております。 ...続きを読む

2018.09.07シームレステクスチャ

【フォント】サインに最適なフリーのシンボンルフォント

WEBサイトや印刷物のデザインにおいて、メニューやボタン、マップ上のシンボルなどに利用者にわかりやすく内容を伝えるためアイコンを用いることがあります。 ビジュアルで内容を伝えることができるシンボルタイプのフリーフォントをまとめてみました。 Heydings Com...続きを読む

2015.02.14フォント

【デザイン】リアルの花を使った美しいイラストレーションの世界

今回は素敵だなと思ったアーティストさんの作品をご紹介します。表題のとおり、リアルの花や自然のものを使い、美しくかわいらしいイラストレーションの作品を手掛ける Lim Zhi Wei さん。シンガポールを拠点に活動されているアーティストです。 Lim Zhi Wei 彼...続きを読む

2015.02.16インスピレーション

【フォト】吉田町川尻海岸『幸福呼ぶ鳥居~初日の出~』

静岡県吉田町にある川尻海岸では年始の期間限定で『幸福呼ぶ鳥居』がお目見えします。鳥居に朝日が昇る様子は幻想的です。初日の出の日は、多くの方々でにぎわっていました。 フォトギャラリー ※写真をクリックすると拡大表示します。 [gallery link="file" col...続きを読む

2017.01.01フォトギャラリー

【デザイン】デザイナーポートフォリオサイト

活躍しているデザイナーの事例をみてインスピレーションを刺激することは、デザインの勉強にもなります。今回は、デザイナーのポートフォリオサイトを集めてみました。 http://www.onebyfourstudio.com/ http://www.31three....続きを読む

2015.02.14インスピレーション