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.
There is a difference between the WordPress functions is_front_page() and is_home(). The state of these functions is determined by how you (or your client) configures the site in the Settings > Reading section (in the back-end). In this lab, you will see how different settings can cause a different set of states.
Let’s see the difference. You will explore what the different states are based on the settings in Settings > Reading. You will also learn the intent of these functions. The Posts Page is always going to set the is_home() to true. However, is_front_page state is determined by which page is assigned to be the front page, i.e. a static page or the Posts Post. Let’s see how this works.
In WordPress, these two functions can be confusing. They are identifying if the current web page request is for the front page or the Posts Page. Let’s get you setup and ready to do this simple lab. Just follow along with the instructions.
Step 2 is to enqueue the stylesheet resource. Google Fonts gives you what to enqueue. Where do you put this into your WordPress website? You will use the WordPress function wp_enqueue_style. Let’s talk about what this function does. What if you need to load up more than one Google Fonts? What is the syntax? You use the pipe | to separate out each of the font families. Let’s dig into the enqueuing and write the code for it. Don’t worry, as it’s very easy. You are actually writing PHP code here, even though it’s very little. It’s still PHP. Psst….here […]
In this episode you will learn about how to work with the Google Fonts’ site, how to select the styles, and then what are the options they supply. Then you will work in Google Chrome Developer Tools to find where the insert the CSS. You will also see the result of when you forget to enqueue the resource, as the font is not loaded. Let’s get into the code as well as exploring the HTML and CSS tools available to you.
Adding Google Fonts into your WordPress website is a two-step process, which requires you to add CSS and PHP to your theme or plugin. Many people forget to do one of the steps. In this hands-on lab, you will write the code while I walk you through it step-by-step.
This lab is the Part 3 of the Developer’s Guide to Customizing Genesis series. In this lab, you will be learning how to customize the header component within the Genesis framework, which includes site header, logo/title area, header right, and navigation.
Let’s review what you did here in this lab before you move on to the second part of this lab. I broke up this lab into two separate labs to help you keep track of where you are, as there are a lot of videos and materials to cover. Now in second part of this lab, you will be customizing the site header area with three (3) different layouts and a utility bar.
The header right sidebar is a default widget area built into the Genesis framework. It allows you add different widgets into the site’s header including adverts, menus, search, social media, and more. Let’s explore how Genesis builds this sidebar.
The site’s description provides additional information about the site, such as its intent, tag line, or slogan. Let’s see how Genesis builds the HTML for this element.
Know the Code develops and empowers professional WordPress developers, like you. We help you to grow, innovate, and prosper.