Archive for category: Tutorials

Problem

Add an Elementor field to an existing section and change the output of the Elementor Essentials Addon output, depending on the value of the field.

Case

My client asked me to add an extra field so he can choose to enable or disable the link to the Post Carousel element of the Elementor Essentials Addon Pro widget.

Solution

Step 1

We will need to hook to elementor/element/before_section_end to add the field as a first step. Thus, we need to add some code to our child theme or custom plugin (never edit directly on a commercial or free plugin)

On the above code, I am adding a “switcher” field (it’s actually a fancy checkbox) in the eael-post-carousel element and its eael_section_post_timeline_layout sections, by using the add_control method.

It should look like this:

Step 2

We then need to tweak the output of the Widget, in order to add or remove the link from the title of the slide.

We can use the elementor/widget/render_content hook for this, but we also need to use the method eael_get_query_args of the \Essential_Addons_Elementor\Traits\Helper trait. Thus, we need to create a class in order to use it.

On the above code, I am “getting” the helper trait, add the Elementor hook, and then tweak the output to serve my needs. You can, of course, override the whole output of the widget. Finally, I call the class.

The full code via Gist: