色々なエフェクトで表示するポップアップウィンドウ。
くるっと回ったり、背景をぼかしてポップアップを強調したりと面白くも実用的なエフェクトが揃っています。
タグ: ポップアップ
[WP] 「Lightbox Plus ColorBox」を使って、YouTube動画をポップアップ表示させる
テキストリンクや画像からのリンクを開くとYouTube動画をポップアップ再生・・・こういう風にするには、Lightbox系のプラグインで行えます。
とにかくすぐに導入するなら「Lightbox 2」と「WP Video Lightbox」がお手軽です。Lightbox 2は設定が要らず、WP Video LightboxはYouTubeのリンクタグに rel=”wp-video-lightbox” を記入するだけ。ですが、WP Video Lightboxは動画の大きさを設定できないようなので、その点ではイマイチなプラグインです。
というわけで、Lightbox系のプラグインで主流となっているのが「Lightbox Plus ColorBox」です。若干の設定が必要になりますが、デザインや大きさが細かく設定できるのでこだわりたい人には最適でしょう。
リンク先プレビューをポップアップ表示する「snap」
ブックマーク追加をポップアップで登録可能にする
主要なソーシャルブックマーク追加ボタンを付けるの方法では、ブックマークに追加する際にページが移動するかtarget=”_blank”でウィンドウが開くので、実際使うと面倒な感じがします。
そこで、LightBoxのようにポップアップで表示してくれるJavascriptの「GreyBox」を使います。GreyBoxは画像だけでなくWEBサイトもポップアップ表示が可能。
これを使って、ブックマーク登録画面をその場でポップアップさせることで、訪問者の人にスマートなブクマ登録をしてもらえます。登録してくれる率が高まるかも?
画像を拡大ポップアップするLightboxのプラグイン
サムネイル画像をクリックすると、リンクしている元画像を拡大表示するJavascriptの「Lightbox」がありますが、WordPressにはプラグインで簡単に導入することができるので個別にインストールする必要がありません。
[ Plugin: Lightbox2 ]
[ Lightbox JS version 2.0 ]
Plugin: Lightbox2の方は、ポップアップした際にcloseボタンを押さなくても背景クリックで元に戻るのでおすすめです。
ダウンロードして解凍、pluginフォルダにアップロードして有効化するだけでインストールが完了します。(このプラグインはそのままで使えますので、aタグにrel="lightbox"
を追記する必要がありません。)