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ではこのようなことはできないので、私たちは簡単な解決策を探すことにしました。この記事では、WordPressでフィルタリング可能なポートフォリオを簡単に作成する方法を紹介します。

How to Create a Filterable Portfolio in WordPress

なぜWordPressでフィルター可能なポートフォリオを作るのか?

ほとんどのフォトグラファーやデザイナーは、最高の写真を見せる美しいポートフォリオを作成します。しかし、あなたを雇いたいと考えている人は、あなたが以前に同じようなことをしたことがあるかどうかを確認したいと思うことがあります。

例えば、ファッションフォトグラファーを探している人は、あなたのファッション関係の過去の仕事を見たいかもしれません。

ポートフォリオにフィルターを追加することで、異なるタグで作品を表示することができます。また、ユーザーがポートフォリオの項目を簡単に並べ替えることができます。

Filterable Portfolio Example

とはいえ、コードを書かずにWordPressウェブサイトに簡単にフィルタリング可能なポートフォリオを作成する方法を見てみましょう。

WordPressでフィルター可能なポートフォリオを作成する

まず、Envira Galleryプラグインをインストールして有効化する必要があります。詳細については、WordPressプラグインのインストール方法のステップバイステップガイドを参照してください。

Envira GalleryはプレミアムWordPressプラグインです。タグアドオンにアクセスするには、少なくともプラスプランが必要です。

詳細はEnvira Galleryのレビューをご覧ください。

有効化した場合、Envira Gallery ” 設定ページにアクセスし、ライセンスキーを入力する必要があります。この情報は、Envira Galleryサイトのアカウントから取得することができます。

Add Envira Gallery License Key

キーを入力したら、「Verify Key」ボタンをクリックしてください。サイトが更新を受信しているというメッセージが表示されます。

次に、タグアドオンをインストールする必要があります。これを行うには、Envira Gallery ” Addonsページに行き、タグアドオンを見つけてください。

Install Envira Gallery Tags Addon

見つけたら、「インストール」ボタンをクリックしてください。

Envira Galleryがアドオンを取得し、インストールします。

Activate Envira Gallery Tags Addon

これで、フィルター可能なポートフォリオを作成する準備が整いました。

Envira Gallery ” 新規追加ページで最初のギャラリーを作成し、名前を付けてください。

Upload Your Photographs

写真をギャラリーにアップロードしたい場合は、「コンピューターからファイルを選択」ボタンをクリックしてください。

写真がすでにWordPressのメディアライブラリにある場合は、「他のソースからファイルを選択」ボタンをクリックします。

Enviraがこれらのファイルをアップロードし、ギャラリーにインサーターします。それが完了したら、下にスクロールして画像を見ることができます。

詳しくは、WordPressでイメージギャラリーを追加する方法をご覧ください。

Envira Currently in Your Gallery

画像を編集するには、鉛筆のアイコンをクリックする必要があります。

タグやその他のメタデータを写真に追加できるポップアップが表示されます。

Add Tags to Your Photos

この写真に割り当てるタグを入力します。カンマ区切りで複数のタグを追加できます。入力が完了したら、「メタデータを保存」ボタンをクリックしてタグを保存します。

次に、ギャラリー内のすべての画像にタグを追加するプロセスを繰り返す必要があります。

写真にタグを追加した後、ギャラリーページの左にある’タグ’タブをクリックしてください。ここでギャラリーのタグフィルターを有効化または無効化することができます。

Enable Filtering for Your Gallery

タグフィルターを有効化するには、’タグフィルターを有効にしますか?’ボックスをチェックする必要があります。

タグをギャラリーの上または下に表示したり、すべてのタグを表示したり、表示するタグを選択したり、その他の表示設定を行うことができます。

完了したら、’公開する’ボタンをクリックしてギャラリーを公開します。これであなたのポートフォリオギャラリーをサイトに追加する準備ができました。

WordPressサイトにフィルター可能なポートフォリオを追加する

フィルタリング可能なポートフォリオを表示する投稿またはページを作成することができます。ブロックエディタを使用している場合は、Envira Galleryブロックを記事に追加するだけです。

Add an Envira Gallery Block to a Post or Page

その後、’ギャラリーを検索’ドロップダウンメニューをクリックし、以前に公開したギャラリーを選択します。

クラシックエディターを使用している場合、投稿またはページタイトルの下にある’ギャラリーを追加’ボタンをクリックしてください。

Add Envira Gallery to Classic Editor

作成したギャラリーを選択し、WordPressの投稿やページに挿入するポップアップが表示されます。

投稿やページを更新して変更を保存し、サイトをプレビューしてフィルター可能なポートフォリオの動作を確認できます。

Preview of a Filterable Portfolio Gallery

Envira Galleryでできることをさらに詳しくお知りになりたい場合は、以下のチュートリアルをご覧ください:

動画チュートリアル

Subscribe to WPBeginner

この記事がWordPressでフィルタリング可能なポートフォリオを追加するのにお役に立てば幸いです。WooCommerceの商品画像ギャラリーの作り方や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

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

  1. Haim

    All the photo galleries I found so far that support Tags allow filtering one tag at a time. I’d like to implement gallery where I can filter based on multiple tags to get the photos having ALL the tags. For that the Tag selection should be in a checkbox form to allow checking more than one. Can anyone point me to such solution for WP? Thanks.

  2. divp

    nice one keep sharing

  3. Lewis

    Really awesome article, I loved this theme and soon I will be hiring a web developer to build me a theme like this. Thanks!

返信を残す

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