WBD Team Member – Gutenberg Block

WBD Team Member is a Gutenberg team showcase plugin for WordPress that helps you create professional team pages, employee profiles, staff directories, and Meet the Team sections without coding.

Live Demos | Pricing | Support

Build a responsive WordPress team showcase directly in the Gutenberg block editor. Display team members with profile photos, names, job titles, biographies, social media links, and contact buttons. Choose from six free layouts and customize your team section to suit your website.

Whether you run a business, digital agency, startup, school, nonprofit organization, or corporate website, WBD Team Member makes it easy to introduce your people and highlight their roles.

🌟 Key Benefits:

• Gutenberg Native: Works directly within the block editor. No bulky or bloated third-party page builders needed.
• 100% Responsive: Optimized for all devices—looks outstanding on mobile, tablet, and desktop screens.
• Ultra-Lightweight & Fast: Zero jQuery dependencies, clean CSS/JS, and built-in lazy loading for elite performance.
• Unlimited Styling Options: Customize every detail to match your brand identity with typography, margins, and borders.

Free Features & Layouts

• 6 Pre-Designed Standard Layouts:
  • Corporate & Agency: Ultra-clean, professional grids for modern business websites.
  • Creative Hover & Image Overlay: Sleek CSS transitions that reveal details elegantly.
  • Minimal Card & Centered Profile: Classic, high-end card styles with smooth alignments.
  • Left Aligned: Modern horizontal team list layouts.
• Add Unlimited Team Members: Showcase your entire team or organization with no arbitrary limits.
• ** Custom Post Type & Shortcode Support:** Manage team showcases globally under CPT menu and embed using [team_showcase id="..."] anywhere (Elementor, Gutenberg, Widgets).
• Google Fonts & Custom Font URL: Built-in Google Fonts picker + Custom CSS Font URL loader.
• Section Header Settings: Custom Section Title, Subtitle description, top badge label, and title font sizes.
• Versatile Profile Pictures: Style photos with Square, Rounded, or Circle layouts, complete with borders.
• Dynamic Social Media Profile Links: Seamlessly link to Facebook, LinkedIn, Twitter/X, and custom websites.
• Direct Contact Buttons: Drive quick actions with dedicated Email, Phone, and WhatsApp buttons.
• Responsive Controls: Separate column & font size controls for Desktop, Tablet, and Mobile devices.

🔥 PRO Features (Unlock Premium Power)

Upgrade to WBD Team Member Pro for additional styling and customization options.

• Interactive Category Filter Tabs: Allow visitors to filter team members by department (e.g. Developer, Designer, Manager) with instant JS tab switching.
• PRO Layout 1: Pill Arch Expert (capsule-pro): Unique capsule arch photo shape (border-radius: 120px 120px 24px 24px) with soft pastel background palettes.
• PRO Layout 2: Staff Card Overlay (overlay-pro): Full image card background with dark gradient overlay, white typography, and floating social share popup button.
• PRO Layout 3: Dark Mode Modern (dark-mode): High-contrast, sleek dark theme preset designed for modern SaaS & Tech agencies.
• PRO Layout 4: Gradient Modern (gradient): Vibrant gradient accent borders and gradient text typography.
• Capsule Arch Radius & Overlay Card Height Controls: Customize arch curvature (40px – 200px) and overlay card heights (220px – 500px).
• Priority Support: 24/7 Dedicated technical support and automatic update access.

Team Member Layouts

Choose from the available team showcase layouts to present your team members in a style that suits your website.

Use team member cards, centered profiles, left-aligned layouts, or image-focused designs to create a professional team section.

Perfect For

✔ Agency Team Pages
✔ Business Websites
✔ Startup Teams
✔ Corporate Staff Sections
✔ Freelancer Portfolios
✔ School Teacher Profiles
✔ Company Employee Listings
✔ Organization Member Directories

Team Profiles and Contact Links

Add profile information and contact options for your team members.

Depending on your configuration, profile cards can include:

• Name and profile image
• Job title or role
• Description or biography
• Social media links
• Email contact
• Phone contact
• WhatsApp contact
• Custom website links

Social Media Links

Add social profile links to help visitors connect with your team members. Supported social profile options include Facebook, LinkedIn, Twitter/X, and custom website links.

Responsive Team Showcase

Create team member sections designed for desktop, tablet, and mobile screens. Use responsive column and font size controls to adjust how your team profiles appear across different devices.

Gutenberg-Native Editing

WBD Team Member Block is built around the WordPress block editor.

• Add the block from the Gutenberg block inserter.
• Edit team member content directly in the editor.
• Configure layouts from the block settings.
• Customize profile images, typography, colors, and spacing.
• Build team sections without relying on a separate page builder.

Lightweight and Performance-Conscious

WBD Team Member Block focuses on team profiles and staff showcase functionality rather than adding unrelated website-building features.

The plugin does not require jQuery and is designed with a focused CSS and JavaScript implementation. Actual page performance can vary depending on your WordPress theme, hosting environment, images, plugins, and other page content.

Accessibility Considerations

Team profile images should include meaningful alternative text that identifies the person represented by the image.

Use descriptive text for team member names, roles, links, and contact actions so visitors can understand the information and available actions. When creating a team page, choose readable color combinations and make sure links and buttons remain distinguishable from surrounding content.

SEO, AEO, and GEO-Friendly Team Content

WBD Team Member Block helps you present team information in organized profile sections within WordPress.

A well-written team page can help website visitors understand who works at your organization, what each person does, and how to find relevant professional or contact information.

For clearer team content:

• Use meaningful names and accurate job titles.
• Write concise biographies that describe each person’s role and expertise.
• Use descriptive image alternative text.
• Link to relevant professional profiles or individual biography pages.

Keep company names, roles, and professional information consistent across your official website and public business profiles. Use clear headings to organize your team page.

For Answer Engine Optimization (AEO) and Generative Engine Optimization (GEO), provide accurate, specific, and consistent information about your organization and team. Publicly available information may help search engines and AI systems understand your business, but inclusion in answers or citations is not guaranteed.

The plugin does not automatically guarantee search rankings, AI citations, or rich search results. Search visibility depends on your website content, technical SEO, site structure, external references, competition, and other factors.

Why Choose WBD Team Member Block?

✔ Native Gutenberg team member block
✔ Fully responsive team showcase layouts
✔ Lightweight and fast-loading
✔ SEO-friendly clean code
✔ No jQuery dependency
✔ Easy customization controls
✔ Modern staff profile card designs
✔ Works with all WordPress themes

Development

Development repository:
https://github.com/wpbranddigital/team-member-showcase-block

Build tools:
– npm
– webpack

Source code is available in the repository.