Ready to watch this entire course?
Become a member and get unlimited access to the entire skills library of over 4,900 courses, including more Developer and personalized recommendations.Start Your Free Trial Now
- View Offline
- Building a design in Photoshop
- Converting Photoshop design to HTML and CSS
- Setting up MAMP on Mac and WAMP on Windows
- Moving HTML and CSS into a WordPress theme
- Building navigation
- Using custom fields
- Creating a commenting system
Skill Level Intermediate
jQuery is really popular one. So we are going to be loading up the jQuery library first and then our custom script. So it depends on that library being loaded first. So how do we do that? Well, in the blank theme that we started with there is this function.php file, and we only made one little alternation to it when we added our menus, but all the rest of this code came from that blank theme. We haven't touched it very much. I want to focus on this section right here. There is a few things going on right here.
First thing is it does a test and it says, if and then an exclamation point is_admin. It's saying if it's not the admin area, then do this code in between here. And there's three functions that are running. One of them says deregister_script, wp_deregister_script jquery, and wp_register_script jquery, and then enqueue_script jquery. So what its doing is it's saying that jQuery has already been a registered script, whatever that is, and then so I want to deregister it and then reregister it and then enqueue it.
Now, if I close that out, come back over here, and uncomment these two lines, and in TextMate, I can highlight multiple lines and comment or uncomment things with Command+/. Now it's deregistering and reregistering with this URL. Now, that URL points to a version of jQuery that lives out on Google Servers. Now, the reason you might want to do that is because, chances are Google Servers are a lot faster than yours, lot more reliable than yours, and if another page uses this, which is very common, it's going to come out of your browser's cache and still having to re-download it again.
Now, you notice how that worked even if these two lines were gone, that still worked, because jQuery is one of the scripts that comes with WordPress. Now, there's a number of other ones that come with it. If we wanted to use Prototype, we could just put the word prototype in there, reload the page over here, view the source. You can see that the Prototype Library is being linked to it here. It also ships with WordPress. So what are all of your different options, what are all the different scripts that ship with WordPress? There is this URL right here that comes right from WordPress.org itself and it's just a big list of all the scripts that ship with WordPress.
It's just this wp_head. So all the stuff that gets enqueued, just gets spit out at this one little line here and it keeps our header.php file clean. You can see there is already enough stuff in here. So it's just kind of a way to keep ourselves organized and clean. It's the fact that we can enqueue these scripts back here. Now, the most important part that we haven't mentioned yet about enqueuing scripts is that it's just the courteous thing to do. It tells WordPress that we are indeed using jQuery.
Now, if another script comes along and also needs jQuery, WordPress already knows that you have jQuery registered and won't overwrite you. It won't load another copy of jQuery, which will almost certainly cause problems. There is a popular plug-in called WP-Pulse. It's great. If you want to add Pulse to your site, just load up this plug-in, put it in there, and you can add a Pulse to your sidebar in your widgetized area. It also ships with jQuery and loads up jQuery. Now, if we were to go into our header.php file, just put a script tag right in here, have that link out to jQuery somewhere, WordPress doesn't know about that and it's going to load up when we use WP-Pulse another copy of jQuery.