Lightbox for videos

2007/04/20 4 コメント カテゴリ: WEB

VideoYoutube, Metacafe, Google Video, iFilm, custom flashの動画を lightbox で、ページ移動すること無く表示できるというので、右図サイトにさっそく導入しましたmemo。
おしゃれなiPodのCMの動画を集めてみました。Taggeratiもちゃんと動いてるよ(しつこい)
Rif.tube » iPod and iTunes Video

やはり、動画をそのまま表示すると、AJAXで何か（検索結果とか）を表示して重なった場合、動画が上に来て見えなくなってしまうので、その点でも助かりました。
ページ移動無く動画を観ることができるって、とってもイイ！

Download

Usage

  • ダウンロードしたフォルダの中のcss, jsフォルダをそれぞれ使用テーマにcss, jsのフォルダを作りアップロード（WP用のプラグインでは無いのでどこにアップロードしても構わないんですが、一応使用テーマへ入れてみました。）
  • videobox.cssの最初のbody {margin: 0;}を削除する。

headerへ

[sourcecode language='HTML']


[/sourcecode]
CSSは、使用テーマのスタイルシートに書き足すか、上記のように読み込む。

あとは表示したい動画のURLにrel="vidbox"を付けるだけ。
[sourcecode language='HTML']
our video
[/sourcecode]
WP-AddQuicktag (de)に登録しておくと楽です。
titleはLightbox表示されたときに右下に表示されます。

ただ、これだと、自分でサムネルを用意して、それにリンクを張る形になります。
自動でサムネイルも作ってくれるといいなー。

サムネイルはイメージ検索で適当なのを見つけるか、YouTube動画のサムネイル(静止画)出力ツール - TubeFire.comなんかを利用させてもらったり、キャプチャにウォーターマークなんか付けて超オリジナルに表示することもできますね。

逆にウォーターマークが無いとただのサムネイルで、まさか動画だとは気づかないかも。
ゆっくり考えます。その間にWPのプラグインになっちゃったりしますように :kopete006:

4 レスポンス

コメントする

  1. チャレンジャーだわ

    なんでよ？だめなん :kopete014:
    それより出来ないことの方が悔しい、そんな難しいプラグインじゃないのにねぇ :cry:

    返信
    yutaka 2007 4 21 at 00:22 パーマリンク

  2. びんさん、まさかBBに入れる気？
    チャレンジャーだわ :penguin:

    返信
    Rika 2007 4 20 at 23:54 パーマリンク

  3. お昼に挑戦してみたけど、You Tubeへのリンクが出来てそこへ飛ぶだけ？なんでかな？ 夜再挑戦 :undo:

    返信
    binsan 2007 4 20 at 13:11 パーマリンク

コメントをどうぞ

Commenter Gravatar