--- title: "How to Show Testimonials in Grid Layout in Elementor?" url: https://theplusaddons.com/docs/show-testimonials-in-grid-layout-in-elementor/ date: 2023-06-26 modified: 2026-09-15 lang: en author: "Aditya Sharma" description: "A grid is the simplest way to show several testimonials at once: every card sits in a row of equal-width columns, and the rows wrap. The Testimonial widget from The..." image: https://theplusaddons.com/wp-content/uploads/2023/06/How-to-Show-Testimonials-in-Grid-Layout-in-Elementor_-1024x536.jpg word_count: 682 --- # How to Show Testimonials in Grid Layout in Elementor? ## - The Plus Addons for Elementor Testimonial widget builds a testimonial grid in Elementor, with separate column counts for desktop, tablet and mobile. - Layout set to Grid supports Style-1, Style-2 and Style-4 in the free plugin, while Style-3 needs The Plus Addons for Elementor Pro. - Columns Manage uses labels like Desktop Column, Tablet Column and Mobile Column, and the default grid shows 2 cards per row at 390 px wide. - Content Height(px) fixes equal card heights, but in the free plugin it sizes only the testimonial text, and Maximum Posts Display shows the whole list with no Load More or pagination. A grid is the simplest way to show several testimonials at once: every card sits in a row of equal-width columns, and the rows wrap. The Testimonial widget from The Plus Addons for Elementor builds that grid for you, with a separate column count for desktop, tablet and mobile. *To check the complete feature overview documentation of The Plus Addons for Elementor Testimonial widget, [click here](https://theplusaddons.com/docs/testimonial-widget-settings-overview/).* ***Requirement - This widget is a part of The Plus Addons for Elementor, make sure it's installed & activated to enjoy all its powers.*** [LIVE WIDGET LINK](https://theplusaddons.com/elementor-listing/testimonials/?utm_source=tpae&utm_medium=docs&utm_campaign=text) ## Before You Start - **Edition:** the Testimonial widget is in the **free** plugin. Style-3 and the extras listed below need The Plus Addons for Elementor Pro.- **Widget to enable:** Testimonial, switched on under **The Plus Addons > Widgets**. Its card is badged **FREEMIUM**.- **If you use the Post Type source:** the testimonial custom post type has to be switched on first, under **The Plus Addons > Extra Options > Listing > Testimonial**. Until then there are no testimonials to list. ## Build the grid - Edit the page with Elementor and drag the **Testimonial** widget in.- In **Layout** (**Content Layout** in the free plugin) pick a **Style**.- Set **Layout** to **Grid** - the first of the three pictures.- Set **Select Source** to **Post Type** to list the testimonial post type, or **Repeater** to type the testimonials into the widget. ![Layout set to Grid in the Testimonial widget panel](https://theplusaddons.com/wp-content/uploads/2026/09/testimonial-layout-grid.webp) The testimonials line up in a grid: ![Front end showing four testimonials side by side in one grid row](https://theplusaddons.com/wp-content/uploads/2026/09/testimonial-result-grid.webp) ## Set the columns Open the **Columns Manage** section. Read the labels rather than the numbers: the label says how many cards fit in a row. | Setting | What it does | Default | | ------- | ------------ | ------- | | Desktop Column | Cards per row on desktop. | Column 4 | | Tablet Column | Cards per row on tablet. | Column 3 | | Mobile Column | Cards per row on mobile. | Column 2 | | Columns Gap/Space Between | Spacing around each card, set as padding inside its cell. | 15 px on all sides | ![Columns Manage section with Desktop Column, Tablet Column and Mobile Column](https://theplusaddons.com/wp-content/uploads/2026/09/testimonial-columns.webp) ## Even out the card heights Cards in a grid are as tall as their longest testimonial. Under **Extra Option** you can fix that height: - **Content Height(px)** fixes the height and adds a scrollbar to whatever overflows. In the Pro plugin this sizes the **whole card**, so a small value clips the author picture and name too; in the free plugin it sizes only the testimonial text.- **Title Height(px)** does the same for the testimonial title.- **Content Scroll** chooses whether that scrollbar is hidden until the card is hovered (**On Hover**) or always drawn (**Visible**). ## How It Behaves - All three layouts - Grid, Masonry and Carousel - work in the free plugin for Style-1, Style-2 and Style-4. Only Style-3 needs Pro.- The column count is a real breakpoint change, not a squeeze: at 390 px wide the default grid shows two cards per row.- **Columns Gap** is padding on each cell, so the space you see between two cards is twice the value you type.- Grid keeps the rows aligned. If you would rather each card kept its natural height and packed upwards, use the Masonry layout instead. ## Limitations - The column dropdown labels are the opposite way round to the stored values - **Column 4** is four per row, not four columns wide. Always read the label.- **Content Height(px)** behaves differently in the two editions, as described above. Check the result on the published page before settling on a value.- **In the free plugin, Content Scroll has no effect when Select Source is Post Type** - the scrollbar is always visible.- There is no Load More or pagination on this widget: **Maximum Posts Display** is the whole list. ## Troubleshooting ### There is no Columns Manage section The **Layout** is set to Carousel. Columns Manage is hidden there; a carousel takes its column count from **Style > Carousel Options**. ### I get one card per row on desktop **Desktop Column** is set to **Column 1**. Change it to **Column 3** or **Column 4**. ### The gap between cards is twice what I set That is expected - the value is applied as padding on both cards. Halve it. ### The cards are different heights Set **Content Height(px)** under **Extra Option**, or switch to the Masonry layout if uneven heights are fine. ## Related Docs - [Testimonial Widget Settings Overview](https://theplusaddons.com/docs/testimonial-widget-settings-overview/)- [How to Show Testimonials in Masonry Grid Layout in Elementor?](https://theplusaddons.com/docs/show-testimonials-in-masonry-grid-layout-in-elementor/)- [How to Add a Testimonial Carousel Slider in Elementor?](https://theplusaddons.com/docs/add-a-testimonial-carousel-slider-in-elementor/) ## Frequently Asked Questions **Q: How do I show testimonials in a grid layout in Elementor?** A: The grid layout is the simplest option because each testimonial card sits in equal-width columns and the rows wrap automatically. In The Plus Addons for Elementor, the Testimonial widget handles that inside Elementor, so you start by setting Layout to Grid and choosing a source such as Post Type or Repeater. That setup is useful when you want several testimonials visible at once without the uneven packing you get from Masonry. **Q: What do I need before using the testimonial grid widget?** A: The Testimonial widget is part of The Plus Addons for Elementor, so it has to be installed and activated first. The widget itself is in the free plugin, but Style-3 and the extras listed on the page need The Plus Addons for Elementor Pro. If you use Post Type as the source, the testimonial custom post type also has to be switched on under The Plus Addons > Extra Options > Listing > Testimonial. **Q: Why are my testimonial cards showing one per row on desktop?** A: That usually means Desktop Column is set to Column 1. The column labels matter more than the stored values, so Column 3 means three cards per row and Column 4 means four per row. This is a common setup mistake because the dropdown can look backwards at first glance. If you want a denser desktop layout, raise the desktop column count instead of changing the card content. **Q: Why is the space between testimonial cards bigger than I set?** A: Columns Gap is applied as padding on both cards, so the visible gap between two cards becomes twice the value you enter. That is why a 15 px setting can look larger than expected. The practical fix is to halve your target spacing when you want a specific visual gap between cards. This behavior comes from how The Plus Addons for Elementor spaces each cell inside the grid. **Q: How do I make all testimonial cards the same height?** A: Content Height(px) under Extra Option is the control that evens out card heights by fixing the height and adding a scrollbar for overflow. In the free plugin it sizes only the testimonial text, while in Pro it sizes the whole card, which can clip the author picture and name if you set it too small. Title Height(px) works the same way for titles, so test on the published page before locking in a value. **Q: Should I use Grid or Masonry for testimonials with uneven text lengths?** A: Grid is better when you want rows to stay aligned and every card to line up cleanly across each breakpoint. Masonry is better when you want each card to keep its natural height and pack upward instead of forcing equal rows. The page also notes that Grid keeps rows aligned, while Masonry is the alternative if uneven heights are fine. For a standard testimonial wall, Grid gives the cleaner structure.