skip to Main Content

I am using the latest version of Elementor Pro 13.1.3 and I have added a toggle widget to one of my pages.

enter image description here

enter image description here

The ID of the toggle is ‘dlista’ and is assigned through the ‘Advanced’ tab as a CSS ID.

enter image description here

What I want to do is add content to the toggle with PHP. Currently, I have created a shortcode and copied the HTML code of the above toggle widget. I am fetching data from my database and creating entries automatically. But the styling of it is a big issue and the code gets very messy. To make it responsive is even harder and I would end up with creating a duplicate widget of my own, just to be able to add custom text to it.

As I don’t want to change anything else apart from the text shown within the widget, I think it would be easier to add the widget through Elementor and style it accordingly, and just add the items programmatically somehow.

Anyone that could provide an example or help me achieve this? I just can’t figure it out..

Thank you in advance.

2

Answers


  1. function add_custom_items_to_toggle_widget_elementor($items, $widget) {
        
        if ('toggle' === $widget->get_name()) {
            
            $new_items = array(
                array(
                    'title' => 'Item 1',
                    'content' => 'Item 1 content',
                    'active' => false,
                ),
                array(
                    'title' => 'Item 2',
                    'content' => 'Item 2 content',
                    'active' => false,
                ),
                
            );
    
            $items = array_merge($items, $new_items);
        }
    
        return $items;
    }
    add_filter('elementor/widget/toggle/section_items', 'add_custom_items_to_toggle_widget_elementor', 10, 2);
        
    

    You can add this to your theme’s functions.php file.

    Login or Signup to reply.
  2. function add_custom_items_to_toggle_widget_elementor($items, $widget) {
        
        if ('toggle' === $widget->get_name() && 'toggle-widget-id-here' === $widget->get_id()) {
            
            $new_items = array(
                array(
                    'title' => 'Item 1',
                    'content' => 'Item 1 content',
                    'active' => false,
                ),
                array(
                    'title' => 'Item 2',
                    'content' => 'Item 2 content',
                    'active' => false,
                ),
                // Add more items as needed
            );
    
            // Merge the new items with the existing ones
            $items = array_merge($items, $new_items);
        }
    
        return $items;
    }
    add_filter('elementor/widget/toggle/section_items', 'add_custom_items_to_toggle_widget_elementor', 10, 2);
    

    Try this code.

    Use below code for get widget id.
    $widget_id = $widget->get_id();

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