wp_enqueue_style example brings E_NOTICE

[cweiske]

Issue Description

I followed the "adding your stylesheet" instructions at https://developer.wordpress.org/themes/basics/including-css-javascript/#stylesheets and got an E_NOTICE from my wordpress 6.5 instance:

To enqueue style.css:
wp_enqueue_style( 'style', get_stylesheet_uri() );
This will look for a stylesheet named “style” and load it.

Message I got from wordpress:

Notice: Function wp_enqueue_style was called incorrectly. Scripts and styles should not be registered or enqueued until the wp_enqueue_scripts, admin_enqueue_scripts, or login_enqueue_scripts hooks. This notice was triggered by the style handle. Please see Debugging in WordPress for more information. (This message was added in version 3.3.0.) in wordpress/wp-includes/functions.php on line 6078

URL of the Page with the Issue

https://developer.wordpress.org/themes/basics/including-css-javascript/#stylesheets

Section of Page with the issue

Enqueuing Scripts and Styles > Stylesheets

Why is this a problem?

The documentation should tell me what I have to do to make it right, not provide code that gives errors.

Suggested Fix

Already tell about the wp_enqueue_scripts function.

[github-actions]

Heads up @WordPress/docs-issues-coordinators, we have a new issue open. Time to use 'em labels.

[github-actions]

Heads up @kafleg @carolinan @TeBenachi - the "themes" label was applied to this issue.

[carolinan]

So how can readers be encouraged to continue reading and not only copy part of the code example?

[cweiske]

I copied the whole example.
The section at the end of the page tells you that

It is best to combine all enqueued scripts and styles into a single function

- but even it does not tell you that all the previous examples were incomplete.

[justintadlock]

The relevant documentation for including assets is here and includes more in-depth examples: https://developer.wordpress.org/themes/core-concepts/including-assets/

I'm not sure how we might want to address the current page since it will be deprecated/removed or integrated into the Classic Themes chapter as part of #816. The information isn't wrong. It just assume some preexisting knowledge about the correct hooks to use (this isn't the case with the newer doc).

Maybe, for now (at least until the Classic Themes chapter is overhauled), we should put an alert banner at the top of the page to redirect readers to the new doc??

[estelaris]

@justintadlock that is a good solution. Are you able to update the article?

[justintadlock]

Updated and added an alert box to go to the newer doc: https://developer.wordpress.org/themes/basics/including-css-javascript/

[cweiske]

Thank you.