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
Please try the below code –
Your classes (
My_Widget_1
andMy_Widget_2
, in your example) contain aget_name()
method, which returns the same name for both of your widgets. You should change one of them so each name is unique.– "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 (-
).