旅の感動を、皆さんにも伝えたくてPhotoGalleryを作って見ました。


作ったと言っても、ツール(WordPress)を使って テーマとプラグインを入れて調整しただけですので、実際の開発時間は実質1時間位です。


画像の縮小とアップロードの方がよっぽど時間がかかりました(苦笑)


それにしても、技術の進歩(開発工数の削減)とツールの充実には目を見張ります。


こちらのサイトでは「開発者Blog」と銘打ってますので、少し開発者目線での備忘録です。


手順1:サーバー準備
Webサーバーの準備:スイマセンここは既に準備されている方を前提に話をさせて下さい。
ちなみに、本PhotoGalleryはロリポップサーバーを使用しています。


手順2:WordPress環境準備
WordPress環境が既に使用出来る環境を前提にお話させて下さい。

手順3:テーマとプラグインの導入。
Wordpressの画像ギャラリープラグイン「NextGen Gallery」を使用。
http://wordpress.org/extend/plugins/nextgen-gallery/

CommStep開発者のブログ


Wordpressのテーマより「Photopress 1.1」を使用。
http://wpthemejp.com/photopress


プラグインやテーマの導入方法は既に知っている事を前提にお話します。


この導入方法詳細は後日「manual site」にアップします。 今 しばらくお待ちください。
http://commstep.main.jp/how-to/


手順4:画像の取り込み
①まずはGallery名を決める。
例、日付やフォルダー名で良い 文字化けするので可能な限り英数字が良い


CommStep開発者のブログ

②画像の取り込み(複数画像の一括アップロード可能)
注意:最近のデジカメ等は画素数も多く、容量が多くなるので出来るだけ小さめに縮小しておくと
画像表示のスピードが遅くならない。
(ソフト側で勝手に圧縮かけてくれるのであまり神経質になる必要はなさそうです)


CommStep開発者のブログ


手順5:表示オプションの変更。
様々な変更オプションが有りますが、ここでは代表的(最低限)の設定方法を説明します。
①サムネイル画像(画像一覧の小さい画像)の一画面表示数の設定。
ここでは一画面「20枚」のサムネイル画像を表示させます。
(あまり多いとスクロールが必要になり見づらい)

②最初に表示させる設定。
初期画面として「サムネイル画面」、「スライドショー画面」かを選択します。
ここでは「Thumbnails:サムネイル」にチェックを入れます。
③大きい画像の全表示のチェックを入れます。
「Add hidden images:隠れたイメージを加えてください」
このチェックを入れないと、大きい画像表示時にサムネイル画像数分しか表示されないので、全サムネイル分を表示させるためにチェックする。



CommStep開発者のブログ

ここまで来たら、最後の画面体裁調整です。 もう一息・・・


手順6:サイトの設定。
サイトのタイトルやキャッチフレーズを入れる。



CommStep開発者のブログ

手順7:初期表示画面の設定。
投稿編集画面がこのサイトのメイン画面になります。
コメント文字をや説明を入力して下さい。

CommStep開発者のブログ


手順8:Galleryページの設定画面です。



CommStep開発者のブログ

その他、細かい調整は抜きにして、ここまでで充分見るに堪える画面は出来たハズです。
是非とも、興味ある方はトライしてみて下さい。
簡単な質問程度であればコメント頂ければお受けします。


では失礼します。