Jakob Wiens

<p><strong>TZM Section Block</strong> brings powerful enhancements to the Gutenberg editor, allowing you to create visually appealing sections for your website with ease. This block is based on the official “Cover block” but offers advanced features for greater flexibility and design options.</p>
<ul>
<li><strong>Enhanced Parallax Background</strong>: Choose from “slow,” “medium,” and “fast” parallax speeds for a dynamic visual effect beyond the traditional “fixed” option.</li>
<li><strong>Customizable Divider Shapes</strong>: Add top and bottom divider shapes to your sections. Choose from various shapes and customize their color, height, and more.</li>
<li><strong>Responsive Full-Height Sections</strong>: Adjust full-height sections (100vh) to fit perfectly on screens by subtracting the height of a CSS selector element, such as a fixed header.</li>
<li><strong>Overflow Content Control</strong>: Easily hide or display overflowing content within a section.</li>
</ul>
<p>With these advanced options, TZM Section Block empowers designers and developers to craft sections that stand out while providing intuitive controls for seamless customization.</p>
<h3>Source Code</h3>
<p>The source code for TZM Section Block is now available on GitHub!<br />
Follow the development, report issues, and get involved in improving the plugin. We welcome contributions, feedback, and feature requests from the community.</p>
<ul>
<li><a href="https://github.com/jakobwiens7/tzm-section-block" rel="nofollow ugc">View on GitHub</a></li>
</ul>


TZM Section Block

Build cool and eye-catching sections with parallax effects, shape dividers, and more handy features using this versatile Gutenberg block.

Kevin Batdorf

<p>Generate and add a simple wavy divider to anywhere on your page, giving you the ability to separate blocks of content with an impressive, professional-looking design element.</p>
<ul>
<li>Follow <a href="https://twitter.com/kevinbatdorf" rel="nofollow ugc">@kevinbatdorf</a> on Twitter</li>
<li>View on <a href="https://github.com/KevinBatdorf/wavy-divider" rel="nofollow ugc">GitHub</a></li>
</ul>
<h4>Features</h4>
<ul>
<li>Color settings, including opacity.</li>
<li>Choose between wide, normal, and full width</li>
<li>Choose between rounded edges and stright lines</li>
<li>Fine tune curves and lines with built-in controls</li>
<li>Supports top or bottom shapes</li>
<li>Stack multiple dividers with group block (see below)</li>
<li>Gradients – easy to use (see below)</li>
<li>Control height, number of points, and direction</li>
<li>Use a single, smooth point to give you a curved divider</li>
</ul>
<h4>Gradients</h4>
<p>To use a gradient, you need to wrap the wavy divider in a group block and apply the gradient to the group block. After that, create a wavy shape and apply a color that matches your content background (e.g. white). You can then switch the direction of the divider (under settings) to give a mirrored effect. This way the gradient is applied to the group block and the wavy divider acts as a mask.</p>
<h4>Group Block</h4>
<p>If nesting the wavy divider in a group block, you may want to remove the padding and margins so that the wavy divider will not have spacing around it. To handle this, select the group block, and under “Advanced” (at the bottom of the settings area) add these two classes:</p>
<ul>
<li><code>wavy-divider-remove-margin</code></li>
<li><code>wavy-divider-remove-padding</code></li>
</ul>
<h4>Patterns</h4>
<p>Within the block inserter, under the Patterns tab, select ‘Wavy Divider’ from the dropdown menu to view some example patterns.</p>


Wavy Divider

A colorful, fun, lightweight divider block to energize your website with character and pizazz

TZM Section Block vs Wavy Divider