Now, you need to migrate over the scripts and style (assets). In this video episode, you will create a new asset loader file, which will handle the WordPress enqueuing process for the assets.
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.
Title Area Styles – Part 1
There are multiple strategies for refactoring. I will show you multiple ways to accomplish the same objective. We will walk through the thought process of why you might want to use one over another. The point is: use what works best for you. For example, where do you put .header-image styles? Do you embed them into each sub-component such as the .title-area? Or do you make a separate partial just for the specific use case of .header-image? Let’s talk our way through it for you to determine what works best for you. A rule of thumb for deciding where to […]
Dividing Up the Title Area Styles
In this episode, you will walk through a couple of different approaches to handling the title area. Notice that it is comprised of the base styles for the title area plus the site title, site description, and header image styles. Ah, each of those is sub-components within the sub-module. So how would you handle the Sass styles? A good rule of thumb is: can you quickly and easily find the styles. By breaking them up into partials for each of the sub-components, you can more easily find what you are looking for just by reading the partial’s file name. All […]
Genesis Structural Components
In this episode, you will move each of the Genesis structural components into their respective files. You’ll be specifying the PHP namespaces and each callback.
Base Styles
Let’s start by migrating the media queries into the base styles of the site header. Then you will walk through the thought process and exercise of refactoring the base styles.
Lab Introduction
In this lab, you and I are going to finish the header module by bringing in the media queries, refactoring, and assigning new variables. Why don’t you try to finish this module on your own using the strategies that you learned in Part 2b Navigation Sass Module? Then watch these videos to see how Tonya thinks about refactoring. Remember, you want to build this module and all of your codebase to fit the way you think, how you work, and your workflow. There are many different ways to solve the same problems, i.e. many different ways to write code. Don’t […]
Refactoring Image Sizes
Your homework in the last episode was to refactor the image sizes on your own. In this episode, we’ll walk through how to move the image size name and arguments into a configuration variable. Just like the theme supports, calling the image sizes over and over again is WET and unnecessary. Let’s refactor to clean up the code and remove the redundancies.
Refactoring Theme Supports
Did you notice that the function add_theme_support() is being called over and over and over again in the setup? And did you notice that this function requires a key and then a value? I mentioned in the last episode that the final version of this starter theme will load all of the theme supports from a configuration file. Calling this function repeatedly is redundant and unnecessary. Let’s refactor it to convert the theme to clean, quality coding standard. In this episode, you will refactor the WordPress theme supports to move the parameters into a local configuration array. Then you’ll loop […]
Setup Tasks
In this episode, let’s move the setup tasks out of the Genesis Sample theme and put them into our new starter theme’s setup.php file. You’ll see two different strategies of how to load these setups. Plus you will break up each of the setups into separate functions to prepare for when you will load all of them from a configuration file.
Initialization Tasks – Directory Constants
Now it’s time to declare the directory constants for your theme. I’ll walk you through the process and explain why using get_stylesheet_directory() repeatedly is less performant (slower) than using a constant, such as CHILD_THEME_DIR or even the one built into Genesis CHILD_DIR.
