みんビズ制作講座 : デザインカスタマイズ ( 全 10 回 ) 第 8 回 : フォトギャラリーを使ってみよう 執筆 : 赤間公太郎 ( 株式会社マジカルリミックス ) みんビズでは 写真を掲載する際には通常 写真 機能を使用します しかし 写真の点数が多くなればなるほど 管理 も大変になります 多くの写真を扱う場合は フォトギャラリー が便利です みんビズのフォトギャラリーの使い方を見てみましょう フォトギャラリー はどんな機能? フォトギャラリーを使ってみよう HTML ギャラリーフォーマット Flash フォーマット 表示を確認する フォトギャラリー はどんな機能? みんビズで使用できる フォトギャラリー は たくさんの写真を掲載する際に便利な機能です フォトギャラリーには 以 下の 2 つの表示方法が用意されています HTMLギャラリーフォーマット Flashフォーマット それぞれの特徴を見ていきましょう HTML ギャラリーフォーマット HTML ギャラリーフォーマットは 写真の一覧表が自動的に表示され クリックすると写真が拡大される表示方法です ペー ジ内の情報が少ない場合や 写真を一覧でも見せたいときに便利です HTML ギャラリーフォーマットは 写真が一覧で並ぶ 写真をクリックすると 拡大表示される Flash フォーマット Flashフォーマットは 写真が自動または手動で切り替わっていく スライドショー形式の表示方法です ページ内の情報が多い場合や 写真をイメージ的に見せたい場合に便利です iphoneをはじめとする一部のスマートフォンはflashをサポートしておらず 特にPC 表示で閲覧した場合は フォトギャラリーが表示されない場合があります Flashフォーマットを採用する場合は ユーザーの利用環境にも注意しましょう
Flash フォーマットは スライドショー形式 フォトギャラリーを使ってみよう 見出しや本文などにマウスカーソルを重ね のアイコンをクリックします プラスのアイコンをクリック 出てきたメニューの中から フォトギャラリー をクリックします フォトギャラリー をクリック 選択 をクリックして パソコン内にある画像を選択します Windows の場合は Ctrl キー Mac の場合は command キー を押しながら画像を次々とクリックしていくと 複数の画像を選択することができます 選択 をクリック 掲載したい画像を選択したら アップロード をクリックして画像をアップロードします アップロード をクリック アップロードした画像が表示されます アップロードした写真が表示される Point Dropbox から写真をアップロードすることもできます Dropbox は Web 上にデータを保存し 異なる端末や他の ユーザーと共有するためのサービスです 基本的には 無料で使用することができます スマートフォンで撮影した写真を Dropbox に保存した場合などに便利です プレビュー で 写真の順番を入れ替えたり サブタイトルをつけたりします プレビュー クリック後の表示 プレビューでは 以下のことができます 写真をドラッグして写真の順番を入れ替える HTMLギャラリーフォーマットの場合は 拡大表示の際に出るサブタイトルを設定する
Flashフォーマットの場合は 表示される写真の上部に出るサブタイトルを設定する 写真にページなどをリンクさせる 写真を90 度ずつ回転させる 写真を削除する ここでの プレビュー は 実際の見え方を確認するものではありません プレビューには 一覧表示 と 詳細表示 の 2 つがあり プレビューをクリックすることでそれぞれの表示に切り替わりま す クリックすると表示が切り替わるプレビュー 一覧表示では順番を入れ替えることしかできませんが 詳細表示では上記のすべての操作を行うことができます それぞれのボタンで操作できること HTML ギャラリーフォーマットを使用する フォーマットで HTML ギャラリーフォーマット をクリックします フォーマット で HTML ギャラリーフォーマット をクリック 比率 で サムネイルの比率を選択します 原型比率( 縦横比 ) か 正方形比率 を選択することができます 原型比率では アップロードした写真の比率を保ったサムネイルが表示されます 縦長の写真は縦長の 横長の写真は横長のサムネイルが表示されます 正方形比率では 写真が正方形にトリミングされたサムネイルが表示されます サムネイル サムネイルとは 縮小された小さな画像のことです 本来は 親指の爪 という意味です Point アップロードする写真の縦横比率がすべて同じ場合は 原型比率 ( 縦横比 ) でもきれいに並びますが 縦長の写 真と横長の写真が混在している場合は 正方形比率 を選択するときれいに並びます 比率を選択する サイズ で サムネイルのサイズを調整します + をクリックするとサムネイルのサイズが大きくなり - をクリックするとサムネイルのサイズが小さくなります
サイズを調整する スタイル で 写真の枠を選択します サイズを選択する 写真の枠は フレームなし 小フレーム 大フレーム の 3 つが用意されているので ホームページの雰囲気に合わせ て選びましょう フレームのサイズを選択する Pinterest で Pinterest で写真を共有するかどうかを選択します Pinterest Pinterest は 写真の共有サービスです ユーザーが気に入った画像を投稿し 共有します 共有された写真はピン ボード風に表示されます Pinterest で写真を共有するかどうかを選択 Flash フォーマットを使ってみよう 再生速度 を入力します 再生速度は 自動再生 をオンにした場合に 一枚の写真を表示している時間です 再生速度 を入力する サムネイルのプレビュー の表示方法を選択します サムネイルの表示方法を選択する スライドショーが表示される際に 最初は非表示 か 最初から表示 のどちらかを選択することができます 最初にサ ムネイルを非表示にした場合 画像にマウスカーソルを重ねるとサムネイルが出現します サムネイルの表示方法を切り替えて選択する 最初は非表示 にする場合
最初から表示 する場合 スライドショーを 自動再生 をするかどうかを選択します チェックをオンにすると ページが表示された際に自動的に写 真が切り替わっていきます チェックをオフにすると 写真は自動的に切り替わらず サムネイルをクリックして写真を切り 替えていく形式になります 自動再生 をする場合 チェックをオンにする 表示を確認する 保存 をクリックします 保存 をクリックして保存する ページ右下の プレビュー をクリックして 実際の表示を確認 スライドショーが表示されました HTML ギャラリーフォーマットを選択した場合の プレビュー後の表示 Flash フォーマットを選択した場合の プレビュー後の表示 まとめ フォトギャラリーは 多くの写真を省スペースで表示したい時に使用 ホームページの雰囲気や横幅に合わせて正しく設定 調整を行う Flashフォーマットは 一部の環境では表示されない場合があるので注意 次回のコラムを見る» 赤間公太郎 ( あかま こうたろう ) 株式会社マジカルリミックス代表取締役 CEO/JimdoExpert http://www.magical-remix.co.jp/ http://www.kotalog.net/ 宮城県出身 IT 関連の専門学校を卒業後 仙台のデザイン会社に入社 Webサイトのデザイン コーディングを中心に従事 2002 年退職後すぐに個人事業としてマジカルリミックスを創業 2007 年に法人化し株式会社マジカルリミックスを設立 規模を問わずお客様のニーズにあわせたWebサイトの企画立案 制作 アクセスと売上アップをめざした更新サポートまで一貫して手がけている また Web 制作だけにとどまらず 社内向けのセキュリティ IT 活用のプライベートトレーニング セミナー出演 執筆なども意欲的に手がける 全国からの講演依頼も多数 2005 年から仙台の専門学校で 非常勤講師としてWeb 制作講義を担当
主な著書に 10 日でSEO& アクセスアップ Jimdoデザインブック ( エムディエヌコーポレーション ) 10 日で作るかっこいいホームページ Jimdoデザインブック ( 同 ) HTML5+CSS3の新しい教科書基礎から覚える 深く理解できる ( 共著 同 ) 基礎から覚える 深く理解できる Webデザインの新しい教科書 ( 同 ) [ 所属 ] 仙台商工会議所エキスパートバンク登録 / みやぎ産業振興機構専門家アドバイザー / みやぎ工業会正会員 Copyright 2018 はじめて WEB All Rights Reserved. https://hajimeteweb.jp/