How to load a Scripts or Styles, only the page that used this widget?

[PGdevsoft]

How to load a Scripts & Styles, only the page that used this widget?

Ref.
https://developers.elementor.com/add-javascript-to-elementor-widgets

Now if register Styles or Scripts by this function

public function __construct($data = [], $args = null) {
      parent::__construct($data, $args);
      wp_register_script( "script-handle","path/to/file.js", ["elementor-frontend" ],"1.0.0", true );
   }

Scripts or Styles include every page.
——————————————

I Need to include a Scripts or Styles, only the page that used this widget.
Because affect with web performance page speed

[m1ga]

For my use-case I've added that into the render function. Then the scripts are only included in the page where the element is rendered.
edit: I only use this for scripts since it didn't work for the styles in editor (front end was fine)

[PGdevsoft]

Thank you for help.

It same my solution but backend style is very broken.
Is there a better way? I'm waiting for Elementor Team to help.

[PGdevsoft]

@mark-elementor @rami-elementor
Can you help me please? Thanks you

[m1ga]

it's not very nice to link the devs in tickets. They'll help when can. Sure they'll get enough mails 😄

[rami-elementor]

Hi @PGdevsoft

We have this ability built-in. Read those doc:

• https://developers.elementor.com/docs/widgets/widget-dependencies/
• https://developers.elementor.com/docs/scripts-styles/
• https://developers.elementor.com/docs/scripts-styles/widget-scripts/
• https://developers.elementor.com/docs/scripts-styles/widget-styles/

Also see this example: https://developers.elementor.com/docs/controls/frontend-available
it talked about a different topic but it has a addon full example.

[PGdevsoft]

It Worked.
https://developers.elementor.com/docs/widgets/widget-dependencies/

Thank you for helping.

[PGdevsoft]

I'm having some issues

How to load get_style_depends in header not footer.

Now enqueue the styles in the footer.

[m1ga]

#9005 (comment)