Saji

Mahdi Yazdani

MyPreview

<p>A fully customizable Gutenberg editor block used for wrapping several blocks in a parent wrapper, which enables you to do more sophisticated styling as well.</p>
<p><strong>Key Features</strong></p>
<ul>
<li>Maximum width</li>
<li>Full-height
<ul>
<li>Vertically align top.</li>
<li>Vertically align center.</li>
<li>Vertically align bottom.</li>
</ul>
</li>
<li>Scroll down icon — A scrolling mouse wheel animation that will offer direction to the user.
<ul>
<li>Element ID — Smoothly scroll the window to a specific element or tag ID within the page.</li>
<li>Color</li>
</ul>
</li>
<li>Visibility
<ul>
<li>Desktop</li>
<li>Laptop</li>
<li>Tablet</li>
<li>Smartphone</li>
</ul>
</li>
<li>Horizontal spacing
<ul>
<li>Desktop</li>
<li>Laptop</li>
<li>Tablet</li>
<li>Smartphone</li>
</ul>
</li>
<li>Alignment
<ul>
<li>Desktop</li>
<li>Laptop</li>
<li>Tablet</li>
<li>Smartphone</li>
</ul>
</li>
<li>Link to
<ul>
<li>Page address or URL.</li>
<li>Open in a new window.</li>
</ul>
</li>
<li>Border
<ul>
<li>Width — Sets a width for the borders.</li>
<li>Radius — Defines the radius of the corners.</li>
<li>Color</li>
</ul>
</li>
<li>Shadow — Adds a box-shadow to the block.</li>
<li>Shape — Multiple shapes to use as separators for sections or as the background graphic.
<ul>
<li>Height — A few of the shapes such as “Simple” are adjustable.</li>
<li>Color</li>
</ul>
</li>
<li>Animation on scroll
<ul>
<li>Type — Allows you to animate elements as you scroll down, and up.</li>
<li>Ease — Timing function to ease elements in different ways.</li>
<li>Offset — Offset to trigger animation sooner or later in pixels.</li>
<li>Delay — Delay the animation.</li>
<li>Duration — Duration of animation.</li>
<li>Run once — Whether animation should fire once, or every time you scroll up/down to the block.</li>
</ul>
</li>
<li>Background image
<ul>
<li>Position — Sets the starting position of the background image; “Focal Point Picker” support.</li>
<li>Repeat — Sets if and how the background image will be repeated.</li>
<li>Size — Sets the size of the background image.</li>
<li>Parallax — Not scrolling the background image with the page.</li>
<li>Sliding background effect — Supports “Left to Right” and vice versa.</li>
</ul>
</li>
<li>Background video</li>
<li>Background color</li>
<li>Overlay opacity</li>
<li>Align full and wide support</li>
<li>Aria label — To define a string that labels the current block. You might use it in cases where the block content is not visible on the screen.</li>
</ul>


Container Block

A Gutenberg editor block used for wrapping several blocks in a parent wrapper.

Freemius

Abu Hayat

bPlugins

Charles Cormier

asadsuzan

<p>Section Separator Block is a lightweight and flexible Gutenberg block that helps you visually separate content sections using modern, responsive, and customizable dividers.</p>
<p>Easily add wave separators, icon dividers, pill-style separators, and bold gradient separators directly inside the WordPress block editor—no coding required.</p>
<p>Perfect for landing pages, blogs, portfolios, and business websites. Works seamlessly with any WordPress theme.</p>
<p>✨ Includes a fully FREE Icon Separator with customizable line styles, thickness, icon alignment, and improved editor controls.</p>
<p><strong><a href="https://bblockswp.com/demo/section-separator-all/" rel="nofollow ugc">Demos</a></strong></p>
<h3>✅ Why use Section Separator?</h3>
<ul>
<li>Clean and modern section dividers</li>
<li>Fully Gutenberg-native</li>
<li>Responsive and performance-optimized</li>
<li>Beginner-friendly with advanced controls</li>
</ul>
<h3>Perfect for</h3>
<ul>
<li>Visually separating sections on your WordPress site</li>
<li>Landing pages, portfolios, blogs, and marketing pages</li>
<li>Decorative dividers with modern design aesthetics</li>
</ul>
<p>Lightweight, flexible, and easy to use.</p>
<h3>Key Features Include</h3>
<ul>
<li>Wave Separator Block with multi-layer waves</li>
<li>Adjustable wave height (amplitude) and shape</li>
<li>Control wave color, opacity, and placement (top or bottom)</li>
<li>Icon Separator (100% Free) with custom icon or SVG support</li>
<li>Icon alignment: Left, Center, Right</li>
<li>Line thickness and line style options (Solid, Dashed, Dotted)</li>
<li>Multiple separator variants: Solid, Gradient, Glow</li>
<li>Pill Separator with animated pill labels (pro)</li>
<li>Infinite marquee animation with speed control (Pro)</li>
<li>Bold Gradient Separator with SVG waves and decorative patterns</li>
<li>Spacing, padding, margin, border, shadow, and typography controls</li>
<li>Fully responsive on desktop, tablet, and mobile</li>
<li>Optimized for fast loading and clean output</li>
</ul>
<h3>Free Version Includes:</h3>
<h4>Free Includes:</h4>
<ul>
<li>Wave Separator (core features)</li>
<li>Icon Separator (fully free)</li>
<li>Basic Bold Gradient Separator</li>
<li>Responsive design</li>
<li>Unlimited usage</li>
<li>Clipboard Copy for Shortcode </li>
</ul>
<h4>Pro Version Unlocks:</h4>
<ul>
<li>Advanced wave motion directions and animations</li>
<li>Premium wave presets (Ocean, Neon Glow, Fire, Sunset)</li>
<li>Pill Separator with marquee animation and styling</li>
<li>Advanced Bold Gradient options (patterns, SVG overlays)</li>
<li>Priority support and automatic updates</li>
</ul>
<h3>How to use</h3>
<ol>
<li>Install and activate the Section Separator plugin.</li>
<li>Open the Gutenberg editor.</li>
<li>Add the Section Separator block from the Widgets category.</li>
<li>Customize settings from the right-side block panel.</li>
<li>Enjoy beautiful section dividers 🎉</li>
</ol>
<p>For installation help click on Installation Tab</p>
<h3>Feedback</h3>
<ul>
<li>Did you find a bug or have a feature request? <a href="mailto:support@bplugins.com" title="Send feedback" rel="nofollow ugc">Please share your feedback with us</a></li>
</ul>
<h3>Check out the Parent Plugin of this plugin-</h3>
<p><a href="https://bblockswp.com" rel="nofollow ugc"><strong>B Blocks</strong></a> – A blocks collection and page building tool for Gutenberg.</p>
<h3>Check out our other WordPress Plugins-</h3>
<p><a href="https://bplugins.com/products/html5-video-player/" rel="nofollow ugc"><strong>Html5 Video Player</strong></a> – Display videos as single and playlist in multiple skins.</p>
<p><a href="https://bplugins.com/products/pdf-poster/" rel="nofollow ugc"><strong>PDF Poster</strong></a> – Display/Embed PDF files with different styles.</p>
<p><a href="https://bplugins.com/products/html5-audio-player/" rel="nofollow ugc"><strong>Html5 Audio Player</strong></a> – Listen audios with awesome visuals.</p>
<p><a href="https://bplugins.com/products/streamcast-radio-player/" rel="nofollow ugc"><strong>StreamCast</strong></a> – Customizable radio player with different skins.</p>
<p><a href="https://bplugins.com/products/3d-viewer/" rel="nofollow ugc"><strong>3D Viewer</strong></a> – Embed 3D models and 3D products with interaction.</p>
<p><a href="https://bplugins.com/products/advanced-post-block/" rel="nofollow ugc"><strong>Advanced Post Block</strong></a> – Show posts and custom posts in different layouts.</p>


Section Separator Block – Visually Separate Page Sections

Create beautiful, modern section dividers with waves, icons, pills, and gradients—fully customizable and Gutenberg-ready.

Container Block vs Section Separator Block – Visually Separate Page Sections