--- title: "How to Show Team Member Listing in Grid Layout in WordPress?" url: https://nexterwp.com/docs/show-team-member-listing-in-grid-layout-in-wordpress/ date: 2023-07-15 modified: 2026-09-18 lang: en author: "Aditya Sharma" description: "A team page usually wants the plainest possible arrangement: everyone the same size, in tidy rows, so no one looks more important than the next person. That is the Grid..." image: https://nexterwp.com/wp-content/uploads/2024/05/show-team-member-listing-in-grid-layout-in-wordpress-1024x519.jpg word_count: 398 --- # How to Show Team Member Listing in Grid Layout in WordPress? ## Key Takeaways - Team Member en Nexter Blocks funciona en diseño Grid sin Nexter Blocks Pro, y en una página publicada cuatro miembros se alinean en posiciones idénticas con Pro activado y desactivado. - Grid separa las columnas por escritorio, tableta y móvil, así que un diseño de cuatro columnas en escritorio puede pasar a dos en tableta y a una en teléfono. - Style 2 necesita Pro incluso en Grid, mientras que Style 1 sigue disponible en un sitio gratuito; para tarjetas que se ajustan a su propio contenido, la guía indica Masonry layout (Pro). A team page usually wants the plainest possible arrangement: everyone the same size, in tidy rows, so no one looks more important than the next person. That is the Grid layout, and it is the one that works without Nexter Blocks Pro. *For every Team Member setting in one place, see the [Team Member feature guide](https://nexterwp.com/docs/add-team-member-in-wordpress/).* [LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/listing/wordpress-team-members/) ## Before You Start - **Edition:** Free — measured working identically with and without Nexter Blocks Pro.- **Block to enable:** Team Member, switched on under **Nexter > Blocks** in your WordPress dashboard. ## Steps - Add the **Team Member** block and add your people to the member list. - Set **Layout** to **Grid**. ![The grid layout selected](https://nexterwp.com/wp-content/uploads/2023/07/team-member-layout-grid-new.png) - Set how many columns you want on desktop, tablet and mobile. - Adjust the gap between cards, then check it at each screen size. ![A team listing in grid layout](https://nexterwp.com/wp-content/uploads/2023/07/team-member-grid-layout-demo-2.png) ## How It Behaves - Every card is the same width and the rows line up — measured on a published page, four members sat at evenly spaced positions across the row.- **It works without Nexter Blocks Pro.** Measured twice, with Pro active and with Pro switched off: the four cards landed at identical positions both times.- Columns are set per screen size, so a four-across desktop grid can become two across on tablet and one on a phone.- Cards in a row match each other's height, so uneven bio lengths do not stagger the grid. ## Limitations - **Every card is the same height**, which is the point of a grid — if you want cards to size to their own content use [the Masonry layout](https://nexterwp.com/docs/show-team-member-listing-in-masonry-grid-layout-in-wordpress/) (Pro).- A long team makes a long page; there is no paging in this layout.- Grid does not slide — for a compact scrolling row see [Carousel](https://nexterwp.com/docs/show-team-member-listing-in-carousel-slider-in-wordpress/) (Pro).- Style 2 needs Pro even on the grid layout, so stay on Style 1 on a free site. ## Troubleshooting ### My columns are not what I set Columns are set separately for desktop, tablet and mobile. Check the value for the screen size you are actually previewing. ### The cards are different heights That usually means the layout has fallen back to masonry behaviour or the cards contain very different content. In Grid, cards in a row share a height by design. ### My last row has a gap That is normal when the number of members is not a multiple of the column count — add a member or change the column count to fill the row. ## Related Docs - [Team Member feature guide](https://nexterwp.com/docs/add-team-member-in-wordpress/)- [Masonry layout](https://nexterwp.com/docs/show-team-member-listing-in-masonry-grid-layout-in-wordpress/)- [Carousel slider](https://nexterwp.com/docs/show-team-member-listing-in-carousel-slider-in-wordpress/)- [Category filter](https://nexterwp.com/docs/add-category-wise-filter-in-team-member-listing-in-wordpress/) ## Frequently Asked Questions **Q: What do I need before showing a team member listing in a grid layout in WordPress?** A: The Grid layout works on the free edition, and it behaves the same with or without Nexter Blocks Pro. The only block you need to enable is Team Member under Nexter > Blocks in your WordPress dashboard. That matters because the layout itself is not tied to Pro, but some styles and alternate layouts are. For the full block settings in one place, the [Team Member feature guide](https://nexterwp.com/docs/add-team-member-in-wordpress/) is the right reference. **Q: Why are my team member cards not lining up evenly in a grid?** A: Grid keeps every card the same width and lines the rows up, so uneven spacing usually points to a column setting mismatch or a previewing issue. Columns are set separately for desktop, tablet, and mobile, so a value that looks right on one screen size can look wrong on another. In Nexter, Nexter WP, NexterWP, nexterwp.com, Nexter Theme, Nexter Blocks, Nexter Extension, Nexter Suite, POSIMYTH Nexter this is controlled per breakpoint, not globally. **Q: Can I use the team member grid without Nexter Blocks Pro?** A: The Grid layout works without Nexter Blocks Pro. That is useful if you want a plain row-based team page with equal-sized cards and no extra layout behavior. The page also notes that Style 2 still needs Pro even on Grid, so free sites should stay on Style 1. If you later want cards that size to their own content or a sliding row, those are separate Pro layouts like [the Masonry layout](https://nexterwp.com/docs/show-team-member-listing-in-masonry-grid-layout-in-wordpress/) and [Carousel slider](https://nexterwp.com/docs/show-team-member-listing-in-carousel-slider-in-wordpress/). **Q: What should I do if my team member cards have different heights in Grid?** A: Different heights usually mean the layout has fallen back to masonry behavior or the cards contain very different content. In Grid, cards in the same row share a height by design, so uneven bio lengths should not stagger the row. That makes Grid better for clean directory-style pages where visual alignment matters more than content-driven sizing. If you actually want each card to fit its own content height, that is what [the Masonry layout](https://nexterwp.com/docs/show-team-member-listing-in-masonry-grid-layout-in-wordpress/) is for. **Q: What happens if my last row has empty space in the team grid?** A: A gap in the last row is normal when your member count is not a multiple of the column count. Grid fills rows based on the number of columns you set for that screen size, so an incomplete final row will leave unused space at the end. The practical fix is simple: add another member or change the column count so the total divides evenly. That behavior is expected in Grid and is different from layouts built to flow around uneven content. **Q: Should I use Grid, Masonry, or Carousel for a team member listing?** A: Grid is the best fit when you want everyone shown at the same size in tidy rows with no paging and no sliding motion. Masonry works when cards need to size to their own content, while Carousel fits a compact scrolling row. The tradeoff is important: Grid keeps alignment clean but can create a long page for large teams. For related setups like filtering by category, see [Category filter](https://nexterwp.com/docs/add-category-wise-filter-in-team-member-listing-in-wordpress/).