{"id":318,"date":"2026-01-16T06:36:10","date_gmt":"2026-01-16T06:36:10","guid":{"rendered":"https:\/\/nguyenlan.com\/enable-multi-row-slider-for-blog-posts\/"},"modified":"2026-01-16T06:36:10","modified_gmt":"2026-01-16T06:36:10","slug":"enable-multi-row-slider-for-blog-posts","status":"publish","type":"post","link":"https:\/\/nguyenlan.com\/en\/enable-multi-row-slider-for-blog-posts\/","title":{"rendered":"Enable multi-row slider for Blog posts"},"content":{"rendered":"<p>Flatsome is one of the most powerful WordPress themes thanks to its UX Builder. However, when working with <strong>Blog Posts sliders<\/strong>, many users quickly realize one limitation: <\/p>\n<blockquote><p><strong>Flatsome does not support multi-row sliders for blog posts by default.<\/strong><\/p><\/blockquote>\n<p>In this guide, I\u2019ll show you <strong>how to enable a multi-row slider for blog posts in Flatsome<\/strong>, using a lightweight and optimized solution that works seamlessly with UX Builder.<\/p>\n<p>&nbsp;<\/p>\n<h2>Why Multi-Row Sliders Are Important<\/h2>\n<p>Multi-row sliders are extremely useful when you want to:<\/p>\n<ul>\n<li>Display <strong>many blog posts<\/strong> in a limited space<\/li>\n<li>Create <strong>magazine-style layouts<\/strong><\/li>\n<li>Improve <strong>content density<\/strong> without increasing page length<\/li>\n<li>Showcase categories like <strong>News, Tutorials, Reviews<\/strong> more professionally<\/li>\n<\/ul>\n<p>Unfortunately, the default <strong>Blog Posts element<\/strong> in UX Builder only allows <strong>1 row per slide<\/strong>.<\/p>\n<h2>Default Limitation in Flatsome<\/h2>\n<p>Out of the box, the Blog Posts element:<\/p>\n<ul>\n<li>\u274c Supports only <strong>single-row sliders<\/strong><\/li>\n<li>\u274c Requires custom JS\/CSS hacks (not recommended)<\/li>\n<\/ul>\n<p>This is where an advanced extension becomes necessary.<\/p>\n<h2>Solution: Enable Multi-Row Blog Slider with Advanced UX Builder for Flatsome<\/h2>\n<p>To unlock this feature safely and professionally, you can use:<\/p>\n<p>\ud83d\udc49 <strong>Advanced UX Builder for Flatsome<\/strong><br \/>\n\ud83d\udd17 Download from: <strong><a class=\"decorated-link cursor-pointer\" target=\"_new\" rel=\"noopener\">https:\/\/nguyenlan.com<\/a><\/strong><\/p>\n<p>This plugin extends existing UX Builder elements <strong>without breaking Flatsome core<\/strong>, and adds advanced layout controls.<\/p>\n<p><iframe loading=\"lazy\" title=\"Flatsome Multi Row Slider for Blog Posts | UX Builder Tutorial\" width=\"1020\" height=\"574\" src=\"https:\/\/www.youtube.com\/embed\/Dw0ZhcfH-aI?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/p>\n<h2>Key Features for Blog Sliders<\/h2>\n<p>With this plugin, you can:<\/p>\n<ul>\n<li>\u2705 Enable <strong>multi-row slider<\/strong> for Blog Posts<\/li>\n<li>\u2705 Set <strong>rows per slide<\/strong> (2 rows, 3 rows, or more)<\/li>\n<li>\u2705 Keep <strong>native Flatsome slider behavior<\/strong><\/li>\n<li>\u2705 Fully responsive (desktop \/ tablet \/ mobile)<\/li>\n<li>\u2705 No core file modification<\/li>\n<li>\u2705 Optimized for performance &amp; SEO<\/li>\n<\/ul>\n<h2>Step-by-Step: How to Enable Multi-Row Blog Slider<\/h2>\n<h3>Step 1: Install the Plugin<\/h3>\n<ol>\n<li>Download <strong>Advanced UX Builder for Flatsome<\/strong> from<br \/>\n\ud83d\udc49 <a class=\"decorated-link cursor-pointer\" target=\"_new\" rel=\"noopener\">https:\/\/nguyenlan.com<\/a><\/li>\n<li>Go to <strong>WordPress Admin \u2192 Plugins \u2192 Add New<\/strong><\/li>\n<li>Upload &amp; activate the plugin<\/li>\n<\/ol>\n<h3>Step 2: Add Blog Posts Element in UX Builder<\/h3>\n<ol>\n<li>Open any page with <strong>UX Builder<\/strong><\/li>\n<li>Add the <strong>Blog Posts<\/strong> element<\/li>\n<li>Enable <strong>Slider mode<\/strong> as usual<\/li>\n<\/ol>\n<h3>Step 3: Enable Multi-Row Slider<\/h3>\n<p>After activating the plugin, you\u2019ll see <strong>new advanced options<\/strong>: <\/p>\n<ul>\n<li><strong>Enable Multi-Row Slider<\/strong><\/li>\n<li><strong>Rows per slide<\/strong><\/li>\n<li><strong>Gap between rows<\/strong><\/li>\n<li><strong>Responsive row control<\/strong><\/li>\n<\/ul>\n<p>Example configuration:<\/p>\n<ul>\n<li>Columns: <code>3<\/code><\/li>\n<li>Rows per slide: <code>2<\/code><\/li>\n<li>Total posts per slide: <code>6<\/code><\/li>\n<\/ul>\n<h3>Step 4: Responsive Settings (Optional)<\/h3>\n<p>You can define different layouts for each device:<\/p>\n<ul>\n<li>Desktop: 3 columns \u00d7 2 rows<\/li>\n<li>Tablet: 2 columns \u00d7 2 rows<\/li>\n<li>Mobile: 1 column \u00d7 1 row<\/li>\n<\/ul>\n<p>This gives you <strong>full layout control<\/strong> without writing any code.<\/p>\n<h2>Performance &amp; Compatibility<\/h2>\n<ul>\n<li>\u2714 Uses native <strong>Flatsome slider engine<\/strong><\/li>\n<li>\u2714 No duplicate sliders<\/li>\n<li>\u2714 No jQuery conflicts<\/li>\n<li>\u2714 Fully compatible with:\n<ul>\n<li>Flatsome updates<\/li>\n<li>Lazy load<\/li>\n<li>Cache plugins<\/li>\n<li>SEO plugins<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h2>Final Result<\/h2>\n<p>With multi-row sliders enabled, your blog section will:<\/p>\n<ul>\n<li>Look more professional<\/li>\n<li>Display more content at once<\/li>\n<li>Improve user engagement<\/li>\n<li>Reduce page scrolling<\/li>\n<li>Match modern magazine layouts<\/li>\n<\/ul>\n<h2>Conclusion<\/h2>\n<p>Flatsome is powerful, but some advanced layouts require the right extensions.<\/p>\n<p>If you want to <strong>enable multi-row sliders for blog posts<\/strong> without hacks or heavy custom code,<br \/>\n<strong>Advanced UX Builder for Flatsome<\/strong> is the cleanest solution.<\/p>\n<p>\ud83d\udc49 Download here: <strong><a class=\"decorated-link cursor-pointer\" target=\"_new\" rel=\"noopener\">https:\/\/nguyenlan.com<\/a><\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Flatsome is one of the most powerful WordPress themes thanks to its UX Builder. However, when working with Blog Posts sliders, many users quickly realize one limitation: Flatsome does not support multi-row sliders for blog posts by default. In this guide, I\u2019ll show you how to enable a multi-row slider for blog posts in Flatsome,<\/p>\n","protected":false},"author":1,"featured_media":310,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[31],"tags":[],"class_list":["post-318","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-advanced-uxbuilder-for-flatsome"],"_links":{"self":[{"href":"https:\/\/nguyenlan.com\/en\/wp-json\/wp\/v2\/posts\/318","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nguyenlan.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nguyenlan.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nguyenlan.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nguyenlan.com\/en\/wp-json\/wp\/v2\/comments?post=318"}],"version-history":[{"count":0,"href":"https:\/\/nguyenlan.com\/en\/wp-json\/wp\/v2\/posts\/318\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nguyenlan.com\/en\/wp-json\/wp\/v2\/media\/310"}],"wp:attachment":[{"href":"https:\/\/nguyenlan.com\/en\/wp-json\/wp\/v2\/media?parent=318"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nguyenlan.com\/en\/wp-json\/wp\/v2\/categories?post=318"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nguyenlan.com\/en\/wp-json\/wp\/v2\/tags?post=318"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}