WordPress のギャラリー機能を使ってみたよ(´・ω・`)♪
使い方はとっても簡単です。
投稿の編集画面のどこか任意の場所（ギャラリーを置きたい場所）にカーソルを置いて、上にある「メディアを追加」をクリックし、あとはメディアにアップロードしてある画像を選ぶだけのお手軽さ。
ここで使った写真は全部 iPod touch のカメラで撮ったもので、一部の画像の幅を 300px にリサイズしたものもいくつかあるんですけど、なぜか 300px 以上のサイズで表示されてしまうものがあったりしてよくわからない…
…と思ったら！
Jetpackプラグインの「タイルギャラリー」を有効にしていました。
タイルギャラリーが有効になっていると、こんな感じでマガジン風に表示されて、マウスオーバーした時だけ説明のテキストが表示されます。
これはこれでいいんだけど普通に並べたい…。
Jetpack の「タイルギャラリー」を OFF にすると 自動的に WordPress のデフォルトのギャラリーを読み込むので、ショートコードの中に
ギャラリーはレスポンシブデザインにも自動で対応しているので気軽に使えます、楽。
あと、ちょと凝ったことをしようと思えば CSS で指定すれば OK です。
なかなかいい感じ。
「jQuery Lightbox」プラグインをインストールして、ギャラリーを作成したときに生成されたショートコード中に
これを使えば、わざわざメディアの画像ページ URL に遷移しないので便利。
実際、写真を一枚見るたびに違うページに遷移するのは面倒だし、ユーザに不親切ですよね。
5月半ばから 6月はじめ頃ってこんな感じのお花とか虫たちの季節
家紋に描かれているような、日本の蝶らしい佇まいのキタテハ
ハブランサス（ゼフィランサス）ロブスタス、レインリリーとも呼ばれるみたいです。
白かったらタマスダレっていう名前。
食べられないさくらんぼ
桑の実がマルベリーなんだ。
てんとう虫の幼虫
てんとう虫のさなぎ、なぜかどうしてもピントが合わない。
藤がまだ開花する
豆のような、藤のタネ
オトギリソウの一種類、ビヨウヤナギ（美容柳）というそうです。
時計草、パッションフラワー、南国チックな花。
パッションフルーツが実るはずなんだけど、なぜか見当たらない。
サボテンの蕾、もうすぐ開く感じ。
サボテンの花、１年間で１回だけ咲いて、たったの2〜3日しか見られない、きれい。
アゲハチョウの幼虫、みかんが大好き。
アゲハ蝶の幼虫、よく見ると小さいのもいます。
ランタナの花にアゲハ。
アゲハチョウらしくなって来た幼虫。
ほんとに柑橘類の葉っぱが大好き。
6月といえば紫陽花、原種は日本に自生するガクアジサイなんだって。
で、これはその中でもちょっと変わってて白い大きな花弁の茎が長くて、しかも花が丸こっくない。
繊細できれい。
蒲公英（ほうこうえい）って書いてタンポポ、花はライオンの歯の意味のダンデライオン。
たんぽぽって春先の寒い時もめっちゃ気温が高くなって蒸し暑い今も、同じようにいてますね。
もうすぐ飛んでいきそうな種子。
jQuery Lightbox にはスライドショー機能もついているので、Lightbox で表示された画像が自動で切り替わるタイミング（時間）の指定がおこなえます。
play slideshow という文字をクリックするとスライドショーが始まり、pause slideshow の文字に切り替わるので、クリックすれば停止させることもできます。
ギャラリーのショートコードを複数作っておき、その間に文章や他の画像などを入れても、Lightbox の進む icon-angle-right 、戻る icon-angle-left をクリックしたり、スライドショーで表示させれば、ギャラリーの写真はすべて連続して通しで見ることができるようになっています。
もうすぐ咲きそうなアガパンサスの花。
桔梗、絶滅危惧種なんだって。
日差しに映える色の立葵、もう真夏のような感じ。
濃い色のノウゼンカズラ（凌霄花）いまこれがいっぱい咲いてる、南国っぽい。
ひまわりも咲き始めた。
柑橘類の樹
何かのシトラス、けっこう大きい。
柿の実も少し大きくなってきました。
謎の花、小さい。
桜の樹液
蛾の繭
日本画に描かれそうな桜の木の菌類
ウメエダシャクという名の蛾
いかにも臭そうなカメムシ。
謎 berry、葉っぱはイチゴに似てる。
謎の花、豆ではない。
大きな綿毛、何の種だかはわからない。
自然のデザインの規則性
これなら、300px にリサイズしたものをメディアに追加するよりも、500px 幅以上の大きな写真サイズで載せた方がきれいで見栄えがするかもしれない。
本当ならカラム幅以上の写真サイズにしたいところだけど、WebKit のブラウザならちゃんと表示できても、なぜか Gecko レンダリングエンジンブラウザではサムネイルもクリック後に表示される画像も正常に表示できないので、カラム幅以内にしとかなきゃマズいみたい。
Jetpack のもいいけどね
Jetpack の「タイルギャラリー」のいいところは、マガジン風にランダムな大きさに表示されるところ。
…なんだけど、使う写真そのものを 300px にリサイズしたりしていると、記事スペースのカラム幅によっては元画像よりも大きなサイズで表示され画像が荒れたり、大小足した全体の幅がなぜか中途半端なサイズに決めうちされて不細工になったりすることがあります。
ギャラリーを使用するページそのものを 1カラムで表示させないんだったら Jetpack のタイルギャラリーは使わないで、WordPress デフォルトのギャラリー機能を使った方が調整が簡単かもしれないですね。
梅雨の間の晴れ間〜(´・ω・`)
使い方はとっても簡単です。
投稿の編集画面のどこか任意の場所（ギャラリーを置きたい場所）にカーソルを置いて、上にある「メディアを追加」をクリックし、あとはメディアにアップロードしてある画像を選ぶだけのお手軽さ。
「メディアを追加」ボタンをクリックすると、下の画面が出てきます。
はじめに左のメニューで「ギャラリーを作成」を選んで、メディアライブラリの中にアップロードしてある写真を選んでいくだけ。
選んだ画像をドラッグすることで、表示させる順番も簡単に入れ替えられます。
ここで使った写真は全部 iPod touch のカメラで撮ったもので、一部の画像の幅を 300px にリサイズしたものもいくつかあるんですけど、なぜか 300px 以上のサイズで表示されてしまうものがあったりしてよくわからない…
…と思ったら！
Jetpackプラグインの「タイルギャラリー」を有効にしていました。
タイルギャラリーが有効になっていると、こんな感じでマガジン風に表示されて、マウスオーバーした時だけ説明のテキストが表示されます。
これはこれでいいんだけど普通に並べたい…。
Jetpack の「タイルギャラリー」を OFF にすると 自動的に WordPress のデフォルトのギャラリーを読み込むので、ショートコードの中に
columns="3" と入れて、gallery columns の値を 3 に指定すると、ちゃんと横 3カラムで表示できるようになりました。ギャラリーはレスポンシブデザインにも自動で対応しているので気軽に使えます、楽。
あと、ちょと凝ったことをしようと思えば CSS で指定すれば OK です。
なかなかいい感じ。
「jQuery Lightbox」プラグインをインストールして、ギャラリーを作成したときに生成されたショートコード中に
link="file" と入れると、画像をクリックすれば Lightbox で画像が開くようになります。これを使えば、わざわざメディアの画像ページ URL に遷移しないので便利。
実際、写真を一枚見るたびに違うページに遷移するのは面倒だし、ユーザに不親切ですよね。
5月半ばから 6月はじめ頃ってこんな感じのお花とか虫たちの季節
jQuery Lightbox にはスライドショー機能もついているので、Lightbox で表示された画像が自動で切り替わるタイミング（時間）の指定がおこなえます。
play slideshow という文字をクリックするとスライドショーが始まり、pause slideshow の文字に切り替わるので、クリックすれば停止させることもできます。
ギャラリーのショートコードを複数作っておき、その間に文章や他の画像などを入れても、Lightbox の進む icon-angle-right 、戻る icon-angle-left をクリックしたり、スライドショーで表示させれば、ギャラリーの写真はすべて連続して通しで見ることができるようになっています。
これなら、300px にリサイズしたものをメディアに追加するよりも、500px 幅以上の大きな写真サイズで載せた方がきれいで見栄えがするかもしれない。
本当ならカラム幅以上の写真サイズにしたいところだけど、WebKit のブラウザならちゃんと表示できても、なぜか Gecko レンダリングエンジンブラウザではサムネイルもクリック後に表示される画像も正常に表示できないので、カラム幅以内にしとかなきゃマズいみたい。
Jetpack のもいいけどね
Jetpack の「タイルギャラリー」のいいところは、マガジン風にランダムな大きさに表示されるところ。
…なんだけど、使う写真そのものを 300px にリサイズしたりしていると、記事スペースのカラム幅によっては元画像よりも大きなサイズで表示され画像が荒れたり、大小足した全体の幅がなぜか中途半端なサイズに決めうちされて不細工になったりすることがあります。
ギャラリーを使用するページそのものを 1カラムで表示させないんだったら Jetpack のタイルギャラリーは使わないで、WordPress デフォルトのギャラリー機能を使った方が調整が簡単かもしれないですね。
梅雨の間の晴れ間〜(´・ω・`)
コメント
コメントはまだありません。