WordPress Plugins/JSeries

[よくある質問と答え]

概要

画像だけでなくYouTubeなどの動画サイト、各種動画ファイル、WordpressプラグインVideoPop+で管理している動画ファイルを lightbox 風に表示するためのプラグインです。
Ver.0.6.0 より、記事ごとにグループ分けする機能を追加しました。
# VideoPop+ は、バージョン 0.5.0 以降で、このプラグインに対応しています。

ダウンロード

wp-lightpop.0.8.5.5.zip Ver.0.8.5.5
または
WordPress > WP-lightpop « WordPress Plugins

インストール

plugins ディレクトリに "wp-lightpop" ディレクトリを作成し、その中にプラグインファイルを格納してください。
一般的には .zip から展開された wp-lightpop フォルダをそのままアップロードすれば OK です。

別途、フリーの FLV プレイヤー JW FLV Player を入手し、プラグインと同一ディレクトリに保存することで FLV 形式のファイルを扱えるようになります。
→ ライセンス的に問題なさそうだったので Ver.0.4.4 よりプラグインファイルに同梱しました

使い方

オプションの設定

管理画面の「設定」-「LightPop」を選択

設定項目は一杯ありますが、「対象のXHTML要素」を再設定すれば大丈夫です。

オプション

• 対象のXHTML要素
  対象となる XHTML要素へのマークアップを列挙してください。
  
  例えば <a href="～" class="video"> を対象にしたい場合は
   a.video
<a href="～" rel="lightbox"> を対象にしたい場合は
   a[rel*=lightbox]
http://www.example.com/wp-content/uploads/ 以下へのリンクを対象にしたい場合は
   a[href^=http://www.example.com/wp-content/uploads/]
  YouTube へのリンクを対象にしたい場合は
   a[href*=.youtube.com/watch]
  
  同一行にカンマ区切りで列挙した要素はグルーピングされます。
  
• エントリのクラス
  入力されたクラスのHTML要素でグルーピングします。(ver.0.6.0 より機能追加)
  デフォルトテーマを使用しているのなら "post" Vicuna を使用しているのなら "entry" をセットすれば、記事ごとにグループ分けされます。
• フレーム枠の種類
  表示するフレーム枠の種類を選択してください。
  選択できるフレーム種類は以下のとおり
  • ボーダー
  • デフォルトフレーム
  • エンボスがついた角丸
  • ドロップシャドウがついた角丸
  • 内側にシャドウがついた角丸
  • ２重シャドウがついた角丸
  • ４つ角がピンでとめられた角丸
  • 画像指定(デザイン変更)

  「画像指定(デザイン変更)」を選択すると、オリジナルのフレームに変更することができます。
  

• リンクアイコン
  YouTube, Metacafe, 動画ファイルへのリンクの前にアイコンを表示したい場合は「リンクタグの前に表示する」にチェックを入れてください。
  
• タイトルにリンクを設定する
  拡大表示された画像(or 動画)のタイトル部分にオリジナルへのリンクを設定したい場合はチェックを入れてください。
  

詳細オプション

「詳細な設定」をクリックすることで、見た目に関する細かい設定を行うことができます。

• オーバーレイ
  背景色と透明度を指定してください。
• コンテンツ
  表示されるボックスにボーダーを適用したい場合は、css を指定してください。
  # ボーダーを表示しない場合は、none
  # 太さが 2 ピクセル、種類が凸線、銀色のボーダーを表示したい場合は、
  # 2px solid silver
  
• コンテナー
  ボーダーの幅とリサイズ時のスピードを指定してください
  
• Prevボタン、Nextボタン、Closeボタン、読込中に表示する画像、空白
  それぞれの画像へのパスを指定して下さい
  
• キーの割り当て
  キーボードショートカットに用いるキーを指定してください。
  
• FLV player のパス
  JW FLV Player をプラグインと別フォルダに保存した場合は変更してください。
  

リンクタイプ別オプション (Ver.0.7.0 以降)

「リンクタイプごとのオプション」をクリックすることで、リンクタイプ別にオプションを設定できます。

• 有効 (全リンクタイプ共通)
  チェックを外すと、指定されたリンクタイプに対するエフェクトを無効にします。
  (デフォルトは「有効」)
  
• 拡大表示時の最大幅、高さ (画像のみ)
  画像ファイル拡大表示時の最大幅と最大高さを指定してください
  0を指定すると、サイズ調整は行わず元画像のサイズそのままに表示します
  
• 幅、高さ (画像以外)
  各動画プレイヤーを表示する際の幅と高さを指定してください
  
• パラメーター (画像、ニコニコ動画以外)
  各動画プレイヤーに設定するオプションパラメータを "&" 区切りで指定してください。
  例： YouTube
    hl=ja&autoplay=1&fmt=18
   (言語:日本語、自動スタート:on、高画質モード:on に設定します。)
  設定できるパラメータについては、各動画サイトを参照してください。
  

オプション設定後「更新」ボタンをクリックして、設定を保存してください。

アンインストール

「削除」ボタンをクリックすると、プラグインが保存した設定値をすべて削除します。
当プラグインをアンインストールするときや、設定を初期値に戻したい場合に使用してください。

スクリーンショット

対応している動画サイト

• YouTube
• Metacafe
• LiveLeak.com
• Google Video
• SPIKE Powered By IFILM ※Ver.0.8.2以降では、未サポート
• Dailymotion
• Super Deluxe
• ニコニコ動画 (サムネイル表示になります) Ver.0.8.3以降ではプレイヤーが表示されます

対応しているビデオファイル形式

.3gp	→	Quicktime Player
.asf	→	Windows Media Player
.avi	→	Windows Media Player
.mp4	→	Quicktime Player
.mpg	→	Windows Media Player
.mov	→	Quicktime Player
.rm	→	Realplayer
.swf	→	Flash 8 plugin
.flv	→	Flash 8 plugin
.wmv	→	Windows Media Player

特記事項

動画ファイルはサイズが取得できないため、<a>タグは下記のように設定して下さい。
<a href="http://example.com/hoge.flv?width=320&height=240">
# VideoPop+ を使用すれば、この辺は自動で処理します。

Javascript フレームワークとして jQuery を使用しています。
また、プラグイン同梱の「jquery.lightpop.js」は Wordpress 以外のサイトでも jQuery 用のプラグインとして利用可能なように作ってあります。
そちらでもお試しください。

更新履歴

2010/02/01	0.8.3	ニコニコ動画への完全対応
2010/01/25	0.8.2	IE後方互換モードで表示している際の不具合を修正
2009/07/23	0.8.1	jQuery.lightpop.js 修正対応
2009/07/08	0.8.0	ソースの全面的なクリーンアップ サイズ取得時の不具合修正
2009/02/17	0.7.5	マイナな不具合修正
2009/01/10	0.7.4	WMV形式のファイルの表示不具合対応
2008/12/08	0.7.3	YouTube 高画質モード(fmt=22)対応
2008/11/17	0.7.2	ソースのクリーンアップ
2008/10/20	0.7.1	画像読込失敗することがある不具合を修正
2008/10/16	0.7.0	動画プレイヤー制御用の設定項目を追加
2008/10/03	0.6.2	Chrome 用に細かい調整
2008/08/17	0.6.1	IEで YouTube が正常に表示できなかった不具合を修正
2008/07/15	0.6.0	IE6での不具合を修正 記事ごとにグループ分け機能追加
2008/06/17	0.5.0a	コンテナーの背景色変更で発生する不具合を修正
2008/05/22	0.5.0	同梱の jQuery を 1.2.6 に変更
2008/05/22	0.4.6	IE6で拡大表示されないことがある不具合を修正
2008/05/22	0.4.5	FLV Player でサムネイルが表示されない不具合を修正
2008/05/21	0.4.4	画像拡大時の最大サイズを設定可能にしました JW Mediaplayer を同梱
2008/05/09	0.4.3a	デフォルト設定値の修正
2008/04/28	0.4.3	DBから設定を削除できるようにしました
2008/04/07	0.4.2	動画ファイルの拡張子が大文字だと正常に作動しないバグを修正
2008/04/04	0.4.1	細かなバグフィックス
2008/02/19	0.4.0	「タイトルにリンクを設定する」オプションの追加
2008/01/29	0.3.6	wp_enqueue_script()でjsをロードするように修正
2008/01/09	0.3.5	細かなバグフィックス
2008/01/07	0.3.4	フレーム枠画像の修正
2008/01/04	0.3.3	JavaScriptの修正
2008/01/02	0.3.2	JavaScriptの修正
2007/12/31	0.3.1	対応動画サイトを増やしました
2007/12/27	0.3.0	選択できるフレームを増やしました JavaScriptの修正
2007/12/26	0.2.1	対応動画サイトを増やしました
2007/12/25	0.2.0	フレームを変更できるように修正
2007/12/20	0.1.2	Javascript のバグフィックス
2007/12/20	0.1.1	オプション設定画面の見直し
2007/12/19	0.1.0	リリース

作者のエントリ

WP-lightpop Ver.0.7.1 リリース@dogmap.jp

Wordpress 用プラグイン WP-lightpop Ver.0.7.1 をリリースしました。
今回のリリースは初期バージョンからあった不具合の修正。
これで、しばらくバージョンアップしない予定です。

WP-lightpop Ver.0.7.0 リリース@dogmap.jp

画像だけでなく動画にも lightbox 効果を適用できる Wordpress 用プラグイン WP-lightpop Ver.0.7.0 をリリースしました。
このバージョンでの主な変更点は

• 各動画サイトの動画プレイヤーを制御するオプションを追加
• オプション設定画面を、ちょっと使いやすく修正
• オーバーレイ部分であれば、どこをクリックしても閉じるように修正
• ウィンドウスクロール後、次のコンテンツを表示した際、次のコンテンツがウィンドウ中央に表示されるよう修正

新機能の「動画プレイヤーを制御するオプション」は、各動画サイトごとに幅・高さ・パラメータを指定できます。

WP-lightpop Ver.0.6.0 リリース@dogmap.jp

画像だけでなく動画にも lightbox 効果を適用できる Wordpress 用プラグイン WP-lightpop Ver.0.6.0 をリリースしました。
このバージョンでの主な変更点は

• エントリごとにグループ化できるようにオプションを追加した。
• IE6で不安定だった動作を修正した。

新機能の「エントリごとのグループ化」を行うには、オプション設定画面のエントリのクラス欄に各エントリのクラス名を設定してください。
デフォルトテーマだと「post」、Vicuna なら「entry」で良いはず。

WP-lightpop Ver.0.4.0 リリース@dogmap.jp

画像だけでなく動画にも lightbox 効果を適用できる Wordpress 用プラグイン WP-lightpop Ver.0.4.0 をリリースしました。
このバージョンでの主な変更点は

• 拡大表示された画像(or 動画)のタイトル部分にオリジナルへのリンクを設定できるようにした。
• 同梱している jQuery を、最新版の 1.2.3 に変更した。
• wp_enqueue_script()で JavaScript をロードするようにした。(Ver.0.3.6から)

WP-lightpop Ver.0.3.0 リリース@dogmap.jp

Ver.0.2.0 をリリースしたばかりですが、Ver.0.3.0 をリリースしました。
このバージョンでの主な変更点は

• 対応動画サイトを増やした 2 → 6
• デフォルトで選択できるフレーム枠の種類を増やした 1 → 6
• Javascript の見直しと効率化

WP-lightpop Ver.0.2.0 リリース@dogmap.jp

Ver.0.1.0 をリリースしたばかりですが、拡大表示した画像 or 動画のフレームを変更できるようにした Ver.0.2.0 をリリースしました。
このバージョンでは、フレームを自分で用意した画像に置き換えることもできます。
# 相変わらず、対応する動画サイトは YouTube と Metacafe だけですが…

クライアントは IE6,7 Firefox 2, Opera 9, Safari 3 for win で確認してます。

WP-lightpop@dogmap.jp

画像だけでなくYouTube、Metacafeなどの動画サイト、自サイト内の動画ファイル、WordpressプラグインVideoPop+で管理している動画ファイルを lightbox 風に表示するためのプラグインです。
# VideoPop+ は、バージョン 0.5.0 以降で、このプラグインに対応しています。

デモはこちら