How to Set Up a Membership Directory With Photos on Your Site — Easy Template

Do you have a committed group of members and everything you need to manage their information on your end?

Great — maybe that’s all you need.

Or maybe you need to take things one step further and let your members, or even the public, know who is in your organization.

Letting people know who their peers are, what role they play and how they can be reached can be empowering. Depending on what your organization does, it might help your members better engage with and contribute to your work.

If this sounds like something you could benefit from, read on to learn about how to set up a membership directory with photos with this easy template. It takes no time at all, and can save you hours of responding to questions from members or the public about who is who and who does what in your organization.

Your membership directory will be a page on your website where visitors can see a list of your members, search for members using various criteria and view member profiles. Everything is completely customizable, so you and your members have control over what information is visible and who has the permission to see it. You can even have multiple directories on your site, each with different settings but all using the same basic template.

If you’re ready to learn how to easily set up your member directory and add photos, let’s get started!

Step 1: Start a WildApricot Trial

Start a free, 60-day trial of WildApricot. This will allow you to quickly and easily put together your membership directory.

To access your free trial, simply enter your info and click Activate your WildApricot account.

Step 2: Complete the Setup Guide (Optional)

Once your account is activated, you’ll be asked if you’d like help setting up your trial. If you choose yes, then you’ll be taken through an easy setup guide that will help you hit the ground running.

If you choose to skip the guide, you’ll be taken straight into the back end of your new WildApricot website. For the purposes of this tutorial, I’ll take you straight to the back end of your WildApricot website.

Step 3: Create Your Member Directory Webpage

Now you’re all ready to start building your membership directory! Once you’re in the back end of your WildApricot website, within the Website module, click on the Site Pages tab, then click on Add page.

You’ll be able to add any pages you wish to your website here, but for the purposes of this post, we’ll focus on the membership directory.

Step 4: Customize Your Page Settings

Here you can name your new page something like “Member Directory” and update the page URL to reflect the new name. You can also change the page’s position in the menu and change whether the page is visible to the public or only to administrators.

Step 5: Add a Member Directory Widget

When you’re done changing the page settings, click on the Gadgets icon in the top left corner. Then, find the Member Directory gadget under Members & Contacts and drag the gadget onto the blank page, next to an existing gadget. (In the screenshot below, we’re dragging the gadget right below the existing header.)

Note: You cannot add a Member Directory gadget (or any other singular gadget like a blog, discussion forum, donation form, events calendar, etc.) to a page that already contains another singular gadget. If the Member Directory gadget is greyed out, you may already have a singular gadget on this page.

Your Member Directory will automatically pull your contacts into a list, and will look something like this:

Step 6: Customize Your Member Directory Widget Settings

When you hover over the Member Directory, you’ll be able to see the Settings icon in the top right corner. Once you click that, a menu will appear in the side panel on the left. This is where you can choose which member records are displayed and in what order, as well as what fields are displayed for each member and in what order.

Let’s dive deeper into these settings and what each of them mean:

Members to include:

• All members: include all members with a membership status of Active or Pending Renewal.

• From saved search: when you select this option, a dropdown menu will appear where you can choose from your list of saved searches. This will limit members to only those that match the saved search criteria.

• Selected levels: when you select this option, a menu will appear where you can select one or more membership levels.

• Selected groups: when you select this option, a menu will appear where you can select one or more member groups.

• Show bundle administrators only: A membership bundle is a collection of members who are linked together and managed by one of their members – the bundle administrator. Selecting this option will include only bundle administrators and will exclude individual members of bundles. The profiles of individual bundle members will still be accessible from the bundle administrator’s profile.

Customize results layout:

This allows you to control the order in which members are listed in the directory. Clicking on it will open up this menu:

You can click Sort by under Sorting order and choose the field to sort the member records by. If you want to display matching records in random order, select the Random option instead of a field. Otherwise, select Asc or Desc to sort records in ascending or descending order.

Optionally, you can choose up to 2 more fields to sort by. The records will be displayed in order according to the values of the first field, then any duplicate values will sorted by the second field, and so on. For example, you might want to sort by membership level, then by last name, and finally by first name.

The rest of the Customize results layout menu will help you control what information is displayed for each member.

You can choose up to 4 columns to be displayed for each member, and pick up to 3 database fields to be combined in each column. For example, you could combine first name, last name and the member’s photo in column 1; phone number and email address in column 2; country in column 3; and membership level in column 4. For each column, you can specify the column width and the column heading. ›

Click Apply and Save. Your Member Directory with photos will look something like this:

Note: When searching for members using the simple search, only those columns you choose here will be searched. 

The first field of the first column will automatically appear as a link to the member’s public profile page.

A note about member photos: in order to have the option to include a member photo in the directory, it must be one of your common fields. This will be where you, as the site administrator,  can upload any profile photo to the database or let members upload their own photos. For more details on how to add profile photos, read this article on the WildApricot Get Help site. 

Search Options: 

Here you can control how visitors can search the member directory by enabling or disabling the following options:

Enable quick filtering in simple search: this allows visitors to filter the member list by a specific contact or membership related field (multiple choice, radio buttons or dropdown field types only). You can choose up to 4 fields to include here.

In this example, we’ve selected the field “Country”, so at the top of the directory, users will be able filter by the available countries. Clicking on “Canada”, for example, will sort the list so that only users from Canada will be shown:

Enable advanced search: this allows visitors to search by various fields — you can choose which fields are enabled. When visitors click “Advanced Search”, they will see something like this:

Show advanced search by default: when this is checked off, visitors will automatically see the option for advanced search.

Step 7: Other Customizations

You can also add a title and description for your member directory by dragging a content gadget into the space above the member directory gadget.

Finally, a quick note on privacy options. As a site administrator, you have control over what kind of information is shown to the public, but members can also choose which of their fields are viewable to others. If something isn’t showing up in the directory or isn’t searchable, it’s likely because you or the member have set this piece of information to be private. Members who have set their entire profiles to private will not appear in the directory at all.

Well, there you have it: setting up your membership directory with photos is as easy as dragging a gadget onto your webpage and customizing a few options. Don’t forget to click Save often as you make these changes, so you don’t lose any progress.

Once your directory is set up, any changes you make to your contacts moving forward will automatically be updated in the directory, making this a useful and easy to use tool.

If you’d like more details on further customizing your Member Directory, as well as answers to common troubleshooting issues, visit the WildApricot Get Help site.

Or, if you need to pitch it to your board before trying it out, here’s how you can do so.

Best of luck setting up your member directory!