In the previous episode, you explored the file structure. In this one, you will walk through the Genesis framework’s codebase. You’ll explore the actual code. We will focus on the main structural templating files. Here is the link to the PHP while Docx.
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.
File Architecture
Web pages are comprised of various components, such as the header, footer, navigation, content areas, etc. Genesis divides up its architecture into components. In this episode, you will explore the file structure of the framework in order to find the various components. You’ll learn about the intent of each of the sub-modules, where files are loaded.
Visual Hook Guide and the HTML – Footer
Let’s continue exploring the Genesis framework’s HTML markup structure in a visual manner. In this episode, you will look at the footer component, which is from the <div class=”footer-widget”> (if you have footer widgets configured) to the closing </html>.
Visual Hook Guide and the HTML – Content
Let’s continue exploring the HTML in a visual manner. In this episode, you will look at the content component, which is from <div class=”site-inner”> to the closing “content” </div>.
Visual Hook Guide and the HTML – Header
It helps you to know the end result of the code when you see it. In this episode, you will use the Genesis Visual Hook Guide plugin to first visualize how Genesis structures the HTML. Then you will look at the actual HTML to see what has been built for you. In this episode, you will explore the header, which is from the opening DOCTYPE to the <div class=”site-inner”>. Here are some links to the Docx to help you out: get_header() genesis() Let’s Test What You Learned Let’s test what you just learned doing this episode with me. Take a […]
The Intent of the Theme
What is the intent of the WordPress theme? What purpose does it serve? How is it different from plugins? A theme’s intent is to prepare and render out the HTML, i.e. content presentation. It handles the process of building what is needed to head out to the browser. In contrast, plugins are meant for extending or changing behavior and functionality. Features such as custom post types, taxonomies, widgets, shortcodes, etc. all go into a plugin. Plugins may even have their specific template files; however, styling is still a theme responsibility.
The Intent of HTML and its Markup
The intent of HTML is to provide structure and meaning for your content to be read by other software, such as the browser, screen readers, and web crawlers. While humans can read content even when it’s not well-formed, software needs a set of strict rules in order to parse it and do its work. Software is not intuitive and cannot read your mind or intent. It needs to be structure and a set of well-formed, strict guidelines. HTML provides this for us. The intent of markup is: to give you anchors for styling to give JavaScript anchors to traverse, target, […]
Web Page Sequence – in the Code
Next, let’s go into the actual WordPress Core, Genesis, and the child theme code. You will see the order (or sequence) in which files are loaded.
Web Page Sequence
Let’s do an overview of the web page, from its web request and back out to the browser. You will see the order (or sequence) of how the web request is processed, in a big picture view, including how the theme’s functions.php file and template are called.
The Why of the Genesis Framework
Genesis is my theming framework of choice because it is built for the developer. It allows you to customize everything without having to rewrite large sections of code or recreate template HTML structures. It is modular and complies, for the most part, to clean, quality coding standards and concepts. It is easy to read the codebase, which helps you to find what you need and then get on to writing the custom bits. Let’s talk about the why of the Genesis framework from the professional developer’s perspective.