Skip to content

Snippet: Add Custom WPBakery Shape Divider Styles

Important: Once you define your custom styles via the filter below you will need to create a file inside your child theme at assets/shape-dividers/my-custom-divider.svg with your SVG code. For settings to work correctly make sure you add the classname "wpex-shape-divider-svg" to the svg tag and the classname "wpex-shape-divider-path" to any path element in your custom SVG file.

When displaying WPBakery rows using the Total theme you will have access to choose from various section devices for the top or bottom of the row which can be used with backgrounds to create cool affects such as a slanted background. The following snippet allows you to add your own custom section divider styles to choose from.

/**
 * Add Custom Section Divider Styles.
 *
 * @link https://total.wpexplorer.com/docs/snippets/custom-divider-styles/
 */
add_filter( 'wpex_get_section_shape_divider_types', function( $types ) {
	$types['my-custom-divider'] = esc_html( 'Custom Divider', 'text_domain' );
	return $types;
} );
All PHP snippets should be added via child theme's functions.php file or via a plugin. We recommend Code Snippets (100% Free) or WPCode (sponsored)
Back To Top