--- title: "How to Show Custom Post Types in Masonry Grid Layout in Elementor?" url: https://theplusaddons.com/docs/show-custom-post-types-in-masonry-grid-layout-in-elementor/ date: 2023-08-25 modified: 2026-09-27 lang: en author: "Aditya Sharma" description: "When your cards have different heights - a mix of short and long excerpts, or images of different aspect ratios - an even grid leaves awkward gaps. Dynamic Listing's Masonry..." image: https://theplusaddons.com/wp-content/uploads/2023/08/How-to-Show-Custom-Post-Types-in-Masonry-Grid-Layout-in-Elementor_-1024x536.jpg word_count: 307 --- # How to Show Custom Post Types in Masonry Grid Layout in Elementor? ## - Dynamic Listing uses the Masonry layout to pack uneven cards into a staggered, Pinterest-style column layout, so short and long excerpts or different image aspect ratios sit flush against each other. - The Plus Addons for Elementor Pro requires Elementor (free) installed and active, plus the license activated, and Dynamic Listing does not appear in the free plugin. - Dynamic Listing sets custom post types by choosing Post Type under Content Source, then switching Content Layout to Masonry; column counts still come from Desktop/Tablet/Mobile Column in Columns Manage. When your cards have different heights - a mix of short and long excerpts, or images of different aspect ratios - an even grid leaves awkward gaps. Dynamic Listing's **Masonry** layout packs cards into a staggered, Pinterest-style column layout instead, so uneven card heights sit flush against each other. For the full settings tour of the **Dynamic Listing** widget, see [Dynamic Listing Widget Settings Overview](https://theplusaddons.com/docs/dynamic-listing-widget-settings-overview/). ***Requirement - This widget is a part of The Plus Addons for Elementor Pro, make sure it's installed & activated to enjoy all its powers.*** [LIVE WIDGET LINK](https://theplusaddons.com/elementor-listing/dynamic-listing/?utm_source=tpae&utm_medium=docs&utm_campaign=text) ## Before You Start - **Prerequisite:** [Elementor](https://wordpress.org/plugins/elementor/) (free) installed and active.- **Edition:** Dynamic Listing is a **Pro** widget - it needs The Plus Addons for Elementor Pro installed and its license activated. It will not appear in the free plugin.- **Widget to enable:** go to **The Plus Addons > Widgets**, search for **Dynamic Listing** and turn its toggle on. ## Steps - Add the **Dynamic Listing** widget to the page.- Set **Post Type** under Content Source to the custom post type you want.- Under **Content Layout**, set **Layout** to **Masonry**. ![Layout control set to Masonry](https://theplusaddons.com/wp-content/uploads/2026/09/dynamic-listing-layout-masonry.webp) Column counts still come from the same **Columns Manage** section (Desktop/Tablet/Mobile Column) used by the Grid layout - Masonry only changes how cards of different heights are packed inside those columns. ![Custom post type cards packed into a staggered masonry grid](https://theplusaddons.com/wp-content/uploads/2026/09/dynamic-listing-masonry-result.webp) ## Settings Overview | Setting | What it does | Default | | ------- | ------------ | ------- | | Layout | Grid, Masonry, Metro or Carousel. | Grid | | Desktop Column | Columns at desktop width (shared with Grid layout). | 3 | ## Limitations - Masonry reflows on image load, so cards can visibly shift position for a moment on a slow connection - this is standard masonry behavior, not specific to this widget. ## Related Docs - [How to Create Elementor Custom Post Type Grid?](https://theplusaddons.com/docs/create-elementor-custom-post-type-grid/)- [How to Show Custom Post Types in Metro Layout in Elementor?](https://theplusaddons.com/docs/show-custom-post-types-in-metro-layout-in-elementor/) ## Not verified So you know exactly what has and has not been checked: - Masonry reflow behavior on a real slow-network load was not measured; only the settled layout is confirmed in this wave's screenshots. ## Frequently Asked Questions **Q: Why do custom post type cards leave gaps in a normal grid layout?** A: Uneven card heights create the gaps. When excerpts are different lengths or images have different aspect ratios, a standard grid keeps each row aligned, so shorter cards leave empty space under them. The Masonry layout in Dynamic Listing packs those cards into staggered columns instead, which is why it fits mixed-height content better than a flat grid. **Q: What do I need before showing custom post types in Masonry layout in Elementor?** A: Elementor free has to be installed and active, and Dynamic Listing must be available as a Pro widget. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH requires the Pro version plus an activated license for this widget to appear. You also need to enable Dynamic Listing under The Plus Addons > Widgets before it can be used on a page. **Q: How do I show a custom post type in Masonry layout on an Elementor page?** A: The key setup is simple: add the Dynamic Listing widget, set Post Type under Content Source to your custom post type, then change Content Layout to Masonry. That switches the packing behavior without changing the column system itself. The page also notes that column counts still come from the same Desktop/Tablet/Mobile Column controls used by Grid. **Q: Does Masonry change the number of columns in Dynamic Listing?** A: Masonry does not change the column count. The number of columns still comes from the same Columns Manage section used by Grid, with separate Desktop, Tablet, and Mobile Column controls. Masonry only changes how cards of different heights are packed inside those columns, so it affects spacing and flow rather than the column settings themselves. **Q: What should I choose: Grid or Masonry for custom post types with mixed image sizes?** A: Masonry is the better fit when card heights vary because it packs items into a staggered Pinterest-style layout and reduces awkward gaps. Grid keeps rows even, which looks cleaner only when cards are similar in height. If your excerpts or images vary a lot, Masonry usually gives a tighter result inside Dynamic Listing. **Q: Why do Masonry cards shift position when images load slowly?** A: That shift is normal masonry behavior. The page says Masonry reflows on image load, so cards can visibly move for a moment on a slow connection before settling into place. The practical takeaway is that this is expected behavior rather than a bug in Dynamic Listing, and it matters most when images load at different times.