WordPressを利用して、ブログではなくCMSとして企業サイト・企業ウェブサイト作成・商用ホームページ制作のテクニックを公開。WordPressの最新ニュースやプラグインの紹介、自作プラグインやテーマも開発中。
WordPress 2.5の新機能 ギャラリー[gallery]を使って画像一覧表示する

WordPress 2.5の新機能 ギャラリー[gallery]を使って画像一覧表示する

WordPress 2.5の新機能としてギャラリーが追加された。ギャラリーを利用するとというコードを投稿欄に入力するだけで簡単に画像一覧ページを作成することができる。

ギャラリーの使用例

複数の画像を一度にアップロードすることを可能にしたフラッシュアップローダーや、サムネイルサイズの設定変更可能などの機能追加がギャラリーの下支えをしているだろう。

フラッシュアップローダーにはIEのバグがあり、IEでのフラッシュアップローダー(メディアアップロード機能)の不具合を修正するに詳しく書いたので参照してほしい。サムネイルサイズの設定変更は、「設定 – その他の設定」で行うことができる。「サムネイルを実寸法にトリミングする 」をチェックしておけば、画像サイズの比に合わせて縮小されることはなくなる。

画像サイズの設定変更

今回はこの新機能ギャラリーの使い方を解説しよう。ギャラリーを使用するには、投稿やページ作成画面で画像をアップロードした後に、投稿欄にというショートコードを追加するだけだ。


WordPress 2.5からはShortcode APIが追加されており、もこのショートコードの一つである。Shotcode APIについてはWordPressのCodexを見てほしい。

さて、には様々なオプションを指定することができる。以下のような形式だ。


基本オプション

  • columns
    画像を何列表示にするか指定する。デフォルトは3列。自動的に行替するコードを挿入する。4列表示にするには以下のように入力する。

    
    
  • id
    投稿IDを指定する。デフォルトでは投稿IDを指定せず、現在の投稿(ページ)に関連付けられた画像を表示する。投稿IDが123に関連付けてアップロードされた画像を表示するには以下のように入力する。

    
    
  • size
    表示する画像サイズを指定する。画像サイズには”thumbnail”、”medium”、”full”の三種類が指定できる。デフォルトは”thumbnail”になっている。中くらいの大きさの画像を一覧で表示させるには以下のようにする。

    
    

上級オプション

  • order
    WordPress 2.6から有効。デフォルトは、”ASC”である。
  • orderby
    サムネイルの表示順序を変更する。デフォルトは、”menu_order ASC, ID ASC”である。ASCは昇順、DESCは降順である。WordPress 2.6より、デフォルトは”menu_order ID”となり、ASC、DESCはorderに移されている。
  • itemtag
    ギャラリーの画像とキャプションのタグを囲むXHTMLタグを指定する。デフォルトは、”dl”である。
  • icontag
    ギャラリーの画像を囲むXHTMLタグを指定する。デフォルトは、”dt”である。
  • captiontag
    ギャラリーのキャプションを囲むXHTMLタグを指定する。デフォルトは、”dd”である。

    
    

という簡単なショートコードを入力するだけで簡単に画像一覧表示をさせることができるということがわかったと思う。しかし、実際に使ってみると画像表示がいまいち格好良くない。次回、ギャラリーを拡張して、Lightbox表示できるようにカスタマイズしたプラグインをご紹介しようと思う。

追記:を拡張し、Lightbox表示に変更するプラグインを作成した。Lightbox Gallery Pluginである。フォトログや写真アルバムサイトを構築予定の方はぜひ使ってみてほしい。

14 Comments

  1. Pingback: links for 2008-05-13 « copula’s weblog

  2. Pingback: M Style | フォトギャラリープラグイン

  3. Pingback: wordpress ビギナーズメモ » Blog Archive » Lightbox Gallery plugin

  4. Pingback: PurifyZombie - イラストサイトにWordpressを使う その1

  5. Pingback: angeli-x blog ++ » wordpressでイラストサイトを作ってみる

  6. Pingback: プラグイン いろいろ | ちょこちょこWORDPRESS

  7. Pingback: WordPressで画像一覧を生成する | メモ バインダー

  8. Pingback: niko » wordpress:ギャラリーの使い方まとめ

Comments are closed.