Let’s make the same changes and load them into our Genesis child theme. Try to do this on your own first. Then watch the video and work with me.
Labs
Labs are hands-on coding projects that you build along with Tonya as she explains the code, concepts, and thought processes behind it. You can use the labs to further your code knowledge or to use right in your projects. Each lab ties into the Docx to ensure you have the information you need.
Each lab is designed to further your understanding and mastery of code. You learn more about how to think about its construction, quality, maintainability, programmatic and logical thought, and problem-solving. While you may be building a specific thing, Tonya presents the why of it to make it adaptable far beyond that specific implementation, thereby giving you the means to make it your own, in any context.
Lab Introduction
Let’s do a quick review and talk about what you will be doing in this lab. Then let’s get the starting boilerplate code installed in your plugins folder. Steps: Open terminal (or Git Bash on Windows). Navigate to your sandbox’s wp-content/plugins folder. Then type: git clone https://github.com/KnowTheCode/better-asset-versioning.git Type: cd better-asset-versioning. Delete the better-asset-versioning folder (it’s the final version of this plugin. Then copy the files from the lab-starter into the root of this plugin. Those are the boilerplate starter files. Here is the repository on GitHub.
Remove Query String from Static Resource URL
In Part 2 of the Better Asset Versioning series, let’s dive into how to remove the query strings, i.e. the ?ver=1.0.0 from the static resources. Static resources are the scripts, fonts, styles that we enqueue. When you run speed tests on sites like Pingdom, a common ding to the performance score is this very topic. Let’s build a plugin that removes the query string and places it inline as part of the static URL.
Applying It to Scripts
We’ve done the theme’s stylesheet. Now we need to apply the same strategy to the scripts and any remaining supplemental stylesheets. In this episode, you and I will refactor the Twenty Seventeen’s enqueue code while we discuss the strategy. Step-by-step, we’ll work through it together. As we do, we’ll find a flaw in our original code.
Refactor to Improve Our Code
Before we move on, let’s stop. We have a flaw in our strategy, specifically in the stylesheet URI callback. Challenge yourself and see if you can find it. Think about it. Part of your work here on Know the Code involves thinking through and planning out code construction. I’m trying to teach you how to strategize, think about code construction, and do problem solving. There are times when we’ll stop and look at potential problem areas. Our code has a flaw in it. See if you can find it on your own.
Load the Minified Stylesheet in Genesis
Now it’s time to port the changes over to the Genesis theme. The code is exactly the same as all that we did was a callback for the “stylesheet_uri” event filter in order to change the stylesheet’s URL to the minified version. Let’s do the same steps to the Genesis theme.
Strategy Session: Minified or Full for Theme Version
This episode is different. In this one, we’re talking strategy. It’s time to think about how we should approach setting the theme’s version. Should we use the minified or full stylesheet? Does it matter? Hmm, first, we need to look at how WordPress does it. Then we’ll look for a mechanism to change between the files. Let’s walk through WordPress Core and look at how it extracts the stylesheet’s version. We’ll explore wp_get_theme(). Spoiler alert: there is no mechanism. Bummer. Okay, then let’s talk through if we need to change our code or not. If you use an automated minifier, […]
Forget Hard Coding – Grab Stylesheet’s Version
Part of Strategy 2 is to grab the stylesheet’s version and use it as the theme’s version. This strategy eliminates redundancy and utilizes the version number that is required in the theme’s style.css header DocBlock. When? You want to use this strategy when it’s time to deploy or release the theme. You don’t want to use it in development or test modes.
Forget Hard Coding – Genesis
Let’s take the code we developed in the Twenty Seventeen theme and move it over to a Genesis child theme. I’m using the free Genesis Sample child theme.
Version Numbering Scheme
Before we go any further, let’s talk about version numbering scheme. There is no best practice or set standard that all must adhere to. Rather, each group, company, or team needs to define and standardize their version numbering system. WordPress uses a three sequence numbering scheme: 4.8.1, where the third sequence is a minor release. I recommend that you read this document, especially if you are going to work in Core. Other libraries, frameworks, and applications define and use their own numbering scheme. Take a look at Wikipedia’ Software versioning article. Quickly you’l notice that there are multiple strategies that […]
