GutenKit Pro adds page-building tools to the WordPress block editor for pages, landing pages, and full-website layouts. It includes 65+ blocks, 20+ modules, and more than 900 pre-designed templates and patterns. Its blocks, templates, and patterns work with Full Site Editing, while the drag-and-drop workflow is intended to help create complex layouts without coding expertise.

Responsive breakpoints and flexible containers

Adjust responsive breakpoint options inside the Gutenberg editor as you design. Alongside mobile, desktop, and tablet views, the system works with six additional custom breakpoints for mobile, desktop, laptop, tablet, wide screens, and landscape mode. These settings let you adapt blocks and layouts to different screen sizes. GutenKit is described as responsive across devices and tested for cross-browser compatibility.

Flexible containers support inline editing and can form full-width or boxed sections. Motion effects add animation to blocks, and copy-and-paste styles let you apply an existing design treatment to other blocks.

Mega menus and website navigation

The Mega Menu Builder creates multi-level dropdown menus with submenus inside the block editor. Add submenu entries and link them to existing site pages. Menu items can also contain blocks such as containers, carousels, and tabs.

Queries, dynamic content, and display conditions

The Query Loop Builder displays WordPress posts using filters for post type, taxonomy, meta query, date query, author, post status, and other available criteria. Its visual controls provide a way to shape post displays without writing code.

Dynamic Content can insert values such as post tags, site titles, author names, and user information through a block’s settings. Set a fallback value to show default content when the selected data is unavailable. The Display Conditions module controls block visibility according to configured criteria.

Templates and assets

Templates and patterns provide starting layouts for pages and site projects. GutenKit loads CSS and JavaScript for the blocks used on each page and loads individual icons instead of the full icon library. It also supports Block API Version 3.

Installation and first steps

1. Install and activate GutenKit Pro on your WordPress site.
2. Open the Gutenberg block editor and select GutenKit blocks, modules, templates, or patterns.
3. Build a layout with flexible containers, then adjust responsive settings for the screens you need.
4. Add dynamic content, query-based displays, menus, or display conditions where appropriate.

Refine the design in Gutenberg, review the responsive breakpoints, and publish the finished page or site layout.