Arrange sections, rows and columns, then add addons. Start with 29 built-in addons, place any of your existing Joomla modules, or add more with a plugin. Publish a layout as a menu item, in any module position, inside an article with the {jolayout id=N} shortcode, or use it as the site header or footer.

Every layout is responsive, with its own settings for Desktop, Tablet and Mobile. JO Layout Builder loads only the scripts a page actually needs, uses Joomla’s own module system, and leaves your existing extensions working alongside your layouts.

Key features

• Visual drag-and-drop builder. Arrange sections, rows, columns and addons visually. Move a section with one click, duplicate an addon, and nest rows inside columns when the layout needs it.

• 29 built-in addons. Add text, headings, buttons, images, galleries, carousels, pricing tables, data tables, countdowns, progress bars, forms, menus and more — or insert any native Joomla module.

• Create your own addon. You are not limited to the built-in addons. A plugin can add more, and the developer guide explains how.

• Fully responsive. Set width, spacing, typography, alignment and visibility separately for Desktop, Tablet and Mobile. A section can stay boxed, stretch its background to the screen, or stretch its content as well. Breakpoints are set in the component Options.

• Headers and footers. Design the site header and footer in the same builder. Start from a ready-made layout and change it to match the site. Works with the JO Canvas template or the JO Header Footer Override plugin.

• Use layouts anywhere. Publish a layout as a menu item, show it in any module position with the JO Layout Builder module, or place it inside an article with the {jolayout id=N} shortcode.

• Native Joomla modules. Put existing modules directly in a layout. Menus, login, search, custom modules and third-party modules keep working as they do now.

• Typography and color presets. Set the font, size, weight and line height for each device. Link colors to site-wide presets and change a brand color in one place.

• Undo, redo and compact view. Undo a change straight away, and switch to Compact View on a long page so you see the structure instead of the content.

• Import and export. Export a layout on its own, or with the header, footer and builder settings, and use it on another Joomla site. Reuse sections across layouts.

• Lightweight and cache-friendly. Scripts for carousels, galleries, countdowns and progress bars load only when a page uses them. A rendered layout can be cached.

• Accessible output. Semantic HTML, keyboard-friendly controls, screen-reader text where it is needed, and respect for reduced motion.