It has come in handy for me on a number of projects and is now my default for loading any stylesheet or script to a WordPress site. Hopefully this little post makes it a little easier to see how WordPress provides us with the ability to not just load styles and scripts from one place, but to load them anywhere based on conditions such as specific pages, posts, categories, archives and many other attributes. WordPress Themes typically consist of three main types of files, in addition to images and JavaScript files. For a visual guide, see this infographic on WordPress Theme Anatomy.
Wordpress enqueue script on specific page how to#
Examine the files in the default theme carefully to get a better idea of how to build your own Theme files. The list is exhaustive, so check all the conditional tags out and see them for yourself. WordPress includes a default theme in each new installation. WordPress offers a ton of conditional tags we can use to load files in interesting ways. If not, then load the other ones instead. See what we did? We wrapped the first example in a two part statement that says: if the current page URL slug is /new-page, then load the two new files we created. In other words, it relieves you have having having to link the files up manually in your HTML like this: What is wp_enqueue?īoth wp_enqueue_style and wp_enqueue_script is a WordPress hook that loads your stylesheets and javascript files to your site. Anything more is bloat which causes longer load times and higher data plan bills.
Wordpress enqueue script on specific page code#
In addition to writing code that is clean and efficient, it’s becoming a best practice to only serve the assets a user needs to view the page. There is a lot of chatter about web performance. Having everything together in your functions.php file is so much easier. It can be a pain to remember what is linked where. Sometimes we go so far as to link those assets on specific pages. We link certain files in the document < head> and some just before the closing < /body> tag. They don’t give an explanation, but here are a few reasons I will put out there. WordPress actually suggests that we use wp_enqueue_style and wp_enqueue_script to link stylesheets or javascript files to a website. Yes, this is widely documented, but I had to scour the interwebs for a while before I was able to piece it together. Thankfully, WordPress can load stylesheets and scripts conditionally by using the wp_enqueue function.
It made so much sense to create a new stylesheet than to build off the existing one, but it left me with a new problem: how do I serve that stylesheet to that specific section without serving the other stylesheet? There are times when we need break our stylesheets and javascript files up into multiple documents.įor me, this happened when a client asked me to add a new section to their WordPress site that had a significantly different design than the others.
0 kommentar(er)
