Here’s a useful article from CodePen about why it’s not common. Mostly, this is because most CSS must be loaded for a browser to start “painting” the web page’s content. Check that out:įor CSS, it’s less common and support to load it out-of-band. We have lots of experience and a great article about making wp_enqueue_script for JavaScript files asynchronous, which is common and supported well by browsers. The ones I do in my example code are the (1) “handle” or nickname for WordPress to use with our stylesheet, and (2) the actual URL (or web address) of our CSS file.īeing a Quick Guide, the topic of making wp_enqueue_style asynchronous is a little too ambitious for me to give you a final answers to. We must define two arguments, though the function can take more. Finally, we pass it all to the wp_enqueue_stylesheet function from WordPress.You’ll probably need a different function if you’re in a theme. For me, that meant getting the URL of the plugins directory using plugins_url, and then passing it the right arguments for it to produce the URL. Inside of that function, you’ll need to locate the URL for your CSS stylesheet.I recommend a more descriptive name though. For us, if you copied the line above, it would be function_name. Create a wrapper function for your use of wp_enqueue_style.The second function name will match function you create in #2. That looks something like add_action( 'wp_enqueue_scripts', 'function_name' ). Your first line of code is an add_action call which is used to make sure that WordPress runs the code that really contains your use of the enqueuing function.Wp_enqueue_style for Styling Your WordPress Site Everything from registering your own hooks to de-registering others:Ĭourse: A Complete Introduction to the WordPress Hooks System If you want even more depth about them, we’ve got a Course of free articles that goes deep. We’ve got way more details about WordPress hooks generally in this great article: If you watched the video, you may have already caught it, but for wp_enqueue_style, we’ve got to use a “WordPress hook” as well. □ Which WordPress Hook to Use with wp_enqueue_style If not, please keep reading, we’ve got a great explanation for you. If everything in the code made sense to you, you can probably stop reading and copy-and-paste it. 'sp_sytlesheet', // A "name" for our file This function runs because of the add_action If you put this code in a theme, the biggest change you’ll need to make is $file_url will probably get defined using something like get_stylesheet_directory_uri instead. For me in the video, this code lives is in a plugin. This code if directly from the video above, but reformatted with added comments. Wp_enqueue_style Example Code to Load Your Stylesheet, Nothing Else
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |