メンバー ディレクトリ テンプレートを使用してユーザー ディレクトリを作成する方法

メンバー ディレクトリ テンプレートを使用すると、WordPress サイトに大量の情報を整理された美しい方法で簡単に表示できます。

ユーザー リスト ディレクトリの機能は、オンライン データベースを管理することです (たとえば、スタッフ、ネットワーク内の企業、トピックの専門家、またはその間のあらゆるもの)。 メンバー ディレクトリ (ユーザー リスト) は、訪問者にナビゲートしやすい検索およびフィルター機能を提供します。 ディレクトリはネットワーキングと取引の機会を生み出し、人々がつながり、コミュニティに参加できるようにします。 さらに、多くの SEO およびマーケティング上の利点もあります。

このチュートリアルでは、事前に作成された 5 つの Profile Builder メンバー ディレクトリ テンプレートの 1 つを使用して、洗練された美しい、そして最も重要な便利なメンバー ディレクトリを作成します。 ユーザーフレンドリーなテンプレートを使用すると、コーディングの知識は必要ありません。 完璧なユーザー、スタッフ、またはビジネス ディレクトリを作成するための手順を順を追って説明します。

メンバー ディレクトリ テンプレートを含むユーザー リスト ディレクトリ プラグインが必要なのはなぜですか?

サイトの手動の情報リストまたは情報テーブルを作成することは可能ですが、有用な方法でリストを提示することは困難です。 リストが長く複雑な場合は、並べ替えまたはフィルター機能を追加する必要があります。そうしないと、ユーザーが必要なものを取得できなくなります。 そして、マニュアルのリストを更新し続けるのは悪夢です!

適切に統合されたユーザー リスト プラグインは、テーブルやリストよりも保守がはるかに簡単であるだけでなく、他の方法でも役立つメンバー ディレクトリを提供します。 数回クリックするだけで、Web サイトのさまざまな部分にいくつかの異なるメンバー ディレクトリを作成できます。 さらに重要なことに、Profile Builder プラグインは、実際には 4 つの重要な WordPress 機能の組み合わせです。

• ユーザーフォームを通じてユーザーから必要な情報を取得する機能、
• この情報を使用して、ユーザーとその役割と機能を管理します。
• サイトのセキュリティを損なうことなく、
• 会員名簿を通じて有益な情報を美しく表示することができます。

メンバー ディレクトリ テンプレートを使用してメンバー ディレクトリを作成する方法の説明

このセクションでは、プロファイル ビルダーのメンバー ディレクトリ テンプレートの 1 つを使用してユーザーのリストを作成する例を段階的に説明します。

ステップ 1: Profile Builder Pro のインストール、セットアップ、および登録

最新の WordPress インストールと適切なテーマが必要です。 このチュートリアルでは、Hello Elementor テーマを使用します。 植物の販売者に専門分野を提供するよう依頼し、その情報を使用して、専門の植物販売者のフィルター処理されたリストを表示します。

Profile Builder PRO プラグインも必要です。 まず、お客様のニーズに最適な Profile Builder プランを選択してください。 登録と支払いが完了すると、購入を確認するメールが届きます。

Cozmoslabs アカウントにログインします。 [ダウンロード] タブに移動します。 Profile Builder の Main および Pro 圧縮ファイルをコンピューターにダウンロードします。 次に、WordPress ダッシュボードのプラグインページに移動します。 両方のアーカイブを一度に 1 つずつ Web サイトにアップロードします。 毎回 [インストールと有効化]をクリックします。

WordPress パネルに設定したら、すべての機能にアクセスするには PRO バージョンを登録する必要があります。 Profile Builder → バージョンの登録に移動して、サイトを登録することにより、Web サイトと Profile Builder PRO 間の接続を作成します。 Cozmoslabs アカウント ページの[ライセンス] タブに表示されるキーまたは SR (シリアル番号) を使用します。 登録に関してサポートが必要な場合は、このステップバイステップのドキュメントをご覧ください。

ステップ 2: 登録ページをカスタマイズする

他の高度なプラグイン (WooCommerce など) と同様に、Profile Builder プラグインは新しいページを自動的に作成できます。 [フォーム ページの作成] ボタンをクリックします。 プロファイルの編集、ログイン、登録ページが作成され、WordPress ダッシュボードの[ページ] タブに移動します。 新しいプロファイルの編集、ログイン、および登録ページは、Web サイトのルック アンド フィールに完全に統合されます。 確認するには、ホバー時に表示される[表示] ボタンをクリックします。

または、Profile Builder ページを識別する最も簡単な方法は、メインの Profile Builder ページに移動し、大きな青いボタン[View Form Pages ] をクリックすることです。 ページ → すべてのページに移動することもできます。

事前に作成された登録ページが見つからない場合、または新しい登録ページを追加したい場合は、新しい登録ページを作成できます。 フォーム フィールド ページから登録ページのショートコードをコピーし、空白のページに貼り付けるだけです。

もう 1 つのショートカットは、Gutenberg ブロック メニューからProfile Builder の登録ブロック(またはその他のユーザー フォーム) を選択することです。

注:登録ページと登録フォーム自体の両方をカスタマイズできることに注意してください。 登録ページには、ユーザーがサインアップする目的を確実に理解できるように、すべての関連情報を含める必要があります。 登録ページの登録フォームには、ビジネス モデルとユーザー リストに役立つフィールドが含まれている必要があります。

次のステップでは、事前に作成された登録フォームをカスタマイズして、特に必要なフィールドを追加し、冗長なフィールドを削除し、特別な値のフィールドとルールを追加して不正なアクションを防止します。

フォームをカスタマイズする

ダッシュボード タブのProfile Builder → Form Fieldsに移動します。 User Listing Add-onsを有効にするプロンプトが表示されます。 プロンプトを見逃した場合は、[アドオン] ページに移動してアドオンを有効にすることができます。 最初のフォームのカスタマイズを開始する前に、 User Listing、Multiple Registration Forms 、 Multiple Edit Profile Forms アドオンを有効にすることをお勧めします。

デフォルトの作成済みフォームのカスタマイズを始めましょう!

新しいフォームには、デフォルトで、このステップでカスタマイズしたすべてのフィールドが含まれます。 Profile Builder登録フォームページに移動し、[新規追加] をクリックして、新しいフォームまたは別のフォームを作成できます。

注: デフォルトのフォームはこのページには表示されません。 この元のデフォルト フォームを編集するには、Profile Builderフォーム フィールドページに移動します。

登録フォームには、ビジネス マネージャーとして必要なフィールドが含まれている必要があります。 この例では、フォームを変更して、登録者に植物取引の専門分野、場所、および連絡先情報を提供して、メンバーのビジネス ディレクトリを作成するように依頼します。

Profile Builder には、各登録フォームの基本的なデフォルト フィールドがいくつか含まれています。 ページを下にスクロールすると、それらが表示されます。 削除するフィールドの横にある[削除]ボタンをクリックします。 新しいフィールドの追加を開始するには、 [オプションの選択] メニュー フィールドの矢印をクリックし、ポップアップ メニューをスクロールして選択可能なフィールドのリストを表示します。

[フィールドの追加] ボタンをクリックする前に、目的のフィールドを選択し、必要に応じてカスタマイズします。 この例では、フィールド タイトル 'Specialist Field'を追加し、複数選択フィールド タイプを選択し、いくつかのオプション(サボテン、低木、樹木など) を追加しました。

次のステップでは、これらすべてのフィールドからの情報をメンバー ディレクトリまたはユーザー リストに表示して、Web サイトの訪問者にとって役立つ情報にする方法を学習します。

ステップ 3. WordPress ユーザー リストを作成する

ステップ 2 で述べたように、先に進む前にUser Listing アドオンを有効にする必要があります。 User Listing、Multiple Registration Forms、Multiple Edit Profile Formsアドオンを有効にすることをお勧めします。

WordPress ダッシュボードで、[プロファイル ビルダー] タブの下にある[ユーザー リスト]を探します。 クリックして。 ユーザー リスト ページには、ショートコード[wppb-list-users name="userlisting"]を持つ Userlisting と呼ばれる既製の公開済みマスター デフォルト ユーザー リストが表示されます。

ユーザー リストを初めて使用する場合は、このリストを編集しないことをお勧めします。これは、学習中にデフォルト設定の便利なリファレンスとして役立つ可能性があるためです。 また、このマスター リストを使用して、フィルタを追加せずに Web サイトのすべての情報を表示することにも注意してください。

上部にある [新規追加] ボタンをクリックして、ユーザー リスト (メンバー ディレクトリ) にタイトルを付けます。

注: [新規追加] ボタンが見つからない場合は、必要なアドオン (ユーザー リスト、複数の登録フォーム、および複数の編集プロファイル フォームのアドオン) が有効になっていることを確認してください。

ユーザーリスト設定のカスタマイズ

この例では、使用済みリスティング タイトル「プラント スペシャリスト」を使用し、表示されるロールを「寄稿者」と「購読者」に制限しました。 ユーザー リスティングにタイトルを付けたら、他の基本設定まで少し下にスクロールします。 含めるユーザー ロールと、ユーザー リストでの表示方法を選択できます。

たとえば、ログインしているユーザーのみがディレクトリを表示できるように、ログインしていないユーザーに対してユーザー リストを非表示にすることができます。 [ログイン ユーザーのみに表示] を選択する必要がある場合は、さらにメニュー オプションが表示され、すべてのログイン ユーザーに表示するか、顧客、サブスクライバーなどに表示するかをさらに選択できます。[ *]ボックスにチェックを入れて、ログインしているすべてのユーザーに表示されますが、機密情報をすべてのユーザーに公開することには注意してください。

ファセット メニューのカスタマイズ

ページの次のセクションはファセット メニューです。 ファセットを追加するということは、ユーザー リスト ページで使用できるフィルターを選択することを意味します。 ほとんどのユーザーは、ショッピング サイトでフィルターを使用することに慣れています。 そのため、ユーザーが使い慣れているのと同じ種類のフィルターを追加して、ユーザーがサイトから必要な情報を取得できるようにすることができます。 たとえば、場所、専門分野、年齢などで検索結果をフィルタリングできるようにすることができます。

メンバーを植物の専門分野で並べ替えるフィルターを追加するので、ページに表示するラベルとして「専門分野」と入力しました。 このファセット メニューの例では、ユーザーが複数のオプションを同時に選択できるようにするため、[ファセット タイプ] として[複数選択] を選択しました。 ファセット メタフィールドでは、ドロップダウン メニューを使用して、フィルター (ファセット メタ) のソースとして「スペシャリスト イン」フィールドを選択しました。

[エントリを追加] をクリックします。 同じ手順を繰り返して、必要な数のフィルターを追加します。 [エントリの追加] をクリックするとすぐに、新しいフィルタが [エントリの追加] ボタンのすぐ下のフィルタ (ファセット) の概要に表示されます。

これは、フィルターがフロントエンドでどのように見えるかです:

検索設定のカスタマイズ

次に、Profile Builder が情報を検索して検索バーを機能させる方法を選択します。 このセクションは、同じページのファセット メニュー セクションのすぐ下にあります。 訪問者が検索バーでキーワードを検索するときにスキャンする情報にチェックを入れるか選択を解除して、検索機能を選択します。

メンバー ディレクトリ テンプレートを使用してディレクトリを作成する

最後のセクションでは、メンバー ディレクトリ テンプレートを選択し、フォーマットをカスタマイズして、Web サイトのフロント エンドでリストを表示する方法をカスタマイズします。 ご存じのとおり、Web サイト全体のさまざまな要素のデザインとフォーマットを標準化するには、何時間もかかる場合があります。 そのため、Profile Builder には、ユーザー リスト ページ用に 5 つのデザイン済みテーマが用意されています。

デフォルトのテーマに加えて、他に 4 つのカスタム テーマがあります。 それぞれ、テーブル、グリッド、ボックス、またはリストを表示する最適な方法を表しています。 それぞれの上にマウスを置くと、テーマをプレビューするためのボタンと、それをアクティブにするためのボタンが表示されます。

各テンプレートには、Web サイトに番号付きリストとして表示されるメンバー ディレクトリ (ユーザー リスト) 表示と、メンバー リストの各エントリの個別のページが含まれています。 そこには、各メンバーの詳細情報が表示されます。

メンバーシップ ディレクトリ テンプレートは出発点として最適ですが、各テーマをさらにカスタマイズできます。 ここでは、最も見栄えがよく、表示する情報の種類に最も適していると思われるものを選択してください。 別のテーマに簡単に切り替えることができ、HTML と CSS は新しいスタイルに自動的に更新されます。

Defaultテンプレートには最小限の並べ替え機能しか表示されないため、この例ではTablesiテンプレートを使用して、目立つフィルター ボタンとディレクトリ検索フィールドを示しています。

タグを使用して表示するユーザー情報をカスタマイズする

メンバー ディレクトリに表示する情報をカスタマイズするには、下にスクロールして、 「すべてのユーザー リストのテンプレート」という小見出しを表示します。 次のようになります。

注: All-Userlisting Templateは、Web サイトに表示されるメンバー ディレクトリ(ユーザー リスト) をカスタマイズするためのものです。 Single-Userlisting Templateは、ユーザーがメンバー ディレクトリの [詳細] ボタンをクリックしたときに、個々のメンバーの詳細をカスタマイズするためのものです。 私たちはすぐにそれを取得します!)。

デフォルトの表示フィールドで問題ない場合は、すべてをそのままにしておくことができます。 ユーザー ディレクトリに情報を追加または削除する場合は、右側の表示列の右側に、各リスト タイプで使用できる Profile Builder タグがすべて表示されます。 この例では、次の図に示すように適切な行を削除することで、メンバー ディレクトリ テンプレートから「投稿数」を削除しました。

最後に、訪問者がメンバー ディレクトリの [詳細] または [表示] ボタンをクリックしたときに、個々のエントリがどのように表示されるかをカスタマイズしましょう。 Single-Userlisting テンプレートまで下にスクロールします。

この例では、シングル ユーザー テンプレート(個人のプロファイル リスト) に別のラベル、「Specialist In」ラベルを追加します。 「スペシャリスト」タグと右側のタグを強調表示してコピーし、左側に貼り付けるだけです。

リセット機能でミスを修正

特に多くのカスタマイズを行っている場合は、間違いが発生する可能性があります。 幸いなことに、最初からやり直すためにデフォルト設定を復元できます。 一般的なユーザーリスティング設定、すべてのユーザーリスティング テンプレート、または単一ユーザーリスティング テンプレートのいずれかをリセットするか、すべてをリセットして最初からやり直すことができます。 メンバー ディレクトリ テンプレート セクションまでスクロールして戻ります。 アクティブなテーマにカーソルを合わせます。 [データのリセット] ボタンをクリックし、リセットする設定を選択します。

ステップ 4: メンバー ディレクトリ テンプレートの発行

カスタマイズに満足したら、上部にある [公開] ボタンをクリックします。 これにより、ユーザー リストのショートコードが生成され、サイトの任意のページに貼り付けるか、Gutenberg ブロックを介して挿入できます。

そして：タダ！ これは、ウェブサイトのフロント エンドに表示される新しい会員名簿です。 Tablesi メンバー ディレクトリ テンプレートの目立つフィルター ボタンに注意してください。 見た目が気に入らない場合は、別のテンプレートを選択してください。

次の図は、メンバーシップ ディレクトリ テンプレートの 1 つを使用した場合に、個々のユーザー情報ページがどのように表示されるかを示しています。 サイトへの訪問者は、ディレクトリ リストの [表示] または [詳細] ボタンをクリックして、このページにアクセスできます。

結論

Profile Builder Pro プラグインを使用すると、サイトに真の価値を追加する方法でユーザーを簡単にリストできます。 ユーザー登録フォームとユーザー リスト表示用の事前に作成されたテンプレートを使用すると、時間 (および費用) を節約できます。 Profile Builder Pro は、ビジネスに新しい収益化の機会を追加することが保証されている 5 つの使いやすいメンバー ディレクトリ テンプレートを提供します。

数回クリックするだけで、あなたのウェブサイトを新しいレベルに引き上げましょう: Profile Builder Pro をここからダウンロードしてください!

プロファイル ビルダー プロ

カスタム フィールドを使用して、美しいフロントエンドの登録フォームとプロフィール フォームを作成します。 オールインワンのユーザー管理プラグインを使用して、メンバー ディレクトリのセットアップ、カスタム リダイレクト、ユーザー メールのカスタマイズなどを行います。

プラグインを入手する

または無料版をダウンロード

Profile Builder を使用して、Web サイト用に 1 つまたは複数のメンバー ディレクトリまたはビジネス ディレクトリを作成したことがありますか? 他の人がウェブサイトの可能性を最大化できるように支援します。 以下のコメントセクションであなたの経験を共有してください！