マーカーネット株式会社

WEB制作ブログ WEBデザイン、HTMLコーディング、PHP、スマートフォン制作などWEB制作全般に役立つ情報を発信していきます。

CMS javascript(jquery) WordPress ホームページ運用

画像を自動的にlightBox風に表示するjQuery ColorboxのWordPressプラグイン

投稿日:2014年7月29日 更新日:

jQueryプラグイン「Colorbox」は便利ですが、
さらにWordPressプラグインとして導入すれば
設定は更に簡単になります。

ソースをいじる必要はありませんので初心者にもおすすめです。

WordPressの管理画面からプラグイン”WP jQuery Lightbox”を検索して
有効化するだけです。

日本語化ファイルも用意されていますので、
localizationフォルダにアップロードすると日本語化されます。

日本語化された設定画面がこちら。
colorbox_setting1-270x300

表示テーマ
表示アニメーションの設定
スライドショー機能
スライドショーの切り替え時間
画像幅と高さ
ColorBoxの最大幅と高さ
画像のリサイズ
などを画面から簡単に設定できます。

画面をはみ出すような大きな画像に対応するには
「スクリーンサイズに合わせて画像を縮小」にチェックを入れて
設定を保存してください。

他にもlightBox風のプラグインは多々ございますが
簡単に設定できる点でこちらがおすすめです。

お試しあれ。

-CMS, javascript(jquery), WordPress, ホームページ運用

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

面白い動きや便利な機能をJSで実装! その1:簡単にグラフを作成する方法!

折れ線グラフ、棒グラフ、円グラフ、レーダーチャートなどを 作成することができる「Chart.js」をご紹介致します。 今回は一番汎用性の高いと思われる折れ線グラフを作成してみたいと思います。 表示の瞬 …

レスポンシブにも対応!行ごとのブロック要素の高さを自動で合わせる方法。

レスポンシブにも対応!行ごとのブロック要素の高さを自動で合わせる方法。

ブロック要素の高さを揃えるJavaScriptはいくつかあります。 その中でも行ごとの高さを変えたい場合に便利な「fixHeight.js」をご紹介します。 「fixHeight.js」の設置方法 ま …

2014年2015年のSEOは『キュレ―ションSEO』?

2014年2015年のSEOは『キュレ―ションSEO』?

「10倍のポテンシャルはある」。元ライブドア社長の堀江貴文氏が大きな成長を予想するのがニュースキュレーションサイトだ。ベンチャー企業が提供するスマートニュース、グノシー、ニューズピックスといったサービ …

面白い動きや便利な機能をJSで実装! その4:ちょっと変わったマウスオーバーを実装してみました。

面白い動きや便利な機能をJSで実装! その4:ちょっと変わったマウスオーバーを実装してみました。

【今までにご紹介したJSの一覧】 面白い動きや便利な機能をJSで実装! その3:一目で印象に残るアニメーション背景を作成! 面白い動きや便利な機能をJSで実装! その2:いろんな種類のグラフを簡単に作 …

ワードプレスでどのテンプレートを使っているか見えるプラグイン

page.php や single.php は区別がついても archive.php や author.php になると どのテンプレートを利用しているか追跡するのに苦役を強いられるWordPress …