Creating your first element
An element in ZIon Builder contains the php file of the element and the vue.js file of the eleement. Creating a new element class should have the following basic structure in PHP file: class MyElement extends Element { public function get_name() { return __( ‘My element’, ‘text-domain’ ); } public function get_type() { return ‘my_element’; } public function get_category() { return ‘category_id’; } public function render( $options ) { // HTML elements } } Optional functions […]
Class Elements
Extending Elements class is done by adding the following filter and actions: class Elements { public function __construct() { add_filter( ‘zionbuilder/elements/categories’, [ $this, ‘add_elements_categories’ ] ); add_action( ‘zionbuilder/elements_manager/register_elements’, [ $this, ‘register_elements’ ] ); add_action( ‘zionbuilder/editor/before_scripts’, [ $this, ‘enqueue_scripts’ ] ); } } Registering a new element category Registering a new category is done by applying the filter ‘zionbuilder/elements/categories’ A category is an array with the following structure: public function add_elements_categories( $categories ) { return [ [ ‘id’ => ‘category_id’, ‘name’ => __( ‘My Category’, ‘text-domain’ ), ‘priority’ => 10, […]
Add additional CSS classes to the class selector dropdown
With the release of v3.6.0, we have added the ability for 3rd party developers to register their own CSS classes so that the final users can select and use them from the element selector dropdown. In order to register your classes, we provide a simple API that you can use: After registering the css classes, […]