
- Overview
- Transcript
5.2 Theme Defaults and the "Customizer"
There are a couple of little required settings hidden away in the PHP files of your theme that might slip by you if you don’t know where to look. In this lesson, you’ll learn how to make sure the correct defaults are set for your theme so that image handling, plugin integration and use of the Theme Customizer all go according to plan.
1.Introduction2 lessons, 07:02
Free Lesson 1.1Underscores (_s) WordPress Theme Creation01:15
Free Lesson 1.2What’s in the _s Box05:47
2.Getting Prepped for _s Dev2 lessons, 17:20
2.1Set Up Your Pro WordPress Dev Environment10:35
2.2Generate _s and Setup Automation06:45
3.Just Add Style6 lessons, 55:14
3.1Organizing Your Customizations07:46
3.2Typography and Foundation for a Flexible Layout12:20
3.3Establish the Basic Overall Layout11:32
3.4Add Responsive Adjustments10:30
3.5Add Color, Look & Feel: Main Colors & Icons07:27
3.6Add Color, Look & Feel: Finer Points05:39
4.Customizing Theme PHP Files5 lessons, 36:25
4.1Better Custom Font Loading With wp_enqueue_style()06:55
4.2Add Touch-Friendly Responsive Menu Copy10:57
4.3Add Featured Image Support05:56
4.4Add Excerpt Support and a Styled “Continue Reading” Button05:16
4.5Add Widget Locations for the Slider and Social Icons07:21
5.Prepping the Theme for Release3 lessons, 14:31
5.1Add Compatibility JavaScript04:14
5.2Theme Defaults and the "Customizer"03:30
5.3Check the Theme, Customize the Theme Info, and Package It Up06:47
6.Conclusion1 lesson, 01:25
6.1Wrapping Up01:25
5.2 Theme Defaults and the "Customizer"
Hi, this is Kez. Welcome back to WordPress theme creation with underscores. In this lesson you're going to learn how to set two of the defaults that your themes will need to have. One is the content width variable which I'll explain in just a moment. And the other is the default background color for your theme, so that there's a default for people to fall back on when they're using the theme customizer that comes with WordPress. In your theme's function.php file, almost right at the top, you'll find this code here that sets the content width variable that WordPress works with. Now this is a little bit tricky to operate with. The content width variable, it wants to know what the width of the content in your post is. And when you have a responsive theme, that's a little bit tricky to nail down because there is no set width. So approximately the best way that you can handle this is to just put in the maximum width that your theme expands to. Now in our case, we never see the inside of the post area being any wider than around about 800 pixels. Even then we can't be too sure because if a user changes their font size and zooms out the site that value might change. So this is ballpark we're just going to go with best guess. So with our theme when the layout collapses down to a single column at around 900 pixels, the inside of the posts then is 800 pixels wide. Now WordPress will use this value to help deal with image handling and it will also help other plugins to interact with your content. So, what you want to do here is change this 640 value to 800. Yes, that is best guess. But in most cases, that value of 800 will probably do the job. The next thing we need to set in our theme is a default background color. Right now, if a user goes into the theme customizer and expands the color section, they'll be able to choose a background color. And they can change that around to anything that they like. And then if they decide that they don't like the color they've chosen and they hit the default button here. That will just be put back to a flat white color, but what we want is for that to be put back to the proper theme background color. Head back to your functions.php file and scroll down until you find this code here where we see add_theme_support custom background. And this is where that default color of white has come from. Now to give the default color the right value, all you need to do is just delete the color code that's already in there. And just replace it with the color code that we're using for our theme. Back in the theme customizer again, now when the user plays around with the background color and they decide they wanna set it back to the default, you see that we have the correct color being reverted back to. Your theme is now almost there. In the next and final lesson, you'll learn how to do a couple of last minute checks, how to customize the theme info so everybody knows who you are and where you can be found on the Internet, and how to package up your theme so that it's ready for other people to install on their WordPress sites. I'll see you in the next lesson.