skip to Main Content

I recently followed this simple tutorial that allowed me to register and use my own custom Elementor widget on a WordPress site that I’m developing.

https://develowp.com/build-a-custom-elementor-widget/

What I can’t figure out, however, is how to adapt this code so that I can register multiple different elementor widgets. What’s happening right now is that as soon as I try to register a 2nd custom Elementor widget — the 2nd widget completely overrides my 1st widget (both within Elementor in the admin, as well as on the front end of the site.

Here are the few lines of code that I tried modifying in my "my-widgets.php" file (which I am referencing in my functions.php file, just like in the tutorial):

    protected function __construct() {      
        require_once('rpp_contact_bar.php');
        require_once('rpp_newsletter_sign_up_bar.php');
        add_action( 'elementor/widgets/widgets_registered', [ $this, 'register_widgets' ] );
    }       

    public function register_widgets() {
        ElementorPlugin::instance()->widgets_manager->register_widget_type( new ElementorMy_Widget_1() );
        ElementorPlugin::instance()->widgets_manager->register_widget_type( new ElementorMy_Widget_2() );
    }

Note that my 2 widget PHP files (referenced in the code above) use the class names "My_Widget_1" and "My_Widget_2" to extend the "Widget_Base" class.

What am I missing here? What is the proper way to register multiple different custom Elementor widgets within a child theme?

Thanks,
— Yvan

2

Answers


  1. Please try the below code –

    protected function __construct() {      
            require_once('rpp_contact_bar.php');
            require_once('rpp_newsletter_sign_up_bar.php');
            add_action( 'elementor/widgets/widgets_registered', [ $this,'register_widgets' ] );
            add_action( 'elementor/widgets/widgets_registered', [ $this,'register_widgets_1' ] );
        }       
    
        public function register_widgets() {
            ElementorPlugin::instance()->widgets_manager->register_widget_type( new ElementorMy_Widget_1() );
        }
    
        public function register_widgets_1() {
            ElementorPlugin::instance()->widgets_manager->register_widget_type( new ElementorMy_Widget_2() );
        }
    
    Login or Signup to reply.
  2. Your classes (My_Widget_1 and My_Widget_2, in your example) contain a get_name() method, which returns the same name for both of your widgets. You should change one of them so each name is unique.

    Each widget needs to have a few basic settings like a unique name that the widget will be identified by in the code […]

    "Creating a New Widget", Elementor Developers


    It seems that widgets follow the same rules as function names in PHP (i.e. starting with a letter or underscore, followed by letters, numbers, or underscores). Though, I couldn’t find anything mentioning that in the docs.

    So, I think your title-subtitle wasn’t working because of the hyphen (-).

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search