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.
If we do not get our meta key back within the $_POST, then we can infer that our meta box does not exist on this screen. That means there’s nothing for us to process in the database. Let’s put code in to check that key. If it’s missing, then bail out.
We use the WordPress nonce value to secure our saving process and determine if we should continue or not. Let’s talk about the nonce field and validation check in this episode. Watch this episode! We use the WordPress generated nonce for the following reasons: Validate if our meta box is on this screen. Validate that our meta box is (for the most part) valid. Nonce is a technique to validate that we are receiving what we expect. Resources WordPress Nonce wp_verify_nonce
This episode is VERY important as you’ll learn how a form in the browser is processed back on the web server. The entire back-end interface on the edit post and page screens is an HTML form. The meta box you built earlier is a component of input fields within that form. When you click on Publish or Update, all of the content on the page is sent back to the web server and stored in the $_POST super global in PHP. Big points here for you to master: Saving a post, page, custom post type, etc. triggers a post back […]
When the screen in the back-end renders, WordPress calls our meta box callback, which we called render_meta_box. In your code, that function does the following tasks: Grabs the metadata out of the database. Does processing if you need it. Loads our view file, which gets rendered out to the browser. Make sure you do this episode with me, as I walk through the code, HTML, and thought processes. You’ll see how little code it takes to create the meta box’s HTML. Resources Variable scope when including files (such as the view file) wp_nonce_field get_post_meta
The first step is to register your new meta box with WordPress. You’ll need to register a callback to the action event admin_menu and then use the WordPress function add_meta_box. Let’s walk through the code, look at the function in WordPress core, and look at the HTML.
Let’s recap what a meta box is and why and when you should build a custom one. A meta box is a UI (user interface) component to allow interactivity with content but without the technical aspects. Think about that statement. A meta box makes it easy to interact with content by adding, editing, deleting, etc. WordPress comes with a built Custom Field meta box. That interface is fine for simple projects or your own stuff. But for clients, we want to make it easier, more intuitive, and less technical. A meta box lets us abstract away the complexity such as […]
Let’s get you ready to start this lab. I’ll walk through your setup. Use the same setup and sandbox you created in the Post Metadata Basics lab, including having Kint installed. You need to clone the starting plugin from GitHub. You will need Git installed on your machine in order to do this. Follow along with me in the video to clone it to your machine. Make sure the Meta Box Basics plugin is on the “master” branch by typing: git checkout master Then activate the plugin.
Know the Code develops and empowers professional WordPress developers, like you. We help you to grow, innovate, and prosper.