Q: How to override the Elementor's function in function.php?

Question

I want to write a new code to override original function：

For Exsample

ori code：

elementor-pro/modules/posts/skins/skin-cards.php

class Skin_Cards extends Skin_Base {
      protected function render_thumbnail() {
                .
                .
                $thumbnail_html = Group_Control_Image_Size::get_attachment_image_html( $settings, $setting_key );
                .
                .

new code：

theme child/function.php

add_action( 'elementor/widget/posts/skins_init',function() {

    class change_thumbnail extends \ElementorPro\Modules\Posts\Skins\Skin_Cards {      
        protected function render_thumbnail() {
                  .
                  .
                  $featured_images = $dynamic_featured_image->get_featured_images(get_the_ID());
                  .
                  .
       }
    }
    new change_thumbnail();
});

It's not work,How can I to fix it? thanks a lot.

Answer 1

Try this...

add_action( 'elementor/widget/posts/skins_init',function($widget) {

    class change_thumbnail extends \ElementorPro\Modules\Posts\Skins\Skin_Cards {      
        protected function render_thumbnail() {
                  .
                  .
                  $featured_images = $dynamic_featured_image->get_featured_images(get_the_ID());
                  .
                  .
       }
        public function get_id() {
            return 'card';
        }
    
        public function get_title() {
            return esc_html__( 'Card', 'elementor-pro' );
        }
    }

    $widget->add_skin( new change_thumbnail( $widget ) );

});