Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPBカップ
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

WordPressでアルバム付きフォトギャラリーを作成する方法

WordPressでアルバム付きのフォトギャラリーを作成すると、ウェブサイトのユーザーエクスペリエンスが向上し、ポートフォリオ、製品写真、個人的なアルバムなど、訪問者が画像をすばやく見つけやすくなります。

しかし、機能的で視覚的に魅力的なギャラリーを構築することは、適切なツールなしでは難しいかもしれません。ギャラリープラグインの中には、特に初心者にとって複雑なものもあります。

WPBeginnerでは、数え切れないほどのユーザーがアルバム付きギャラリーでサイトを改善するお手伝いをしてきました。そして、私たちは、あなたがコーディングなしでアルバム付きの洗練されたフォトギャラリーを作成するためのユーザーフレンドリーなソリューションをすべて知っています。

この記事では、WordPressでアルバム付きの洗練されたフォトギャラリーを設定する方法をご案内します。

how-to-create-a-photo-gallery-with-albums-in-wordpress-og

なぜアルバムでフォトギャラリーを作るのか?

イメージギャラリーは1ページに複数の写真を表示することができますが、アルバムはイベント、トピック、場所などに分類された複数のギャラリーを個別ページに表示することができます。

これは、レストランのウェブサイト、写真ポートフォリオ、旅行ブログ、またはさまざまな写真カテゴリーを整理して紹介したいビジネスに特に便利です。

アルバムがあれば、訪問者は探している写真を簡単に見つけることができます。延々とスクロールする代わりに、関連するアルバムをクリックするだけで、そのイベントやテーマのすべての写真を見つけることができます。

このようなユーザーフレンドリーなナビゲーションは、サイト滞在時間を長くし、全体的な体験をより良いものにします。

また、アルバムを作成することで、特定の写真セットを他の人と共有したい場合も簡単です。ギャラリー全体を共有する代わりに、関連する画像を含む特定のアルバムに人々を誘導することができます。

そのことを念頭に置いて、WordPressでアルバム付きのフォトギャラリーを簡単に追加する方法をステップバイステップで説明します。この記事で紹介する手順の概要を簡単に説明します:

さっそく始めよう!

WordPressできれいで整理されたアルバムを作成したいのであれば、より簡単なプロセスのためのプラグインが必要です。Envira Galleryは、WordPress用の画像ギャラリープラグインとして市場で最も優れているため、私たちはEnvira Galleryをお勧めします。

Is Envira Gallery the right photo and video gallery plugin for you?

まず、Envira Galleryプラグインをインストールして有効化しましょう。インストールの詳細については、WordPressプラグインのインストール方法のガイドを参照してください。

有効化すると、Envira Gallery 概要 ページでライセンスキーを入力するよう求められます。

Envira license key

プラグインを有効化したら、Envira Gallery ” Addonsにアクセスしてください。

Addons’タブから、’Albums Addon’の’Install’ボタンをクリックします。

Envira addons

また、’Albums Addon’に加えて、’Standalone’オプションを有効にする必要があります。そうしないと動作しません。

これを行うには、Envira Gallery ” 設定ページに移動します。そこから、’スタンドアロン’タブを切り替え、’スタンドアロンを有効にする’ボックスをチェックしてください。

そして、一番下にある「保存」をクリックしてください。

Envira standalone

ステップ2.最初のフォトアルバムを作成する

アルバムを作成する前に、イメージギャラリーを作成する必要があります。ここでは、Enviraを使ってWordPressでレスポンシブイメージギャラリーを作成する方法をステップバイステップで説明します。

イメージギャラリーを作成したら、Envira Gallery ” Albumsに移動し、’新規追加’ボタンをクリックしてください。

Add new Envira album

Enviraでのアルバムの作成は、ギャラリーの作成に似ています。唯一の違いは、画像をアップロードする代わりに、ギャラリーをドラッグ&ドロップすることです。

まず、アルバムにタイトルを付けます。それから、ギャラリーを点線枠の中にドラッグしてください。

追加されると、各ギャラリーに鉛筆のアイコンが表示されます。

add new album

このアイコンをクリックすると、ギャラリーのタイトル、キャプション、altテキスト、カバー画像を変更できます。

変更に満足したら、「メタデータを保存」ボタンを押す。

save metadata

ステップ3.フォトアルバムの見た目をカスタマイズする

このステップでは、Enviraアルバム設定の「設定」タブをクリックして、アルバムの表示方法を選択します。

例えば、グリッドのようなさまざまな表示がされ、好きなレイアウトを選ぶことができる。

configuration layout

アルバムをライトボックス内で直接開きたい場合は、「ライトボックス」タブをクリックしてください。次に、’ライトボックスを有効にする’というボックスをチェックしてください。

ライトボックスを有効化すると、画像サイズを変更したり、トランジション効果を追加したり、その他の設定を切り替えたりすることができます。

lightbox tab

アルバムはモバイルにも対応しています。これは、異なるモバイル画面サイズに自動的に調整されることを意味します。

アルバムの設定が完了したら、「Publish」ボタンをクリックして設定を保存できます。

Publish album

ステップ4.フォトアルバムをWordPressサイトに埋め込む

アルバムの作成が完了したら、次は視聴者とアルバムを共有しましょう。

Publish’セクションの下に、’Envira Album Code’が表示されているはずです。先に進み、あなたのWordPressウェブサイト上の任意の場所にアルバムを埋め込むことができるようにショートコードをコピーします。

envira album code

アルバムの準備ができましたので、投稿やページに追加することができます。

新規投稿を作成するか、既存の投稿を編集するだけです。次に、「+」アイコンをクリックし、「ショートコード」ブロックを選択します。

shortcode block

ここから、’ショートコード’ブロックにコードを貼り付けて、あなたのページや投稿にアルバムを埋め込むことができます。

詳しくは、WordPressのショートコードの使い方をご覧ください。

最後に、上部にある「Publish」または「Update」ボタンをクリックします。

publish envira album

あなたのサイトでは、実際にアルバムを見ることができます。

ギャラリーとアルバムの設定の仕方にもよりますが、アルバムはこのようになるはずです:

photo gallery with album example

各写真をクリックすると、ライトボックスが外観表示され、矢印をクリックして各ギャラリーを移動することができる。

すべてです。これでWordPressでアルバム付きフォトギャラリーを追加する方法がわかりました。

lightbox example

ボーナスのヒントWordPressでレスポンシブスライダーを追加する

フォトアルバムはギャラリーを整理するのに最適ですが、スライダー形式で画像を表示したい場合もあります。

スライドショーでは、画像や動画をさまざまなスライドで表示することができます。ユーザーは矢印を使ってスライド間を移動することもできますし、自動再生に設定して自動的にスライド間を移動させることもできます。

YouTubeの最新動画、カスタマーレビュー、WooCommerceの人気商品などをハイライトするのに最適な方法です。

これを行うには、単にSoliloquyプラグインをダウンロードする必要があります。Soliloquyは、メディアライブラリの画像を使用して簡単にスライドを作成することができます最高のWordPressスライダープラグインです。

一度アクティベートすれば、あとは新しいスライダーを追加するだけです。そして、Soliloquyで画像や動画をアップロードし、各メディアアイテムにタイトル、キャプチャ、altテキストを付与することができます。

スライダーがアップロードされると、以下のようになるはずです:

seedprod-slider-example

詳細なチュートリアルについては、WordPressでレスポンシブスライダーを追加する方法のステップバイステップガイドをご覧ください。

動画チュートリアル

その前に、WordPressでフォトギャラリーアルバムを作成する方法についてのビデオチュートリアルをぜひご覧ください:

Subscribe to WPBeginner

この投稿がWordPressでアルバム付きフォトギャラリーを作成する方法のお役に立てれば幸いです。また、WordPressでNextGENからEnvira Galleryに切り替える方法についてのガイド、またはWordPressの画像圧縮プラグインのエキスパートによるベストピックもご覧ください。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

情報開示 私たちのコンテンツは読者支援型です。これは、あなたが私たちのリンクの一部をクリックした場合、私たちはコミッションを得ることができることを意味します。 WPBeginnerの資金源 をご覧ください。3$編集プロセスをご覧ください。

アバター

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

究極のWordPressツールキット

ツールキットへの無料アクセス - すべてのプロフェッショナルが持つべきWordPress関連製品とリソースのコレクション!

Reader Interactions

4件のコメント返信を残す

  1. Darcy

    Loved your video. It’s exactly what I was looking for. The problem I ran into was that the addons look like you have to pay for them now. They looked free in the video. Is there a good plugin that you know of for multiple albums on a page? Any help would be appreciated. Thanks

    • WPBeginner Support

      Apologies, we were using the paid version of this plugin for this tutorial, unless I hear otherwise we don’t have a recommended alternative at the moment.

      管理者

  2. Anneke

    Hi there,
    The video is very comprehensive, thank you. I want to download the stand alone albums add on but the only way I can do it is by paying for it. Is there a free way to display our pictures as albums? We are travellers on a budget!
    Many thanks,
    Tane and Anneke

  3. mats

    Hallo,
    thanks for that tut!

    Is it possible that a user can upload his own photos and see only his own photos on his gallery site? Do i need specific albums for each user?

    thanks :)

返信を残す

コメントありがとうございます。すべてのコメントは私たちのコメントポリシーに従ってモデレートされ、あなたのメールアドレスが公開されることはありませんのでご留意ください。名前欄にキーワードを使用しないでください。個人的で有意義な会話をしましょう。