This documentation provides comprehensive insights into the Shape Divider Extension developed by Zoloblocks.

Activate the Shape Divider Extension

On WordPress Dashboard Navigate to ZoloBlocks from the sidebar menu.

1. Select the Dashboard option under ZoloBlocks.
2. Go to the Extension tab.
3. Use the search bar to search for “Shape Divider”
4. Click Enable to activate the Shape Divider extension.

Where to Find the Extension

Select Container and Go to Style Tab Section

1. Select Container from the lists view.
2. Select the Container.
3. Go to Style Tab of the container.
4. Find the section named ” Shape Divider “.

Shape Divider

A shape divider is a design element used to create visually appealing transitions between different sections on a webpage. Instead of using straight horizontal lines, shape dividers introduce creative curves, waves, angles, or other geometric shapes to separate content areas.

Type: None

1. Type : Default selected None. It will display nothing.

Type: Arrow

Top

1. Type: Select the shape divider type Arrow.
2. Color: Set the color for arrow.
3. Width: Set the width for the arrow.
4. Height: Set the height for it.

5. Invert: Enable the switcher to invert the arrow.
6. Bring to Front: Enable the switcher to bright to front the arrow.

Bottom

1. Type: Select the type Arrow.
2. Color: Select the color for arrow.
3. Width: Set the width for the arrow.
4. Height: Set the height for it.

Type: Book

Top

1. Type: Select the type Book.
2. Color: Select the color for book.
3. Width: Set the width for the book.
4. Height: Set the height for it.

Bottom

1. Type: Select the type Arrow.
2. Color: Select the color for arrow.
3. Width: Set the width for the arrow.
4. Height: Set the height for it.
5. Invert: Enable the switcher to invert it.

Type: Clouds

Top

1. Type: Select the type Clouds.
2. Color: Select the color for clouds.
3. Width: Set the width for the clouds.
4. Height: Set the height for it.

5. Flip: Enable the switcher to flip the clouds.
6. Invert: Enable the switcher to invert it.
7. Bring to Front: Enable the switcher to bring it front.

Type: Triangle

Top

1. Type: Select the type Triangle.
2. Color: Select the color for triangle.
3. Width: Set the width for the triangle.
4. Height: Set the height for it.

Bottom

1. Type: Select the type Triangle.
2. Color: Select the color for Triangle.
3. Width: Set the width for the Triangle.
4. Height: Set the height for it.

Type: Waves

Top

1. Type: Select the type Waves.
2. Color: Select the color for waves.
3. Width: Set the width for the waves.
4. Height: Set the height for it.

Bottom

1. Type: Select the type waves.
2. Color: Select the color for waves.
3. Width: Set the width for the waves.
4. Height: Set the height for it.

By following these instructions, you can use the Shape Divider extension to transform a regular container into a stunning design.

Video Assist

The Video help you to learn more about the block. Please visit the demo page for examples.

Thanks for being with us.