Description
Dits Blocks for Block Editor extends the WordPress block editor with a practical collection of custom Gutenberg blocks for creating richer page layouts without relying on a separate page builder.
The plugin includes blocks for structured content, interactive elements, promotional sections, media, navigation, and reusable page layouts. It also adds extra options to the native WordPress Button block.
Included Blocks
- Accordion – Create expandable content sections for FAQs and structured information.
- Custom Columns – Build flexible multi-column layouts with nested content.
- Image with Text – Combine images and text in structured content sections.
- YouTube Video Embed – Add and configure YouTube video content.
- Collapsible Paragraph – Display expandable text for longer or optional content.
- Call to Action – Create focused CTA sections with content and actions.
- Customer Testimonials – Display customer reviews and testimonial content.
- Fly-in Promo – Add promotional content that appears as an interactive fly-in element.
- Full Width Background – Create full-width sections with configurable background content.
- Hero Image Banner – Build prominent hero sections with imagery and content.
- Icon List – Create lists with configurable icons.
- Image with Mask – Display images with custom visual masking.
- Highlighted Info Box – Highlight important information in a dedicated content box.
- Slider – Create configurable slide-based content sections.
- Table of Contents – Generate structured navigation for page content.
Some blocks use internal nested components to provide their editing experience. These components are part of their parent blocks and are not intended to be inserted separately.
Core Button Enhancements
Dits Blocks for Block Editor also extends the native WordPress Button block with additional customization options while keeping the standard Gutenberg editing workflow.
Built for the Block Editor
The plugin works directly inside the WordPress block editor and uses native Gutenberg concepts such as nested blocks and block controls.
No separate page builder is required.
Third-Party Libraries
Font Awesome Free 6.7.2 is bundled locally for icon rendering.
Font Awesome Free is licensed under CC BY 4.0 (icons), SIL OFL 1.1 (fonts), and MIT (code).
Screenshots
Blocks
This plugin provides 20 blocks.
- Icon List Display a list with customizable icons
- Fly-in Promo Fly-in overlay/sidebar promo block
- Call to Action Flexible CTA block with text, buttons and image
- Table of Contents Automatic navigation by page headings
- Full Width Background Full-width section with optional angled dividers and customizable background.
- Custom column wrapper Parent block for custom column items
- Accordion Accordion Parent Block
- Image with text Block image with text
- YouTube Video Embed Embed YouTube videos with custom thumbnails, privacy controls, and styling options
- Hero Image Banner Full-width hero image with inner Gutenberg content.
- Collapsible Paragraph Paragraph with collapsible long text and Read More button
- Highlighted Info Box Display highlighted information with customizable icons, text, and lists.
- Slider Block slider based on Swiper.js
- Image with mask Custom image block with CSS mask support and advanced settings
- Customer Testimonials Display customer testimonials in a grid or slider format with advanced customization options
- Toggle Button A customizable toggle button.
- Column item One column for custom column block
- Slide One slide for Slider block
- Accordion Block Item Accordion Block Item
- Custom Paragraph Custom Paragraph
Installation
- Upload the plugin folder to the
/wp-content/plugins/directory, or install the plugin through the WordPress Plugins screen. - Activate Dits Blocks for Block Editor through the Plugins screen in WordPress.
- Open the WordPress block editor.
- Add a block and look for the Dits Blocks category.
- Select the block you want to use and configure it from the editor controls.
FAQ
-
Does Dits Blocks for Block Editor require a page builder?
-
No. Dits Blocks for Block Editor works directly with the native WordPress block editor.
-
Are all registered blocks available directly in the block inserter?
-
No. Some registered blocks are internal components used by parent blocks such as Accordion, Custom Columns, Image with Text, and Slider. They are not intended to be used as standalone blocks.
-
The plugin adds additional customization options to the native Button block while retaining the standard Gutenberg block workflow.
-
Where can I find the blocks?
-
Open the block inserter in the WordPress editor and look for the Dits Blocks category.
Reviews
There are no reviews for this plugin.
Contributors & Developers
“Dits Blocks for Block Editor” is open source software. The following people have contributed to this plugin.
Contributors
Translate “Dits Blocks for Block Editor” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
1.0.5
- Initial public release of Dits Blocks for Block Editor.
- Includes the main collection of Gutenberg blocks and nested block components.
- Includes additional customization options for the native WordPress Button block.
- Loads Font Awesome locally from the plugin files.