【旧刊】WordPressテーマ制作のみを取り扱った別冊電子書籍がAmazon Unlimitedでお楽しみ頂けます!!
Amazon Unlimited内で 田中勇輔 で検索してください。

☓ 閉じる

6Dec2011

[WordPress]最強のSNSボタンプラグインを更に便利にカスタマイズ

WP Social Bookmarking Light

WP Social Bookmarking Lightのカスタマイズ
ブログをやっている人は誰でも「もっと多くの人に読んでほしい」と思うもの。
そんな時に絶対必要なのがSNSサービスの取り込みですね。

WordPressでは多くのSNS系プラグインが公開されていて、ワンクリックでインストールするだけでブログにSNSボタンを表示する事ができます。
しかし多くのプラグインが海外製のため、日本固有のSNS「mixi」に対応しているものは非常に少ないのが実情です。

今回ご紹介するプラグイン「WP Social Bookmarking Light」はMixiに対応している数少ないプラグインの中の一つで、おそらく日本で必要なSNSのサービスのすべてに対応していると思います。

日本のWordPressユーザーに最もオススメするSNS系プラグインです。

[追記] この方法は古くなってしまったため、2013年1月9日に別の方法を紹介する記事を書きました。
SNSボタンを任意の位置に表示 WP Social Bookmarking Light

WP Social Bookmarking Lightのインストール

以下のWordPress公式サイトからプラグインをダウンロードします

WP Social Bookmarking Lightのインストール方法

WP Social Bookmarking Light

右上のオレンジのボタンを押してzipファイルをダウンロードします。

WordPressの管理画面の左メニューから「プラグイン-新規追加」を押して、プラグインのインストールの画面を表示します。

検索 | アップロード | おすすめ | 人気 | 最新 | 最近の更新
の中から「アップロード」を選択して先に進みます。

先ほどダウンロードしたzipファイルを選択後「今すぐインストール」を押すとアップロード完了です。

WP Social Bookmarking Lightの使い方と注意点

インストール後は管理画面の左メニュー「設定」の中に「WP Social Bookmarking Light」という項目が追加されます。

設定画面ではブログに表示したいサービスをドラック&ドロップで直感的に操作できますので、戸惑うことは少ないかと思います。
WP Social Bookmarking Lightの使い方

注意点を1つだけ。

mixiチェックのボタンは「チェックキー」が必要です。
チェックキーを取得する為にはmixi Developer Centerでデベロッパー登録をしなければいけません。

WP Social Bookmarking Lightを記事の上下両方に表示させるカスタマイズ

【お知らせ】
ここで紹介するカスタマイズと同じ機能は、2013年9月現在、本家プラグイン自体で対応しています。
そのため、この方法を活用することは今後ないでしょう。。。
公開後2年経過しましたが、いまだにアクセス数の多い記事なので、一応残しておきます^^;

では本題のカスタマイズについて。

WP Social Bookmarking Lightでは記事本文の上か下、どちらか一方にしかSNSボタンを表示させる事ができません。
そこでプログラムのコードをちょこっと変更して上下両方にSNSボタンを表示させるカスタマイズを行いましょう。

【超注意事項】
※ソースコードにバグが生じるとWordPressの管理画面にログインできなくなる可能性があります。ブラウザからしかアクセスできない場合は「間違えて変更したら二度と直せない状況に陥る」可能性もあります。
WordPressのソースを変更する行為はFTPソフトでサーバー上のファイルを直接書き換えられる方しかやってはいけません。
ブラウザからしかアクセスできない初級者の方は「どうしても上下に表示したいんだ!!その為にはどんな犠牲でも払ってやる!!」という熱い思いが無い限りソースコードは変更しないでください

カスタマイズの目的: 
表示位置の選択ボックスに「Both(両方)」を加えて、設定画面から簡単に「上・下・上下・無し」と切り替えられる様にする。

カスタマイズ1:
以下のファイルを開く
plugins/wp-social-bookmarking-light/modules/content.php

137行目付近

 if( $options['position'] == 'top' ){
        return "{$out}{$content}";
    }
    else if( $options['position'] == 'bottom' ){
        return "{$content}{$out}";
    }

以下に変更

if( $options['position'] == 'top' ){
        return "{$out}{$content}";
    }
    else if( $options['position'] == 'bottom' ){
        return "{$content}{$out}";
    }
    else if( $options['position'] == 'both' ){
        return "{$out}{$content}{$out}";
    }

カスタマイズ2:

以下のファイルを開く
plugins/wp-social-bookmarking-light/modules/admin.php

291行目付近

<select name='position'>
<option value='top' <?php if( $options['position'] == 'top' ) echo 'selected'; ?>>Top</option>
<option value='bottom' <?php if( $options['position'] == 'bottom' ) echo 'selected'; ?>>Bottom</option>
<option value='none' <?php if( $options['position'] == 'none' ) echo 'selected'; ?>>None</option>
</select>

以下に変更

<select name='position'>
<option value='top' <?php if( $options['position'] == 'top' ) echo 'selected'; ?>>Top</option>
<option value='bottom' <?php if( $options['position'] == 'bottom' ) echo 'selected'; ?>>Bottom</option>
<option value='both' <?php if( $options['position'] == 'both' ) echo 'selected'; ?>>Both</option>
<option value='none' <?php if( $options['position'] == 'none' ) echo 'selected'; ?>>None</option>
</select>

カスタマイズ結果と注意点

このカスタマイズで、以下のように設定画面の「位置」に「Both」が追加されます。
WP Social Bookmarking Lightを上下両方に表示させる

このブログは現在(2011.12.06) 上記方法で記事の上下にSNSボタンを表示させています。

テンプレートによってはトップページなどの”記事の抜粋が一覧表示される画面”でも、各々の上下にSNSボタンが表示されて大変ウザイ感じになります。
その場合は、設定画面「個別記事のみ」を「YES」にする事でトップページには表示されなくなります。

関連記事