Skip to content

Button Control ​

Elementor Core Basic

Elementor button control displays a button in the panel that can trigger an event.

The control is defined in Control_Button class which extends Base_UI_Control class.

When using this control, the type should be set to \Elementor\Controls_Manager::BUTTON constant.

Arguments ​

NameTypeDefaultDescription
typestringbuttonThe type of the control.
labelstringThe label that appears above of the field.
descriptionstringThe description that appears below the field.
show_labelbooltrueWhether to display the label.
label_blockboolfalseWhether to display the label in a separate line.
separatorstringdefaultSet the position of the control separator. Available values are default, before and after. default will hide the separator, unless the control type has specific separator settings. before / after will position the separator before/after the control.
textstringThe button text.
button_typestringdefaultThe button type. Available values are default, info, success, warning and danger.
eventstringThe event the button will trigger. The event will be triggered via elementor.channels.editor.on( event ).

Return Value ​

This control does not return any value.

Usage ​

php
<?php
class Elementor_Test_Widget extends \Elementor\Widget_Base {

	protected function register_controls(): void {

		$this->start_controls_section(
			'style_section',
			[
				'label' => esc_html__( 'Style', 'textdomain' ),
				'tab' => \Elementor\Controls_Manager::TAB_STYLE,
			]
		);

		$this->add_control(
			'delete_content',
			[
				'label' => esc_html__( 'Delete Content', 'textdomain' ),
				'type' => \Elementor\Controls_Manager::BUTTON,
				'separator' => 'before',
				'button_type' => 'success',
				'text' => esc_html__( 'Delete', 'textdomain' ),
				'event' => 'namespace:editor:delete',
			]
		);

		$this->end_controls_section();

	}

}