 Welcome, beautiful. Welcome to create a four page WordPress website, number one and interactive step by step series. Alrighty, so hi I am Sarah snow I'm a former teacher I taught English I taught creative writing I taught journalism. You will definitely hear barking or whistling birds in the background of today's session my bird may also say hello. She has a vocabulary of about 10 words so she's sitting right here. I love green chili learning languages I make lots of websites and I love to hike. And I'm a training team contributor slash mad scientist so this is the start of what I'm hoping will be a great series and I'm hoping that eventually we can turn this into kind of a cohort model so that we can evaluate our work get suggestions share all of that, but we'll do our best to see how this goes today. So, expectations the number one expectation always is respect yourself and everyone in this session I was going to say this room we were going to have breakout rooms but my co host was unable to make it today but that's okay. Do ask questions in the chat box or allowed many of you have already found your chat box. I enjoyed chat box here. But chat box. You're also welcome to answer each other's questions to I see some people who have attended these sessions before. So you know that we always are learning together including me, your host we learn different things every single time we do this there's just there's so much to WordPress it's such a powerful tool. And we're going to try some new zoom techniques today. So we're going to start with a poll. It should appear on your screen there it is how much do you already know about WordPress. So we've got 14 people in the room 15 if you include me. So how much do you know. One is hey I know very little about setting up WordPress websites to I have used WordPress in the past but like not block themes. Three is hey I've tried to set up a block theme in the past but like wow I got stuck. That was definitely me when I first started learning about this series. Four is hey I'm somewhat comfortable setting up block themes and five is I am very comfortable setting up a WordPress block theme. And this poll is anonymous so don't worry about like anybody knowing it's you. I just kind of want to see where we are today just because that helps me figure out like how fast or how slow to go in each section. So we've got about 86 people who participated. Let's give it just a couple more more seconds here and we're just going to see where we are today. Are you hearing chirping in the background I'm just curious my cockatiels are having a big day today. They're chatting and honking. That's great. All right. You are just joining us. Oh you can hear them okay. I was going to do this outside but my poor puppy was very very sick this morning so she is outside with my partner instead. Okay. I hope they're not too distracting. Alright I'm going to go ahead and end this poll then just so we can see where people are it looks like the majority of us are pretty new. So I'm ending this now I'm going to share the results you should be able to see them on this screen. All right. Excellent. Okay so those of you who are fours and fives please do help me answer questions in the chat box you may have different skill sets than I do I look forward to learning from you everybody else we're going to get started. We were going to do some breakout rooms and we were going to practice and we were going to broadcast mic and audio. But again I just I don't have a co host today and I want to make sure that this is a good experience for everybody so since I can't monitor both at once as of yet. We'll be skipping that little section today but that's all right so we're going to go ahead and get started so I'm going to stop sharing now to do. Those polls okay. So first off I want to make sure I sent out an email earlier today is your WordPress website ready to go so I'm going to launch that question just so I can see. I've got several answers here yes you set up local before this session that's the way that you can set up WordPress for free. I'm using Shamp, MAMP, a different local environment or hey you've got a WordPress host already that's online or hey not yet like I still need to set up a WordPress website. That was what we were going to do. Let me get the link since we got a couple people who haven't set up yet and that's totally fine. So I'm going to go to do we have these great instructions they live here on my little tester website my adventures in WordPress land website. If you have not set up WordPress hosts yet there are instructions here it talks about how to download local and how to basically set up a free test blog. Yeah so if you want to do that while we're watching our first video today I was going to have a quiet breakout room but again I just want to make sure that everyone is is comfortable and safe. In today's session so if you want to do that during this first video it's about seven minutes long you can definitely make a lot of progress there. Yeah but the yeah so let's see here. Most people have a host or you're using Shamp, MAMP or a different local environment great great great okay cool. So today is interactive so it's an I do we do type thing so I'm going to show you something we're going to start with a video I will show you how to do something step by step. You'll do something step by step if you get stuck you can unmute yourself and ask a question, and we will help you, or you can ask in the chat box. But I do want to let those of you know. If you are using something other than local by flywheel or an online host and you want to attend more than one of these sessions like if you're planning to like really build this website over the course of the six to eight sessions series. Please make sure you want to take and share screenshots or maybe consider switching to local. There's a way that you can share your website just with the learners in this box with local or you can do that pretty easily with an online host. The idea is that it's going to be really interactive and we're going to like look at each other's websites and we're going to try and find out like, you know, what what's working what's not suggestions for change and we're going to just celebrate like the cool stuff that we end up doing. So, cool. All right, so I'm going to end this poll I'm not going to share the results this time just because it doesn't matter. This is just our prep work here. So there's that cool well that worked really well has off excited to try breakout rooms next. So first we are going to watch a quick video choosing and installing your theme. Again use that link that I sent in the chat. While we watch this video this is just some background information on themes and then we will choose and install our own theme as well. So, here we go. Welcome to learn how to ask questions. Let's get to the end. Let's try this again. I trust you very beginning. Very good place to start. To make this big going to press play and then I'm going to mute myself so that the singing birds behind me are not quite so loud. Hi, and welcome to learn WordPress. Today's session is all about themes. Here are the learning objectives for this workshop to differentiate between the four different types of themes to find and evaluate themes to install and update your theme and lastly to access support for your theme. Let's get going. In short, a theme is basically a website template with a certain layout and design. When you use WordPress, your content is completely separated from its presentation. This means that the look and feel of your site can change completely by just using a different theme while your content will remain the same. There are thousands of free themes available in WordPress, but there are also premium themes available outside of the theme repository. Many free versions also offer premium themes from the developer or theme selling site. When you open a theme and click on preview, you will get an idea of what can be achieved if this theme is selected. Please note, the thumbnail of the theme is an example or suggestion and won't look the same when the theme is installed. WordPress and its themes have evolved over time. The Gutenberg block editor introduced the use of blocks to compose posts and pages. With full site editing, the experience and extendability of blocks is now available to all parts of your site. Within full site editing are a collection of features and classic themes can opt in to use some of them. There are four types of themes to take note of. Block themes, classic themes, hybrid themes and universal themes. It might be helpful to mention that block themes and classic themes are most commonly used. A block theme is a theme that uses blocks for all parts of the site including navigation menus, headers, content and footers. These themes allow you to edit and customize all parts of your site. And something important to take note of, the site editor is used to manage theme settings instead of the customizer. Let's look at an example of a block theme and remember these themes are newer and were made for full site editing. Make your way to appearance and click on themes. I have activated a block based theme called 2022. And in the sidebar settings you will notice you have access to the editor. Everything from menus, widgets and everything in the customizer are all integrated into the site editor. In the site editor, you can edit the header and footer template parts directly. You can set up templates and also change the site-wide styles of your site. A classic theme does not use the block editor to manage the site layout beyond posts and pages. These use the customizer, menus and widgets to make changes to theme settings. And since classic themes have been around the longest, there are many more to choose from. Let's take a closer look at an example of a classic theme. When we make our way to appearance and click on themes, you will notice I have activated the 2016 theme. And in the sidebar settings, you will have access to the customizer and more. And when you open the customizer, you will be able to change all your theme settings from year. A hybrid theme is a classic theme that adopts some features of full site editing like the template editor. A hybrid theme such as Excel still uses the customizer to make changes while also being able to create your own custom templates. So let's make our way to posts to see this in action. Open one of your posts and go to the sidebar settings on the right. And here you will be able to create a new template and assign it to which page or post you wish to. So hybrid themes have access to the customizer and the template editor. And lastly, a universal theme is a theme that can be configured completely either way as a block theme or classic theme. In this example, I have installed the universal theme Emulsion and as you will notice, you have access to the customizer as well as the editor. To find more themes, make your way to WordPress.org and click on themes. The WordPress theme directory is the official site to search. You can easily find the right one for your site with advanced search features. Click on feature filter and here you can use filters for layout, subject and specific theme features. This includes finding block themes that support full site editing. As you search through the different themes available, you can click on more info to find out more about the specific theme. And then scroll down so that you can see when it was last updated as well as the ratings. Version updates, active installations and ratings can give a good sense of the overall experience others have had with this theme. To install a new theme, make your way to appearance, click on themes and select add new. Once you find the theme you are looking for, click on install. And once installed, don't forget to click on activate. If you have a theme in the form of a zip file, you can install it manually. Click on add new and then at the top select upload theme and then you can upload it from your computer. If there are updates available, you will be notified in the top menu bar as well as the dashboard menu. You can navigate to the updates page and scroll down. And here you will find a single theme or a list of themes that have updates available. And from this page, you can choose to update individual themes or all at once. And remember to back up your website before making any updates or consider using a child theme. Another option is to make your way to appearance, click on themes and go to the theme that needs to be updated. And at the top you will have the option to select update now. Or click on theme details and at the top you will also be able to update. And lastly, you also have the option to enable auto updates for this specific theme. To delete a theme, select the relevant theme and at the bottom right you will have the option to delete. To get support, make your way to the theme directory, select the relevant theme and scroll down to support. The best way to get help with a theme is by going to the themes related support forum to ask questions over you other tickets. I trust you will find the right theme that meets all your needs. Visit Learn WordPress for more workshops and training material. All right. And now we are going to choose and activate a theme. So we're going to start by heading to your WordPress dashboard. So I am going to completely redesign a blog of mine that is currently on WordPress.com. I think I want to switch to a different host just because I like to play and see all the different ways it makes me a better teacher. So I'm going to be redesigning my birdie blog. This is what it looks like right now. It's not particularly pretty. But you want to head to your dashboard. So that's what I'm going to do first. And we're going to head over to appearance and themes. Then select add new. Now you'll notice this is a little different, right? So the editor no longer has the beta button next to it because it is no longer in beta haha WordPress changes all the time. There's also this button here. So you can select that. And now there are 301 themes that you can choose from. So yeah, we're going to just do that now. You should be able to head to WordPress dashboard. Head to appearance, themes, add new and make sure that you have this block theme selected. So I'm going to mute for just a minute and I'm going to go through and I'm going to thoughtfully choose a theme. Normally what I do is I'm like, Hey, use the 2023 theme. That's the most recent one created by the general community. But I want you to pick your own theme today. And the reason for that is because I mean, there's so many different options. So some themes offer more styles. They offer variations on colors. They offer block patterns. So you really just want to find one that sticks or that really resonates with you today. So I'm going to do this for my bird blog and that way we can definitely work on this together. But just know that we're going to be looking at slightly different screens and that that's okay we're here to help each other today. Let's just take a few minutes, pick a theme, install it and activate it and you're going to see me do this on my screen and I hope that you do the same as well. Give you about two minutes. You're just joining us. We are selecting a theme right now in our WordPress installation. For me personally I'm looking for kind of more of a blog theme, maybe something like this that's really pretty. I love things that are really graphic heavy. Other people may be just making a standard website. There's no wrong way to do this right now. And of course you can always switch themes later. You may notice if you're previewing certain themes that they don't necessarily look the way that they do. Right in here, it's just because we don't have anything on our site yet. That's normal and that's okay. Interesting. I actually really like this one, but that's, I'm going to stick with the one that I picked for right now because I know I can always change it later. Just to give you about 15 more seconds. Install a theme and activate it. When you're ready, write ready in the chat box. Lisa just asked a really good question. She asked, is it better to add content first and pick a theme after. That is one way that you can do that. And if that is your cup of tea, you can definitely join us. I think it's session three or four. But for me, I'm a very visual person and I find that a lot of people like to design their themes first before they start adding content. So that's one of the beautiful things about WordPress is that there's no wrong way to do this. So if I wanted to, I could start making pages and writing posts first, but this series we're going to design our theme first. And that's part of the reason why we're separating this into bigger or like a longer series here is just because it can take some time to really get where you're going here. Because there is some experimentation. Oh, I also like the smart cube one interesting. You know what, I'm going to install this one and activate it instead. I mean, illustrate like what sticks and what doesn't. Now I'm ready. Let me know I've seen two people who have picked a theme. And if you are overwhelmed you've gotten to the bottom of this and you are just not sure to start I always recommend the 2023 theme it's a really good theme to learn on. Lisa just shared a really great opinion if you're working in local just to learn about like how to customize the theme it may be helpful to have a few pages and posts to see how that content will look. I completely agree with you. And we get to the part where we're actually like structuring our website like where all the different elements appear rather than just colors and text that is absolutely something that we will do. Great comment Lisa Jean says that there are too many choices I'm going to go with 2023 that's totally fine. Back and forth. I'm not sure yet. Not sure what I want to use it's a little bit of a thing so let's let's go ahead and get started, pick a theme and activate it you can always take some time to explore different themes later and do the same process. The process for using today will work on any theme. I'm curious about your opinion about the like a paid divi theme, which is a page builder it's super famous it's really popular. It's really powerful so in addition to WordPress core which is what we're working with today there's no additional plugins just themes that come with WordPress standard there are additional page builders out there that can offer additional options and allow you to do different things. So, I don't have any experience with divi I've definitely used like bigger press before and a long time ago I think I used a page builder called beaver builder. But it just kind of depends on what your goals are and I think that if you just want a simple like four page website to start, you probably don't need necessarily a page builder like that but you are always welcome to switch. It's one of the beautiful things about WordPress is that you can always try different things. Lisa says that 2023 is a good thing to learn on to use for live sites. Use it as a starter for several websites with success yeah and that that is one other thing is that if you're just using WordPress core and this this may not be true for everything so, or every single page builder but I have found that certain page builders have slowed down my website. And if your website slows down you have a lot of people who will you know, log on to your page. And if it doesn't load within two seconds like something like 60% leave for a different website so it's just something to consider. All right, once we're here we are going to click on editor here if you see customized or you have probably installed a classic theme we really really really want to make sure we're using a block theme because we want to be able to edit all of our sites look and feel. So now we're going to click into our editor. I'm going to make sure that following myself so now we're going to make it pretty so we're not going to focus on the structure of our site. But we're going to use something known as the style book so you're going to be looking at something that looks a little bit like this so you can see. I've got this page over here. It's pretty. I like the blue I like the white but it's pretty simple like I want to I want to stylize it to my own preferences here. And we're going to do something known as using the style book so we're going to watch a quick video here. And you're going to learn how you can style any block theme whether you stick with your first one or move on to another one. Really quickly, even without any content on your website yet. So, yeah, this is all about the look and feel so don't worry too much about like if you want your logo on the right side of the left side or if you want your social media icons to be somewhere else like that's going to be a later session It's just about our color palette and our fonts because that's, you know, the beginning of your brand how people recognize you how they trust you what resonates with them. So here we go I'm going to make this size one of WordPress 6.2 most exciting new features is called the style book. The style book creates a visual representation of all the styles that will automatically be applied across your website saving you time and letting you design and actually see the changes you make all from one dashboard from colors to fonts to button sizes. This preview gives you a strong idea from the start of a website about what your new block theme will look like. The end of this tutorial you will be able to use the WordPress style book to customize your block theme. Let's find out how. Imagine you are creating a new website using the block theme 2023 to find its style book from your dashboard, hover your mouse over the appearance navigation link in the left hand sidebar and select editor. Then click on the site editor to the right, like the styles icon in the top right hand corner, then select the icon that appears. This is your block themes personal style book. From here you can see how the stylistic changes you make will affect the appearance of your website. Depending on your block themes options you can make sweeping changes to your fonts, change your background color and in some things change your layout options. This WordPress style book provides five tabs, text, media, design, widgets, and theme so that you can quickly see the changes you make take effect. All without having any content on your site yet. Any future content I write or any existing content on my website that uses these styles will have this style applied to it. The style book also allows me to add individual styles onto specific blocks. For example, say I am a writer and will often use the quote block on this website. I would like to customize just this one block because I would always like my quotes to use a certain font and stand out from the rest of the text. I navigate to the quote block by clicking it on my screen. This takes me to the quote block. From here I can make changes to the font that only affect this quote block. I select a font that I'd like to use for my future or existing quotes and I make it a little larger so that it will stand out. Finally, I make it italic. Now my quote block will always stand out the way that I've just styled it even if I make sweeping changes to the rest of the text on my website. Here's a pro tip. To avoid a theme design headache in the future, I recommend that you stylize individual blocks sparingly. It's important to note that if you make individual changes block by block, changes that you intend to make globally to the rest of your website will not affect this particular block. Notice how I changed the font globally under general styles text. Did you notice that the quote block I just styled did not change? Let's say you find and install a cool new font that you'd like to use everywhere on your website. If you styled every single text block individually, when you make what you hope will be a big change site-wide to all the text, your individually styled text blocks will not change. You'll need to style them again. To reset a single block style back to the defaults, I can head back to the block's individual style settings either by clicking on it again or by navigating to it in the Styles panel on the right by clicking blocks, then searching for quote. If I reset this block to the default font, that tells WordPress to use the font that I set in the site-wide global styles you see when you first enter this global styles icon. Now that will allow me to style my website's fonts quotes and all in one place. The changes I will make globally to my text site-wide rather than just in this individual quote block mean that if I change my font, it will now also apply to this individual block. With thoughtful design, I can get started working on my new website from scratch or I can give my existing content a brand new look with a few clicks of a button. The style book also allows me to double-check my website for accessibility. For example, I noticed that the calendar widget on this theme is not accessible with the color scheme that I picked. The contrast is not high enough, so for the specific instance, I customize this block to my liking and now anyone who requires a strong color contrast will be able to read this calendar. Now, you know how to use the WordPress style book with your block theme. Right, so we should all now be in our editor here. To get started styling, you're going to go ahead and click into this, just over on the right, and you'll be greeted with a get started button if this is the first time that you're here. And so to find the style book and I know it can be really tempting to just start like making changes right here. We're going to do that at a later point. But for anything that you want to style, you're going to head over here to your styles. So these allow you to design in one spot and be able to, so that way any future writing that you do on a post or a page, any work that you do on the structure of your website will automatically be applied. So our style book can be found here, but before we head that way, your theme may have something known as styles. If you click on browse styles and not all themes have this but this one does that was lucky. It allows you to pick certain theme color choices that maybe will get you closer to your overall look and feel of what you want it to look like. So this is just one of those things some block themes have them other themes do not. So yeah, so I'm going to start with, I really like to not sure it's as professional as I need it to be but that's okay like for what I have in my mind so I'm going to pick one here in my styles and you're welcome to do that. But our goal of today's session here is really in this style book so you're going to click this I and you're going to be able to see a lot of what this looks like so you can see all of my text here. So media, all of this stuff. It's really important if you do select a style to check your media specifically some of the styles that you see in, where was it. So the styles that you see here may put some overlays onto your pictures. So like if I select purple, for example, and I click on media, you might see some purple overlays so that's something that can happen. So from here, I highly recommend just starting in your style book, and I'm going to go through the steps one more time just in case because I know we move kind of fast here, but I want you to just start playing with your colors. What do you want your overall background color to be do you want it to be, you know, a dark one with, you know, maybe some light text. Do you want to adjust the size of your text over here. So there's a lot that you can do and a lot that you can explore here. So I highly recommend doing that. But yeah so just to, to review where we were and again, go ahead and just start playing with a start to get a feel for what your your theme can do. But as somebody asked earlier, I think it was Lisa was like hey is what I'm doing here if I switch. If I switch to a different theme is this going to transfer over and the short answer to that is no not right now. There are like we'll get into the specifics of what changes and what doesn't. But right now we're just styling our theme for the look and feel and the goal of our session is to get all of this looking just the way that we would like. And Jean we will absolutely get to installing a font so let me let me get back here. And I will post the recording of this class on wordpress.tv at the link that I shared initially, I will also see if I can post it in meetup as well, but we'll go through that as well so let me show you so I styled this so that there's this is really this really pretty purple color let me switch themes to show you kind of how this changes. So if you're following along you're a little bit behind you're going to head to your appearance themes. You added a new block theme of your choice and installed and activated it. And once you have a theme that you like so I'm going to switch over here to activate this. So now I've activated a new theme. You're going to select the editor button. So as you can see the choices that I made that did not switch themes. And it looks like it added some additional content as well which is fine and I'm going to work with it. But once you're in this editor. Click styles. And you'll notice I don't have the ability to select a different style here so I'm going to have to do this block by block depending on what I would like. And then you're going to click this icon here. And you're just going to work on the overall look and feel of your website. So Lisa asked hey I was surprised at the color of the social media icons didn't seem to change to the purple color. As you're playing with yours if you're curious about that answer I'm going to show that now otherwise keep playing with your style book I'm going to head back to my other theme. And what you'll notice here is that the colors that I selected before I go into editor. Oh look I did not say I don't think I saved. Make sure that you save. What's up. I'm going to I'm going to work on this really quick I'm going to pick a different style here. So Lisa's asking hey like why, why are these social media icons not changing. Because it looks like they should right so let's actually take a peek at that. Let's see what we can find out so this some working in the header here. So my first thought was maybe they were using images rather than site icons here, but I think what's actually happening is in the design itself so I'm going to see if I can find where those social media icons are I'm not sure if it's in here or not I'm going to double check. My social icons are there. I'm going to click on and see what I can do with this so I can change a color here let's let's select a color here. Oh those aren't changing fascinating I'm not actually sure why that is stick around at the end and see if we can we can figure it out. This could be that in the setting since there's, there's multiple ways to do things and we're trying to walk you through the most straight through like straightforward way to do this. It could be that there is something in the settings that has been selected here and what we'll get to more of this advanced stuff soon, but I'm wondering if. Oh, it didn't change interesting I wonder if we found a bug. We learned different things every time. So Pam you're saying your social media icons are not changing either a synating okay so because these icon color should be like that let me save this really quick I'm going to look at it from the front end. Just gonna look at what it looks like. I'm not changing but it is changing on hover interesting I wonder if there's something hard coded into this theme, having the same issue with changing the colors text interesting what the mom. Oh, okay, I'm going to click my edit site button this is another way to get into this. Pamela what do you know the name of the theme that you chose like to take a peek at that. See this is where I need breakout rooms Oh I would love to troubleshoot this. Just curious so to find the theme name appearance and themes. And I will have a co co host going forward so those people who are you know going through the instructions and. And by the way thank you so much Steve for writing down those instructions I will make sure that I have that for next time as well. Let's see FSC let's let's see what that looks like. Auckland FSC. Let's try this one. Nope. I'm going to install this. And we're going to see if we can see what's going on here. Thank you for your patience. We're going to explore this for about four minutes and then we're going to move on to some fonts. Just for the for the sake of time and then I think I may add some like troubleshooting, like an actual a block of troubleshooting time as well in our next session as well so I'm going to edit this alright so now I'm heading to my editor. I think this is the one that Pamela was using let's take a peek. So you're saying that the text color is not changing. Oh I see what you're saying okay. Okay let me actually look at this in the style book and make sure that it's working in the style book. So it looks like the headings are changing. The text isn't I wonder. Okay so what I'm doing right now is I'm trying to troubleshoot where this is coming from so what I think has happened here is that the theme author who created this theme may have individually styled this theme so I'm going to look I'm going to click on it here so you can see that this is heading so it's not changing. I'm going to click on colors here. Oh that's not there either why is that not changing. So you can definitely change the colors there block by block, but you can also press this clear button. Okay so let me actually look at the paragraph so one thing that is really important to know is that some individual theme blocks affect other theme blocks. Like my suspicion is that the theme author said hey I want the text color to always be black. And there it is so that is why those colors aren't changing to clear it. You should be able to select it and there should be a clear button where's that clear button. Okay. So I think what we're learning together today is that certain. And you'll notice that other blocks are changing as well so as I changed this from black to read the paragraph text was changing so was the quote, but other ones are not so you may have to click through block by block to find that out. It looks like the theme default automatically has that so for some of these in certain block themes depending on the way that the theme author created it you may have to go block by block to do that. If you are an advanced user. It's probably set in the theme.json file so that's some coding that you that you could use to either turn that option off or on. So I have to do that the biggest thing is that block themes allow you to dig into them and figure out like hey where are things changing where are they not. So that was a really good question. So that tells me that in my last theme. The social media icons may have been used in a different block so sometimes you may have to click block by block and check out the colors there to see that. These are sometimes known as bugs they are sometimes known as features just kind of depends on what the theme author intended, but now we've learned a little bit. Cool. Alright, I'm really glad that we looked through that. And the more that you play with this and the more that you explore and the more you explore with us together. The more we will we will discover things like that. So, again, next time we will have breakout rooms specifically to troubleshoot some issues like that. Thank you for that question. But let's move on to some fonts so you may be in your theme right now. Maybe you are in your typography section. And if you click font you might notice okay my font or my themes come with some pre defined fonts here. So this one comes with four different fonts. You're probably going to have to change the individual paragraph text I think this was set by the theme author. That's why that's not changing but other ones are right. If we want to, we probably want to have different themes now you may have dozens of fonts here you may only have one or two. And that depends on both your theme and the actual style itself so if I head back out of here. I click on my styles button is there. Now there isn't one of this one. I have here that like browse styles buttons sometimes the fonts change based on that so that's just something to know. But there is a very quick way that you can manage your own theme fonts. This is another thing that will not transfer theme to theme so just keep that in mind this is practice today like really getting that style book to look a certain way. It does take time and that's part of why we've broken this up into multiple sessions here. So let's go manage our themes. So one way that you can do this is by going and we're going to install our first plugin today. So plugins are an advanced feature. Do know that you don't want to just start installing plugins right away like it could be really tempting but some not all plugins play well together. So we're going to install a plugin that I know works really well. And it is created by the general WordPress or community, and that plugin is create rock theme. And I'm going to write these instructions in the chat, so that you can follow along as well. So you'll notice this is by WordPress org this is created by the community, you're going to install it. Activate it once it's done. So one managing once one go to plugins to click add new three search for create block theme for install the thing is the plugin of the theme. And five activate plugin. So this does more than just install fonts. That's okay. This just allows us to literally install plugin or not plugins fonts directly to our chosen theme. And that's a really good feature because there are other plugins that are just font specific they allow you to select from sometimes hundreds of different themes but they can't like having lots and lots of different fonts can actually slow down your website. So it's a best practice to just have probably one or two we're going to talk about some best practices here as we wrap up. But you'll notice now if I hover over appearance. I now have a magical button that says manage theme fonts. So you can see here that these are the themes that are not the themes these are the fonts that exist in my theme right now. If you don't like them you're like, I don't want them I don't want to see them ever again you can remove them entirely. But then you have these two options up here. And that is add Google font and add a local font. So I'm going to give everybody a moment here to get to your theme fonts. And remember this isn't going to necessarily transfer this is just practice today you're going to do the styling on your own time in between these sessions as you get your, your style up to look just the way you'd like. Jean was asking how do I add a local font, she had one that she found that was really accessible really really good, probably for, you know, someone who maybe has low vision, someone who has dyslexia. So you can do that by adding a local font here, you would download it to your computer. And you would choose the file, upload it and there it would be. And we'll talk about how to do that in a second. So this is the more advanced version today we're going to stick with just Google fonts today. So I'm going to click on manage theme fonts. And you're going to add a Google font. Okay. So six, add some. Added the instruction into the chat box. So, with Google fonts if you use other plugins, sometimes what they do is they link out to the Google font and they pull them from an outside source, rather than installing them directly into your theme, using this button installs it directly into your theme. And that's a good thing just because there's some data privacy issues that are especially important, which is why we're doing it this way. You know that this is a safe way to do this in a way that keeps everything contained to your theme. Looks like Jean installed a local font excellent, and I have a resource for you at the end. Once you're here and you've clicked add Google font, please type ready, so that I know where you are. So give me a thumbs up, or just a why for yes, whatever works for you. And the other thing I would like you to do is actually go to the Google fonts dashboard. I wasn't actually sure what this was going to look like in here. So you'll notice here you've got a big list. And these are all the fonts that are available for you to install on Google. And that can be kind of a long way to try and think to try and find things right because like you can see it. Up here, but that's not really a great way to browse. So instead, I recommend you go to fonts.google.com. I'm going to make this bigger Holy cow that's small. There we go. Now you should be able to see some stuff. So my recommendation here is you are going to want to choose to fonts. You can use more but for consistency sake I usually recommend you use one font for general text so like long bits of text so paragraphs, quotes, you know stuff people will read for a while. And then I think you want a second font for headings, logos, like short bits of text. And the reason that we're here and we're looking at this Google font is because it's going to allow us to type something right so I'm going to write birds of a feather flock together. This allows you to kind of get your content in your mind here. And it also allows you to search fonts in a very visual way. So to pick your main fonts, the font that your paragraphs are written in. It's generally recommended that you use specifically either serif or sans serif fonts so I'm going to unselect the rest of these and we'll talk about them in a minute. So these are generally more readable right off the bat. And the difference between them. So Sarah fonts are generally a little bit more stylistic so if you look at these fonts you'll notice that like they've got little tails on them. They're a little bit. I don't know a little bit more text bookie. And you can scroll down and find them that way. Sarah fonts tend to be better for an audience that is a little bit more advanced. So if you have like a science based medical type audience. You're writing a textbook, serifs are great. Meanwhile, sans serif tend to have more of a clean look. Notice it's missing a lot of the embellishments on them. These tend to be better for a younger audience. For example, like elementary school students just because it's a little bit easier to their very nice clean lines. So you're going to want to go through these. You can find ones that that work for your brand. And just pick ones that resonate with you. You can always install and remove more later. But yeah, you're going to go through here and this allows you to visualize it. Now you can download it from here or I'm going to pick this a remote one. I can head back to my dashboard here. And I can type in a remote. And now that's the font that I picked. Your. Power. You want to press those. And then just click add Google fonts to your theme. And now that theme font has been added. Okay, and you'll be able to find this now if you head back to your editor. You click through to your style book typography. Let's do our text. As you can see. Now I've got a remote and my some of my text is changing. So let's very quickly. As we wrap up here, let's talk about the other, the other types, right. So you also have other types of font so you've got display fonts handwriting and mono space these are more stylistic. So imagine trying to read an entire page paragraph after paragraph is something like this and be kind of like reading your, you know, your sister's diary or something. So these are better for embellishments. So short headings you can use them in logos you install them the same way. So yeah, that those are kind of the best practices for today. As far as homework goes if you want to go through this slower you want to revisit this you want to look at this a slightly different way. I will get you that in just a second but let's let's talk really quickly about your homework. Okay, because I did so there would be a little bit. You want to start finish styling your site so your colors your font your style book specifically you want to avoid making too many changes to your overall structure. Because next week we're going to do headers and footers and then we're going to start working on individual templates. So what we've done today is there's a course that is in the making this is a beta version so there may still be some typos here. But if you want to go through this slowly like you don't like video learning as much you are welcome to join this course here what we basically did today was we selected and activated a block theme. There's the site editor in the page editor that'll definitely prep you for next time and you styled your site globally so we did that basically these two things here. Another optional thing you can do as you start working on your website is you can plan your websites content. So this is a brainstorming type page that helps helps you really think about content like what your messaging is what your calls to actions are all of that. So if you would like highly recommend checking out this course again it's not entirely done yet but you are definitely welcome to utilize it and we'll probably see you next time. One final question genius in the style book how do you set the size for different headings great question so I am going to head to this here so if you're just in your general style book. I'm getting back there by clicking on styles. I'm clicking this icon. And if I click on typography and click on headings. You should be able to see several options here. So you can say hey I want all of my headings to be a little bit bigger actually I want the default you can select different things here. You can also do them independently here. You will have different options depending on your theme, but I can say hey I want all of my h1 headings these are my post titles my page titles. You can select different things there and you can see that h1 up there is changing. So that is one way that you can do that. But yeah I highly recommend like your your main homework today for next time is to really just get the style book looking the way that you would like and then we're going to start working on our headers and footers and after that we'll start planning our content. Alright, that was a lot today ah this is why we've broken it up I really hope that today went well for you. Is there anything that you need from me before we log off today. Last thing so if you would like to join me again to style your headers and your footers. You are welcome to do that looks like somebody else is doing it at 4pm as well fascinating cool. So you have two time options. The other one will not be interactive I don't think, but if you like the style today. I know it should be in your email, but you're also welcome to do this and as long as I have a co host we will have breakout sessions and that way we can work on things that are of interest to us as well. So thank you so much for your time today, we will see you next time and if you want to, well let me, let me pause this down I'll show you how to find this the end thank you everybody. I'm going to pause the recording then show you how to find this recording in just a minute. Stop recording.