--- title: "How to Show Testimonials in Masonry Grid Layout in Elementor?" url: https://theplusaddons.com/docs/show-testimonials-in-masonry-grid-layout-in-elementor/ date: 2023-06-26 modified: 2026-09-15 lang: en author: "Aditya Sharma" description: "Testimonials are rarely the same length. In a normal grid every card in a row stretches to match the longest one, which leaves white space under the short quotes. The..." image: https://theplusaddons.com/wp-content/uploads/2023/06/How-to-Show-Testimonials-in-Masonry-Grid-Layout-in-Elementor_-1024x536.jpg word_count: 666 --- # How to Show Testimonials in Masonry Grid Layout in Elementor? ## - The Plus Addons for Elementor Testimonial widget supports a Masonry layout that keeps each card at its natural height and drops it into the shortest column, so the columns stay level. - The Testimonial widget is in the free plugin, while Style-3 and the extras listed below need The Plus Addons for Elementor Pro; Style-1, Style-2 and Style-4 work in the free plugin. - Excerpt Limit shortens testimonial text only when Select Source is set to Repeater, and it adds an expand link that reveals the rest of the quote and repacks the layout. - Masonry uses the same Columns Manage section as Grid, with Desktop Column 4, Tablet Column 3, Mobile Column 2, and Columns Gap set to 15 px on all sides. Testimonials are rarely the same length. In a normal grid every card in a row stretches to match the longest one, which leaves white space under the short quotes. The masonry layout drops each card into whichever column is currently shortest, so cards keep their natural height and the columns stay level. *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 masonry 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 **Masonry** - the middle of the three pictures.- Set **Select Source** to **Post Type** or **Repeater**. ![Layout set to Masonry in the Testimonial widget panel](https://theplusaddons.com/wp-content/uploads/2026/09/testimonial-layout-masonry.webp) Each card now keeps its own height and the next one starts right underneath it: ![Front end showing six testimonials of different lengths packed into a masonry grid with staggered rows](https://theplusaddons.com/wp-content/uploads/2026/09/testimonial-result-masonry.webp) ## Set the columns Masonry uses the same **Columns Manage** section as the grid. Read the labels, which say how many cards fit across. | Setting | What it does | Default | | ------- | ------------ | ------- | | Desktop Column | Cards across on desktop. | Column 4 | | Tablet Column | Cards across on tablet. | Column 3 | | Mobile Column | Cards across 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) ## Shortening long quotes If you want the cards closer in size without forcing a fixed height, set **Select Source** to **Repeater** and open **Extra Option**. **Excerpt Limit** cuts the testimonial text after a number of words or letters and adds an expand link. > *On the masonry layout the **Read More** and **Read Less** text fields stay hidden, so that expand link is rendered without any label. Until that is fixed, use the Carousel layout when you need the link to read something.* ## How It Behaves - Masonry and Grid share the same column settings; only the packing differs.- Masonry works in the free plugin for Style-1, Style-2 and Style-4. Only Style-3 needs Pro.- The expand link added by Excerpt Limit works: clicking it reveals the rest of the quote and the layout re-packs itself.- The cards re-pack whenever the browser is resized. ## Limitations - **The expand link has no label on this layout.** Excerpt Limit works, but the Read More / Read Less fields are only shown when Content Limit By is set to Text Limit, and Content Limit By is only offered for the Carousel layout - so on masonry the link is rendered empty.- **Content Height(px)**, **Title Height(px)** and **Content Scroll** are not available on masonry. They apply to Grid, and to Carousel when Content Limit By is set to Height.- Excerpt Limit needs the **Repeater** source. With the Post Type source the full text is always shown.- The column dropdown labels are inverted against the stored values - read the label. ## Troubleshooting ### The cards line up in even rows like a normal grid Either the **Layout** is still set to Grid, or every testimonial happens to be the same length. Masonry only looks different when the cards differ in height. ### I set Excerpt Limit but the link is blank That is the masonry limitation above. Switch the **Layout** to Carousel and set **Content Limit By** to Text Limit, which makes the Read More and Read Less fields available. ### Excerpt Limit does nothing **Select Source** is set to Post Type. Excerpt Limit only applies to the Repeater source. ### There is no Columns Manage section The **Layout** is set to Carousel, where Columns Manage is hidden. ## Related Docs - [Testimonial Widget Settings Overview](https://theplusaddons.com/docs/testimonial-widget-settings-overview/)- [How to Show Testimonials in Grid Layout in Elementor?](https://theplusaddons.com/docs/show-testimonials-in-grid-layout-in-elementor/)- [How to Limit Elementor Testimonial Carousel by Text?](https://theplusaddons.com/docs/limit-elementor-testimonial-carousel-by-text/)