User Listing

Note: This module is available only in the PRO version of Profile Builder 2.0.

Front-end User Listing

Version 2 of Profile Builder offers an enhanced and more flexible User Listing module.

You can now create Multiple User Listings to display your users in the front-end of your website in any way you desire.

Displaying your website users in the front-end can be achieved using the User Listing shortcode.

After activating the module from the Modules UI, the User Listing tab will show up in the Profile Builder menu.

Userlisting-menu-tab

Creating a new User Listing

By navigating to the User Listing tab from the Profile Builder menu, you’ll notice a list of all the created User Listings and their specific shortcode.

From here you can also setup a new User Listing by clicking the Add New button at the top.

multiple-user-listings

Note: If you haven’t yet created any User Listings, clicking the User Listing tab will take you directly to the Add New User Listing screen.

User Listing Settings

The Add new User Listing page first asks you to enter a Title, followed by the User Listing Settings box. Then you can customize the All-User listing and Single-User listing templates.

 

In Profile Builder, you can customize each front-end User Listing by choosing:

  • Roles to Display – allows you to display only certain role(s) in the front-end user listing
  • Numbers of Users/Page – control the number of users displayed on each page
  • Default Sorting Order and Criteria– sort by any custom user fields, ascending or descending
  • Default Sorting Criteria– selecting this to Random will list a random list of users. WARNING: do not use this on a large database with over 10K users. It is extremely slow.
  • Avatar Size – control over the avatar size in both all-user listing and single user listing templates
  • Visibility – restrict the User Listing visibility to logged in users only (choose roles)

The All-User Listing Template

The All-User Listing Template allows you to customize the looks of your front-end user listing, that displays a list of all your users.

It’s shown on each page where the User Listing shortcode is present.

Customizing your User Listing Template

The All-User Listing Template contains a default HTML template which includes user tags, that you can modify to fit your needs.

all-userlisting-template
In the default All-User Listing Template, you’ll have access to:

  • Meta Variables – giving you access to all the user information (fields).
    When rendered in the front-end, this will return the field values for each user.
    Must be used within the {{#users}} and {{/users}} conditional tags.
  • Sort Variables – for inserting a sort by user field (either default or custom).
    When rendered in the front-end, this will translate into a link which once clicked will sort the users by that given field.
  • Extra Functions – you can easily add extra functions in your user listing template.
    Things like Pagination and a Search All Fields can be used to customize the user listing by copy/pasting them into the template.

    • Search All Fields – this function will search in all meta fields or you can use Search Settings to choose the fields in which the search will look in.

userlisting3

Faceted Search Menus

Faceted Menus let you search users by selecting multiple options saved in user meta.

userlisting1

In Extra Functions you have access to Faceted Menus tag: {{{faceted_menus}}} that you can use to display search options in the userlisting page.

userlisting4

Customize your faceted menus the way you want.

userlisting2

  • Facet Type – select the type of facet displayed on userlisting page: checkboxes, select, range, search.
  • Facet Meta – choose the meta field to add as a search option.
  • Behaviour (only for Checkboxes Facet Type):
    • Narrow the result – only 1 checkbox can be checked.
    • Expand the results – multiple checkboxes can be checked.
  • Visible Choices (only for Checkboxes Facet Type) – choose what options to display, otherwise all options will be displayed as checkboxes.

The Single-User Listing Template

The Single-User Listing Template applies for all individual user pages displayed in the front-end.

You can access the Single-user listing by clicking the “More” link from the All-user listing page.

The Single-user listing template contains a default HTML template which includes user tags, that you can modify to fit your needs.

single-userlisting-template

In the default single-user listing template, you’ll have access to:

  • Available Variables – giving you access to all the user information (fields).
  • Extra Functions (e.g. Go Back Link tag)

Single User Listing Shortcode

You can display the Single User Listing Template of a user inside a page using:

[wppb-list-users single name="userlisting" id="3"]

Supported parameters:

  • name – Inside the name parameter we define the template that will be used. If the name is not specified it will display the default template
  • id – Inside the id parameter we define the user ID. If the ID is not specified it will display the current logged in user Single User Listing template.

User Listing shortcode

After setting up your settings and templates, you can go ahead an publish the User Listing using the “Publish” button.

After publishing your user listing, the Form Shortcode box below will populate with the custom shortcode you can use to display the newly created user listing in any given page.

userlisting-shortcode-1

You can add extra parameters to the shortcode, to further filter the results.

Here’s a look of how the User Listing page might look in the front end of your website:

Frontend User Listing - WordPress Profile Builder

And this is the single user profile page:

User Listing Single WordPress Profile Builder

As shown above, both the All-userlisting and Single-userlisting templates can be styled in any way you desire, directly from plugin UI.