Skip to content

Instantly share code, notes, and snippets.

@softiconic
Last active December 2, 2023 19:01
Show Gist options
  • Save softiconic/8223489e3ea904c746d3c41d081d66f1 to your computer and use it in GitHub Desktop.
Save softiconic/8223489e3ea904c746d3c41d081d66f1 to your computer and use it in GitHub Desktop.
Develop a new widget using the theme function with the Elementor page builder plugin.
//Elementor Function Code
class ElementorCustomElement
{
private static $instance = null;
public static function get_instance()
{
if (!self::$instance)
self::$instance = new self;
return self::$instance;
}
public function init()
{
add_action('elementor/widgets/widgets_registered', array($this, 'widgets_registered'));
}
public function widgets_registered()
{
// We check if the Elementor plugin has been installed / activated.
if (defined('ELEMENTOR_PATH') && class_exists('Elementor\Widget_Base')) {
// We look for any theme overrides for this custom Elementor element.
// If no theme overrides are found we use the default one in this plugin.
$widget_file = get_template_directory() . '/lib/widget_name.php';
$template_file = locate_template($widget_file);
if (!$template_file || !is_readable($template_file)) {
$template_file = get_template_directory() . '/lib/widget_name.php';
}
if ($template_file && is_readable($template_file)) {
require_once $template_file;
}
}
}
}
ElementorCustomElement::get_instance()->init();
<?php
namespace Elementor;
class test_widget extends Widget_Base{
/** Get widget name */
public function get_name(){
return "widget name";
}
/** Get widget title */
public function get_title(){
return "widget title";
}
/** Get widget icon */
public function get_icon() {
return "fa fa-list";
}
/** Get widget categories */
public function get_categories() {
return [ 'general' ];
}
/** Register widget controls */
protected function _register_controls() {
//Content
$this->start_controls_section(
'content_section',
[
'label' => __( 'Content', 'plugin-name' ),
'tab' => \Elementor\Controls_Manager::TAB_CONTENT,
]
);
//Description
$this->add_control(
'item_description',
[
'label' => __( 'Description', 'plugin-domain' ),
'type' => \Elementor\Controls_Manager::TEXTAREA,
'rows' => 10,
'default' => __( 'Default description', 'plugin-domain' ),
'placeholder' => __( 'Type your description here', 'plugin-domain' ),
]
);
//end control
$this->end_controls_section();
}
/** Render widget output on the frontend */
protected function render() {
$settings = $this->get_settings_for_display();
//echo item description
echo '<p>' . $settings['item_description'] . '</p>';
}
/** Content Template widget output on the frontend */
protected function _content_template() {
//echo item description instantly on any change value
?>
<p>{{{ settings.item_description }}}</p>
<?php
}
}
Plugin::instance()->widgets_manager->register_widget_type( new test_widget);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment