wp-hatena 拡張版

初出日: 2011年1月5日 | 最終更新日: 2012年2月12日
投稿者: hibiki | パーマリンク

概要

wp-hatena の拡張版です。

WordPress の各エントリに、以下のようなボタンをつけることができます。

  • はてなブックマーク
  • はてなブックマークのブックマーク数をテキスト表示
  • はてなブックマークのブックマーク数を画像表示
  • del.icio.us
  • Livedoorクリップ
  • Yahoo!ブックマーク
  • FC2ブックマーク
  • ニフティクリップ
  • POOKMARK Airlines
  • Buzzurl
  • Choix
  • newsing
  • Evernote Clip
  • Facebook いいね！
  • Facebook シェア
  • Twitter でつぶやく
  • mixi チェック※
  • Instapaper に保存
  • Read It Later に保存
  • Google +1
  • Pinterest

ダウンロード

wp-hatena-extended1.3.zip

インストール

plugins ディレクトリに“wp-hatena” ディレクトリを作成し、その中にプラグインファイルを格納してください。
"wp-hatena" ディレクトリ内の "img_sample" にサンプルのアイコン画像を入れてありますので、初回のみ、"img_sample" ディレクトリを "img" とリネームしてアップしてください。

使い方

1. WordPress の管理画面より wp-hatena を有効化します。
2. お使いの WordPress テーマの ** エントリ表示部分 ** の任意の位置に次のコードを追加します。

はてなの場合 :

<?php global $wph; if(isset($wph)) $wph->addHatena(); ?>

del.icio.us の場合 :

<?php global $wph; if(isset($wph)) $wph->adddelicious(); ?>

その両方を隣り合わせて挿入する場合（例） :

<?php global $wph; if(isset($wph)) {
    $wph->addHatena();
    $wph->adddelicious();
}?>

全部を挿入する場合（例）：

<?php global $wph; if(isset($wph)) {
    //はてブ　管理画面から表示タイプを選択可能
    $wph->addhatena();
    //はてブのブックマーク数をテキスト表示（独自アイコン利用時のブックマーク数表示などに）
    $wph->addHatenaCountTxt();
    //はてブのブックマーク数を画像で表示（よくあるタイプ）
    $wph->addHatenaCount();
    $wph->adddelicious();
    $wph->addLivedoor();
    $wph->addYahoo();
    $wph->addFC2();
    $wph->addNifty();
    $wph->addPOOKMARK();
    $wph->addBuzzurl();
    $wph->addChoix();
    $wph->addnewsing();
    $wph->addInstapaper();
    $wph->addReadItLater();
    //Tweet ボタン　管理画面から表示タイプ選択可能
    $wph->addTweetBtn();
    $wph->addEvernoteClip();
    //Facebook いいね！ボタン　管理画面から表示タイプ選択可能
    $wph->addFacebook();
    $wph->addFacebookShare();
    //mixi チェック　※ ディベロッパーセンターに登録が必要、分かる人向け
    $wph->addMixicheck();
    $wph->addGooglePlusOne();
    $wph->addPinterest();
}?>

mixi チェックは key の取得が必要なため記述しただけでは動きません。後述の内容を参考にしてみてください。

ちょっと一手間かけた使い方

CSS を編集してみる

wp-hatena-extended version0.5 から CSS を同梱する形にしました。
挿入されるボタンのマージン調整がしたい場合、wp-hatena.css を編集してください。

管理画面を触ってみる

wp-hatena-extended version0.6 から管理画面がつきました。
設定画面の設定をしていない場合はデフォルト設定で動きますので問題ありませんが、表示タイプを変えてみたい、等あれば覗いてみてください :)

mixi チェックを使ってみる

1． デベロッパー登録（個人の方） << mixi Developer Center (ミクシィ デベロッパーセンター) でデベロッパー登録
2. mixi Developer Center (ミクシィ デベロッパーセンター) からログイン、Developer Dashboard の mixi Plugin に、「新規サービス追加」の項目からサイトを登録して識別キーを取得
4. 識別キーを wp-hatena.php 内に記述

作者ブログ内記事「wp-hatena 拡張版 0.6 表示タイプ＋mixi チェック使用方法 | Numb.」も参考にしてみてください。

mixi チェックは正直あれこれ登録したりすることになり手間がかかり、お手軽ではないです。

独自アイコンにしてみる

Facebook はボタン以外は、同梱のアイコン画像以外の任意画像に差し替えることも可能です。

使用する画像は plugins ディレクトリ/wp-hatena/img に入れる必要があります。独自アイコンを利用する場合は、"wp-hatena" ディレクトリ内に "img" ディレクトリを作成して、中に任意のアイコンを入れてください。

差し替え画像は、"img_sample" ディレクトリ内の画像形式（gif or png）に沿って作成してください。サイズは自由です。
独自アイコンを利用する場合、はてなブックマークと Tweet ボタンの表示形式は「シンプル」を選択してください。

mixi チェックを独自アイコンで表示させたい場合、以下の内容を wp-hatena.css に記述してください。wp-hatena のバージョンアップで上書きされるのが困る…といった場合には、利用されているテーマの CSS に記述しても OK です。

/* mixi check */
.wph.mixi-check-button {
    display: inline-block;
    /display: inline;
    width: 30px!important;/* 独自アイコンの横サイズ */
    height: 30px!important;/* 独自アイコンの縦サイズ */
    background: url(./img/mixi.png) 0 0 no-repeat!important;
    /zoom: 1;
}

.wph.mixi-check-button img {
    display: none;
}

スクリーンショット

通常：
wp-hatena06.gif

独自アイコンを使用した例：
wp-hatena06-originalicon.gif

管理画面からそれぞれの表示タイプを選べます：
type.gif

特記事項

本家 wp-hatena に準じます。

本家

hiromasa さんの本家 wp-hatena！
これがなければ拡張版もありませんでした。素晴らしいプラグインを作ってくださった hiromasa さんに感謝！

更新履歴


2012/02/12 1.3 tweet 時に、日本語が URL が含まれてもリンクが切れないようエンコードして出力するよう修正
2012/01/24 1.2 Pinterestに対応、オプションをプラグイン停止で削除せず、アンインストールで削除するように変更
2011/11/11 1.1 各エントリ個別ページ以外でも表示できるように、mixiチェック部分を調整。
2011/08/18 1.0 Google +1 に対応、Facebook いいね！ボタンの下が 1px 切れるのを修正。
2011/01/24 0.9 をかもとさんの改良版をリリース :) 遅延ローディングを行うようになっています。
2011/01/24 0.8 プラグインディレクトリの位置の取得方法を変更
アイコン画像の設置場所を変更できるよう、管理画面にオプションを追加
2011/01/14 0.7 Facebook シェアボタンに対応
2011/01/10 0.6 いくつか対応サービス追加、管理画面がつきました。
addNewHatena() 廃止、addHatena() に統合
2011/01/05 0.5 JSeries 登録、0.5リリース、いくつか対応サービス追加、CSS 同梱になりました

作者のエントリ

wp-hatena 拡張版 0.5 | Numb.

wp-hatena 拡張版 はてブ被リンク数表示バージョン | Numb.

wp-hatena 拡張版に、はてブ被リンク数表示バージョンを追加しました。「合計 10 個の SBS + はてブ被リンク数」を表示することができます。

wp-hatena にさらに追加、合計 10 個の SBS に対応 | Numb.

Choix, newsing に対応しました。

wp-hatena を Livedoorクリップ その他色々対応させてみました | Numb.