User Directory Block – Complete User Guide

If you want to create a WordPress user directory or a membership listing without custom code, the User Directory Block is your starting point. This block acts as the main container for displaying users on your site in different layouts (table, cards, or grids).

Whether you’re building a team page, community directory, or author list, the User Directory Block gives you full control over search, sorting, roles, and layout, directly inside the Gutenberg editor.


What is the User Directory Block?

The User Directory Block is the backbone of the WPUF User Directory system. Think of it as a digital phone book that organizes your users into a professional, searchable, and customizable listing.

What You Can Do With It

  • Display lists of users (team, staff, members, authors, etc.)
  • Enable search to quickly find specific users
  • Allow frontend sorting by name, email, registration date, and more
  • Control how many users appear per page (pagination included)
  • Show only certain user roles or exclude others
  • Choose from multiple layouts (table, card, or grid)
  • Add user details (avatar, name, bio, contact info) using inner blocks

Getting Started

  1. Step 1: Add the Block
    Open your WordPress page or post in the block editor.
  2. Click the “+” button to add a new block.
  3. Search for “User Directory”.
  4. Select WPUF – User Directory to insert it.

Step 2: Choose Your Layout

When you add the block, you’ll see layout options:
Round Grids, Square Grids, Sidecards, Wide Sidecards, Table

Step 3: Add User Information Blocks

Inside the User Directory Block, you can add supporting blocks like:

  • User Avatar – Profile pictures
  • User Name – Display names
  • User Bio – Biographies
  • User Contact Info – Emails, websites, phone numbers
  • User Social Fields – Social media links
  • User Custom Field – Any custom usermeta
  • User Posts / Comments / Files – User-generated content
  • Profile Button – Links to individual user profiles

Block Settings

Click the User Directory Block to configure its settings in the sidebar.

🔹 Layout Settings

  • Choose Different Layout – Switch between table, card, and grid designs.
  • Users Per Row (Grid Layouts) – Control how many users appear per row (e.g., 1, 2, 3, or 4).

🔹 Display Options

User Roles

  • All Roles – Show all users (default).
  • Specific Roles – Display only Administrators, Editors, Authors, etc.
  • Multiple Roles – Select multiple roles for inclusion.

Exclude Options

  • Exclude Roles – Hide users from specific roles.
  • Exclude Users – Hide specific individual accounts.
  • Max Profiles Per Page – Control pagination (1–50 per page).

🔹 Search Options

  • Toggle ON to show a search bar.
  • Toggle OFF to hide search.

Search Settings (when enabled)

  • Search Placeholder – Text inside the search box (default: “Search Users”).
  • Searchable Fields – Choose which fields are searched:
    • Username
    • Email
    • Display Name
    • First Name
    • Last Name
    • Custom fields (e.g., job title, department)

🔹 Sorting Options

Enable Frontend Sorting

  • Toggle ON to let visitors sort results.
  • Toggle OFF to use only the default sort order.

Sort Settings

  • Available Sort Options – Select from:
    • User ID
    • Username
    • Email
    • Display Name
    • Registration Date
  • Default Sort Order – Ascending (A–Z) or Descending (Z–A).

Layout Options in Detail

Table Layout

  • Best for: Business directories, author lists, structured data.
  • Features: Displays users in a traditional table.
  • Special Settings:
    • Show Avatar – Toggle avatars in the table.
    • Avatar Size – Small, Medium, or Large.
    • Avatar Shape – Circle or Square.
    • Avatar Fallback Type – Show initials when no avatar is available.
    • Table Columns – Choose which columns to show (e.g., email, display name, role).

Other Layouts: Round Grids, Square Grids, Sidecards, Wide Sidecards

  • Extra design options for different site styles.
  • Choose the one that fits your branding best.

Search Functionality

  • Visitors can type into the search box.
  • The system checks the selected searchable fields.
  • Results update instantly with matching users.

Search Tips:

  • Enable multiple fields for flexibility.
  • Include custom fields if your users have specific metadata.
  • Always test search with real user data.

Sorting and Organization

  • Default Sorting → Set the default order (e.g., by display name ascending).
  • Frontend Sorting → Let users sort dynamically.
  • Pagination → Adjust how many users show per page.

Unlock the User Directory module with WPUF Professional and start showcasing your users beautifully. Get it directly from weDevs site.


Use Cases

Member Directory

Layout: Modern Cards
Roles: All Roles
Search: Enabled
Sort: Display Name (Ascending)
Blocks: Avatar, Name, Bio, Profile Button

Team Page

Layout: Professional Grid
Roles: Administrators + Editors
Search: Enabled
Sort: Display Name (Ascending)
Blocks: Avatar, Name, Custom Field (Job Title), Contact Info

Author Directory

Layout: Classic Table
Roles: Authors + Editors
Search: Enabled
Sort: Registration Date (Descending)
Table Columns: Email, Display Name
Blocks: Avatar, Name, Posts, Profile Button

Troubleshooting

Directory is Empty

  • Wrong roles selected.
  • Excluded all users.
  • Check User Roles setting.

Search Not Working

  • Search disabled.
  • No searchable fields selected.
  • Users lack data in those fields.

Layout Looks Wrong

  • Too many blocks inside each user card.
  • Try switching layouts.
  • Test mobile responsiveness.

Performance Issues

  • Too many users per page.
  • Too many searchable fields.
  • Use caching plugin for optimization.

Tips & Best Practices

  • For Beginners → Start simple with avatars, names, and profile buttons.
  • For User Experience → Always enable search and keep pagination reasonable.
  • For Performance → Optimize avatars and limit search fields.
  • For Mobile → Use card or grid layouts (Layout 2 or 3).

Success Checklist

Before you publish your directory:

  • ✅ Added the User Directory Block
  • ✅ Chosen a layout (table, card, or grid)
  • ✅ Added supporting blocks (Avatar, Name, Bio, etc.)
  • ✅ Configured user roles, exclusions, and pagination
  • ✅ Enabled search and/or sorting if needed
  • ✅ Set table-specific settings (if using Layout 1)
  • ✅ Tested on mobile and desktop
  • ✅ Previewed the final result

With the User Directory Block, you can turn WordPress into a flexible membership or team directory, styled exactly the way you want, directly in Gutenberg.

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *