 All right, welcome. This is how to confidently migrate from a classic theme to a block theme. Let's take this away. Hi, I'm Sarah Snow. I'm your host today. I'm a Florida resident by weekday traveler by weekend. I'm a former middle school teacher so you will see that come out in kind of the bubbliness of how I do things here. I'm a parrot and a sharp hey mom so you will hear tweeting you will hear barking at some point. Yeah, just so you know I love cooking I love learning languages I love the ocean. And I am a training team contributor slash math scientist sponsored by automatic. Here we go. So, just to set the norms. As I said earlier this meeting will be recorded and available on learn.wordpress.org. So please know the safe, the space is safe for discussion. Add your thoughts, ask questions whether out loud or using the chat box. And also. So if you know the answer or even an answer or you think you might know the answer to a question, feel free to share that in the chat box for sure. We are all learning together today which means me to Catherine taught me a couple of things this morning. Catherine is my wonderful co host who keeps this running smoothly. Always stay patient curious hiccups happen and we will work through them together today I made my live blog go horribly wrong so I have since fixed it. We will talk about how to do that if things go horribly wrong as well. So, let's learn. So, let's talk about if you're in the right place this workshop is right for you if you're familiar with the difference between classic and block themes. If you've never been to the site editor before, or if you've switched themes before even from classic theme to classic theme. That's totally fine. If this doesn't describe you and you're like what is the site editor I've never actually played with the block theme like you are still welcome here. Do know that we have additional resources that we can provide if you are brand new to block themes. This workshop may move a little fast and real time for you, but you can review this later and we can definitely provide resource if you if you're like whoa where do I click what do I do what are you even doing. So do keep that in mind. So by the end of this workshop you are going to be able to make a plan to migrate from a classic to a block theme. You'll be able to anticipate some challenges you'll probably see me working through some of those challenges. So you're going to be on your existing website when switching between themes, and you're going to learn a couple of popular resources to help you design quickly. So let's get started I just like to get a sense of where we are here. I'm just because then I know how fast I can go or how slow I should go so how familiar are you with block themes one is hey I've never done this before ever. So I have experimented a little maybe a lot with block themes, three, one or more of my live websites as a block theme for I use block themes and plugins together, which case who you're a step above me I would say I am at a three. And if you design or build block themes for fun or for work like welcome please share your brilliance. I can't wait. See a lot of threes here perfect some five some to awesome. Alright, okay so a little bit more of an advanced audience today cool alright. And if any point you're like whoa like how do I do that thing if you ask a question in the chat, we can provide some resources on learn WordPress for you. So let's start what is the block theme super fast review block themes are themes that use the site editor formerly known as the full site editor. And these themes give users a lot more control over how a theme looks and feels without using code. So if you've used WordPress a lot in the past, you might know that you need some like additional CSS coding things like that to like, make your logo go from the left side of the screen to the right side of the screen and full site editing is a couple clicks of a button. So yeah that's really exciting. So I'm just I'm curious what interests you about switching to a block theme answer in the chat box there are no wrong answers here. Personally, I really just want a little bit more control over the look and feel of my website now, if you saw my thing earlier you can see I'm not a designer I'm really bad at it so we're going to add a couple more resources in today. But my current classic theme displays in one way and one way only for the most part. So I would like to do something a little different. I see people are saying, I see some people saying that they find that the site editor easier to use. Awesome. Oh, we're moving in the right direction I love that. We want more control over your site yes. See the person wants to get rid of themes out there they're almost slow okay so you want to speed up your site maybe full site editing can help with that. They are really excited about block themes they definitely want to be able to do a little bit more. So that's really good incentive to learn how to do this. Some people are saying that block themes are the future of WordPress because they give more control yeah. Let's see lighten up the site save blocks to use over and over. I love that work smarter not harder. Let's see you have more flexibility, more mobile responsiveness is a really interesting idea. Oh, I love that. So you have tons of templates at your fingertips here and we're going to use some of those today. Awesome. Why do people switch themes just in general. That's that's my next question for you it's not just block themes but like why would a client want to switch from theme to theme. Why have you wanted to switch from themes in the past like what, what are your thoughts so for mine, we're going to be working on a live website of mine. I love which I love, but the reason that I want to switch is just because as much as I love this, this page. I'm finding it now it's a little overwhelming I want more control over my front page like I like a lot of what is on this, but I want to update it so that my front page has different sections, and in a way that gives me more control. So what are some reasons that people switch, not just to block themes with just theming in general. Why do people switch themes. Let's see to rebrand. Yes, I get bored with my theme like all the time. Clients like to rebrand to keep things looking modern. Some classic themes may no longer be supported. So as as themes change as people, you know, move in and out of the WordPress space, they may no longer support classic themes so you definitely want to stay current with all of the cool new features that you know, WordPress offers since it's always changing always evolving always keeping up with tech. So like a good example of that would be mobile themes right so once upon a time 2008. A theme from 2008 that is no longer supported no longer updated probably isn't going to look super great like on a tablet or on a cell phone. So staying current with technology is huge and staying current with trends yeah. A lot of people say the old way is going away I don't know that classic themes will ever fully go away. There are there's a lot to be said about how quickly you can get started the simplicity of it all. And just just no way that hey, I just have to focus on my posts my pages my media that can be really attractive and appealing for sure. So yeah we definitely want to stay current. A good point it helps with security to have a theme that updates fun fact about block themes. Because they use so little is PHP coding they tend to be a lot more secure right out of the box. So that makes it a lot easier to design them that makes it a lot easier to use them and have a lot of confidence there so that's a great answer. Awesome. Let's keep going. So when you change a theme, what content stays. So if I'm looking at my birdie blog here if I change my theme, what's going to stay what's going to go. So this is currently on wordpress.com, we're going to be using a different editor today, but just to orient you a little bit anything that I've ever written in posts will stay if I switch things. And any images that I use will absolutely stay as well. Any pages that I have written stay any comments, just the way that posts media pages comments all of that displays. That's what changes. So that's one thing to keep in mind. I'm going to switch. And Catherine if you can remind me when I go to the site editor to talk about this again that would be awesome because this is a very important point that I want to make about not writing content in the site editor because that's how you lose content. So, your posts stay your pages stay your media files. The idea of changing themes is really about the look, the feel of your site. Someone asked a meet up as a question like hey what's one question you have like what what if all of my posts are written using the classic editor that content stays as well. But you may need to install a plugin for this so the plugin that I use that allows me to access that is the jetpack plugin but you can also just use the what is it the classic block editor I think I like to get at you. Let's try this again. So if you have a lot of content you haven't built it with blocks you're really you know the site is as old as mine as my site was started in 2015 so yeah I use the classic editor a lot. This enables you to keep that classic editor and use it just as a simple block. I don't know what I believe so if I'm I could be wrong. Okay I just want to clarify what what activating that plugin actually does is it disables the block editor entirely. Oh don't do that then. I wouldn't do that with it with the block theme because you'll be okay let me go to one of my. Let me go to one of my old ones. Just view. If a post is written in the classic editor before yeah it'll just automatically get the classic block. And if you click on the that bar that little gray bar, you can even convert it to blocks right there if you want to use blocks on one basis. Yes, someone was just concerned like what would happen to it it doesn't convert unless you do that okay. For some reason I thought you might need to install a plugin for that I guess I'm wrong that's just built in. That's why the people developing WordPress are smarter than I am I love it. So I can convert this to blocks if I want you can see what this looks like there. It's pretty close but now as you can see it's using blocks instead of that classic editor. So that is really just good to know all right we're going to go back really this I'm not going to update that right now. So let's continue. So with this I had to write out my plan because as I updated this for the second thing of this today I realized I was kind of getting caught in the weeds again myself so I decided to make a plan and I recommend this for everybody. So you want to decide do you want to try and emulate the look and feel of an old theme. Do you want to update entirely. So for me, in order to keep it relatively simple we'll we'll see. I'll switch to a block theme but keep a similar look and feel but with added functionality so that my front page isn't just blog post blog post blog post blog post like I want to make sure that I have a little bit more control of that. I'm also going to keep it simple. I have a tendency to try and recreate the wheel. Other designers are much better at it than I am so I'm going to use some patterns today rather than building something from the ground up. And I am going to be using. What is it a new host so you may have noticed. I was. I was over here WordPress.com that was my original host. Today I have migrated most of my themes and said I'm using a new host so you can see birdie blogged up my staging website.com this is a test sandbox that I have set up. Yeah, we'll get there in just a quick second. So, once it's done I'm going to just switch over from WordPress.com to pressable that you can use any WordPress host you would like you can use blue host or go daddy or site ground or WP engine whatever one works for you. You may be tempted to update your live site. I'm going to go right there on your current host if you don't have another test sandbox the way that I do. So if you choose to do that. That is not what I recommend but you can what is the very first thing that you should do before making any enormous changes to your website. And as far as the custom fields question goes I'm going to save that for the end. Yes, everyone is paying backup backup one person suggested a way of handling that but backing up is the way to go. So my original plan for this had been to use a backup plugin so give it WP backups all in one jetpack, and I was going to make a copy of my website and migrate it to a local installation or pressable. And I was going to move that over so that I had a separate place entirely, and I was going to show you the absolute safest way to move to a block theme and this, this is what I advocate for doing is making a copy of your website, moving it somewhere else, and then making the changes there. Because what I was doing was editing birdie blog live over here and it was not pretty and did not go well so. The reason that I bring this up is because it's really important to see that this is not there's not one way to do this and that it's normal to even if you are very familiar with block themes even if you know you teach the stuff for a living or for fun. There are times when things don't go exactly according to plan and that's okay. So just knowing that hey I've got a solid backup I can completely change my website back to the way it looked originally. That's an a plus thing. Step one, always make a backup, maybe make a copy. Let's see. So my new plan, as I said, I'm going to use the second sandbox site today I'm using pressable because it allows me to have multiple different websites under one account which is really really handy. I'm going to leave my live website untouched so every single thing you see me doing isn't going to show up on birdie blog until I'm ready, and when I am ready when I have made that. I am then going to point birdie blog my domain name to the new site when I'm finished tinkering. So that is one way to make sure with utter confidence that your website is 100% ready to go before you make that change. So now we have two step twos. The next thing that we're going to do once I've made my copy is we are going to structure our site and we're going to do that in our site editor so I'm going to start by creating a header template part a footer template part I'm going to skip the sidebar for today, and I'm going to quickly make some templates so I'm going to make my index template my single one for my post page. I'm going to put the pages pages and then one, maybe for categories I think I might skip that step for today, just for the sake of time. So, should put these in a different order. So I'm going to go over here to my sandbox dashboard over here. And I'm going to show you what that looks like to start. So you can see, I have recreated this website. It's not exactly the same. So my content did not move over again, totally normal to have a couple of things maybe not transfer which is why we're not doing it on the live site. But you can really get a sense of what this website looks like using that theme. So now my job is going to be to switch to a block theme. And you're going to see what that looks like what it does to everything to the look and feel of it. I think I'm going to use 2023 today just because my goal is to try and give it the same look and feel. If you wanted to add a block theme if you were trying to do something brand new, if you click on add new there's a new block themes button here which is super helpful. You can definitely scan to look for something that appeals to you something new something pretty. I was very, very tempted to use one that had like a bird on it. I don't know if it's in this list right now. But yeah, there was this one super pretty, but because I don't know it as well I'm going to stick to the general 2023 theme. So I've already added that to my themes here so I'm going to go ahead and I'm going to activate it and it's going to move from a classic to a block theme. It's active. Let's see what this looks like now. All right, this looks quite a bit different. This looks quite a bit different here so you'll see that my live website here hasn't changed because I'm playing in a sandbox. So I'm now going to head to my site editor so I can either press this edit site button. Or I can go to my dashboard and click on editor from appearance here. And that's going to take me to my templates haha. So I always recommend framing your website for second and third. I like to put the top and like I like to put that on and the shoes on and then do everything else so that's what we're going to do today. So I'm going to start by heading to my template parts. Looks like there is already a header and a footer comments post meta. My header currently looks like this which looks absolutely nothing like my birdie dot blog header. Now, earlier today I was like I'm going to try and emulate this and let me tell you that took a long time and did not go as well as I hope so instead of we're going to use a pattern. A little little bit of a cheat code here to use the brainpower the open source you are welcome to use brainpower of other designers. So if you had to WordPress.org and then go to this patterns. There are hundreds of patterns that have been created for you to use on that can get you up and running really really quickly. So I can search for header patterns and look for something of these 50 patterns that exist that closely emulates this right here this this birdie dot blog one right. So I did a little bit of pre thinking, you'll notice there's a heart button for some of these here. If I press that button, that's going to save this provided that I'm logged into my WordPress.org account. And now if I head to favorites. All of my favorite patterns that I have saved with that heart button up here right there. So, um, as far as headers go. I think, let's see which one did I like. This one is speaking to me. So is this one I think I like this one a little bit better. But there's a couple of things I want to do here so what I'm going to do is I'm going to copy this I'm going to make two. I'm going to make two separate headers. Just because I really like this big header but I don't necessarily want it on every single poster page that I create right like I would like something a little different. I would like the header to look more like this so you're going to watch me just kind of do that real quick so what I'm going to do, I'm in my header template part, which you can tell because it says this right up here. I am going to take this group, and I'm going to remove it. It's a little scary right. But now, where did that go. I'm going to copy again I can't remember if it's in my clipboard. I'm going to press control B. And now I have a header and it is already responsive so you can see how that changed here. Now there's some extra stuff in here that I can also just kind of remove if I don't want it. So let's see which group is that I definitely want that. I'm using this tool right here this list view. It's your best friend definitely don't want any of this right now so I'm going to remove this because this is just top of my site. And then at the bottom looks like there's a little bit of spacing there. Don't really want that I'm going to remove that as well. But I think I just want just for my header the header that I want to appear on every page my homepage, my whatever else page, I am going to remove this one. I'm going to go first. And then I'm going to remove that group. And so from here, it looks like they left a space for a logo, I think I'm going to change that to a site title so if I can just about that. Kind of find the transform button here. It really doesn't want me to can I change it here. I'm going to remove this heading. Looks like that box is still there. I'm going to press this button here. And I'm going to look for my site title here. There it is now. I'm just going to save this I'm going to mess with the colors at the end of all this I highly recommend when you're switching from a classic to a block theme and you're rebuilding it to save the making it pretty for the very end, just get that structure. I'm just double checking let's see if the patterns been vetted have they been reviewed like what we refuse the theme so Catherine answer that question yes the patterns that you see over here on these have all been submitted by contributors they have all been approved they have all been reviewed. I just, I want to point out one, one other cool thing which is that the same pattern directory is available within the editor itself. If you go to browse all the plus at the top left. You know the inserting here. Oh, so they're right there. Explore. Yeah. Fascinating. So there's different ways to get it. Yeah. That's cool. That's really cool. Okay. I'm just doing that again. It's doing the thing. I just purchased a new mouse because it keeps doing this stuff to me. All right, let me see if I can fix this. No, it's not gonna. All right, so I am now going to head to my dashboard. So I'm going to do a little bit of template part inception. So there's one header here that should appear on every template that I use just to get it a little bit closer. I'm going to do header. What's going on when you see it get big like that is that I have a magic mouse and my finger slips and sometimes makes it big and I can never quite figure out how to make it solve like I should really work on that but if I head back into it. There we go. Now you can see that header now exists on my front page. So header, large because on my home page I want something slightly different. And there are many ways that you can do this but this is going to be a header template. So one thing that's kind of cool about block themes you can add a header inside of a header so I can choose my existing template part and insert that and start after. Let's see if it's still copied. Oh, it is. I now have that big image here. I'm going to remove this text for right now. Move paragraph. Definitely don't need these buttons here. I'm going to remove buttons and this is a good opportunity to talk about content. So I'm in the site editor right now. It can be really tempting to do things like write my tagline here right so what you need to know about parent ownership. However, if I switch to another theme classic or block. If I just use a paragraph block here, this content anything that I write in the site editor will not transfer over. And that's something that's really important to know about block themes. It's important to try and use. What are they called theme blocks as much as possible so I'm going to write and start after he runs after. This is not as accessible as I wish that it was so I am just going to add a quick filter maybe. So I'm just trying to make it so that everybody can see it. That's very important to me. There we go. Okay. So I'm going to change this picture to a picture of a parrot. But first what I'm going to do is I'm going to use a theme block so I can do that by clicking my site tagline. I'm just going to make it white so everybody can see it and now you can see what you actually need to know about living with parents. Now if I change my theme. I'm not going to be able to that that will move so if another theme does have an already pre programmed tagline in there I'm not going to lose my content there. So I'm just going to center this I'm going to save it and I'm not going to worry about how it looks yet. I'm going to double check in the chat to see where we're how we are where we're doing. Let's see here. I have a question about the premise that the block editor is with a wig what you see is what you get and should match the front end and yeah that's the idea so you asked what if I don't want that I'm not quite sure oh a use case. A list of available colors for a product in a checkbox in the editor. And an unordered list on the front end. I think that would probably be something you would need a plug in for I don't know that that's. Right now there's no forms that I can think of in the editor. And the, I think the point of this the site editor is to give people a better idea of what the things going to look like in the front end one of the biggest complaints of people with in the past has been that you know you're in a completely separate looking space and when you look at your you know you have to preview it look at it in another window or tab and that's something the site editors designed to try and solve and I'm not quite sure about your use case but. Yeah, I think for that use case you probably want to plug in if it exists to do something like that, but let's see what this looks like now on the front end so if I go. I haven't actually changed that. I didn't actually change the main time but still using my old header. So for this template I decide that I want to. Let's try that. I decide that I want to use a different header because right now it's just using the standard page header, I'm going to remove this header oh insert before. And now I am going to pull this header large that I just created. I just changed this image pretty quickly here. And now we can see it on my sample website. So yeah it's very much what you see is what you get so this is getting a little bit closer to what we wanted. I, one thing that Catherine had mentioned earlier was that on my normal website again it hasn't changed was that we've got this sticky header up here yeah she want me to try and make it stick to the top like that. Why not live dangerously let's see. I didn't have the opportunity to test that so what I what I want to do here is I want to head to this template part. And I want I'm going to just edit this header because because I put this header in here this is that template part we have a header template part inside of another header template part. Any change that I make here will also be applied to that header of large that I made. So, according to captain's directions we need it in a group it's already in a group. I'm going to click it. And then do I have the option. So on the right, scroll down in that panel. And do you have Gutenberg 15.1 point one active. Okay, so this is a feature that's going to come out in the next version of good or in the current version of Gutenberg and it'll be in 6.2 so if you want to use it, you do you will need to activate it. It's more of a something coming up. It's a really good point that you make just because something isn't necessarily possible in the current version of WordPress doesn't mean they're not working to make that possible. There's been a lot of requests for sticky sticky headers sticky nav. So, yes. All right so now I'm just going to do the same thing my footer I'm just going to remove it that's super simple. What do I currently have. Let's take a look. It looks like I have updates tags and maybe a translate button I think I would need different plug in for that but let's see. Am I able to access what I saved in here. I don't think so. Okay so that might be a reason to use this WordPress that org slash patterns here I don't think that it automatically translate this is my WordPress that org account. This is my pressable account so I don't know that to are necessarily linked. So let's see what I saved here. These are my favorites. I'm just going to copy this one for right now. And again we're going to edit it at the end. For right now we're going to save this and this is something that I think is interesting with possible that I've noticed is that it didn't get any bigger when I did this so that might be a host thing I did not ever I've never had this problem with local before. So that might be a bug that I need to report but I'm going to refresh it. This is my workaround okay boom I even have a bird footer now. And now if I look at my templates. You can see my homepage here. This is my homepage though is it. Oh I think one thing to know is that some of your templates may have different things so for example right now my homepage is what I think is currently displaying on the front so you can see that got added down here. So I'm going to use some patterns to kind of set up the structure of my site I'm going to do this really fast it is 534 I want to get to the ideas about like adding color and making it pretty and things like that. But now I'm going to take this main group here in between my header and my footer. Move it done done done. Insert this after just really quick. And I'm going to head back to my favorite patterns here. So one of the things that I struggled with was I wasn't quite sure how to get this like image on the right stuff on the left so somebody else may have been able to do that I thought that I saved one of those. But I guess that I did not so I'm going to go over here to posts, which is need to go all patterns let's look at posts here. We're going to just grab a query loop I'm just going to see if I can find something that is similar to that for now. Let's see one though. Okay, all let me look for query loops so the way that your your poster describe the way that your poster displayed are through query loops with the site editor so I spelled it wrong. There's space there. Oh come now. I knew that there was block pattern for this what. Okay. So that's what I'm going to get for not clicking the favor button. So I can definitely look through this to find things that I'd like. So what one concern with this is just that I might grab something that isn't actually using the query loops. Like this to me this effective solutions looks like it might be text rather than photo gallery. Let me try one more thing I found one earlier y'all. Okay, good plans. Let's happen sometimes. Okay, we're getting there getting closer. All right, I am going to grab. Let's try just the word posts maybe. See what happens. There we go. There we go. Beautiful. Okay, so here's one that is really close to that right it's a lot smaller it's a little bit less overwhelming. So I may just I may pick this one to kind of get a similar look and feel here. I'm just to kind of show you how this will go. So now here we are my paragraph I copied it. I pasted it. Beautiful let me double check and make sure that that is a query loop by using my list view here I see some columns columns. Oh no it's media and texts. So this would be a way to do this in a way where I had fixed ones that this I need a query loop here. So I'm going to speed ahead a little bit just because again it does take time to move things over. So the other thing I can do is insert after I am just going to search for a very loop. And for right now just for the sake of showing you this because I don't want this to be an instruction on just how to use the site editor. I'm going to just choose a new query loop. New option here. I'm going to save this for now. I put this in two columns I might be able to do that that might be interesting. Okay. But I do like the way that we have the image on the left text on the right so I'm going to save this for now. And you're just going to go through that template part by template part for everything that you need so my. Do I have a post page. Oh this does not have a single blog alternative. So that sites will use the template single for post page but I think. Oh, it's right there in front of me. So this is how blog posts are showing on my site right now. And you're just going to go through template by template, we can definitely move things around put them into patterns things like that. So I think the key takeaway here is just to know that you can use patterns you can play with these things until you get them, them right. Time is it is 538. I'm going to pause here. Do we have any questions that I should answer at the moment. I don't know if you heard my bird whistling in the background or not. I'm excited to answer those questions. So, once I have the overall structure of my site done I can move this around I can play with it. We definitely have a lot of resources on advanced layouts or whatever again you can use the patterns that are available to you. But once you start to get the structure right. So I'm going to go ahead and show you how to style your site and there are some some kind of gotchas in here that I want to talk about just because I am using a lot of patterns I am using. I have pulled things from out so when it comes to stylizing your site. Generally speaking, you want to use your global styles as much as possible. The beauty of global styles is that you should be able to select a color, a size padding option once and it should be applied to every block. That's in there. So, I'm going to do something here I'm part of the reason I picked 2023 is that it introduced a new option here which is styles and this allows you to change the look and feel of your website with the click of a button. And these are made by designers kind of depends on what you're going for. So you can definitely start out with many block themes, and there will be more and more in the future, where it will change the overall look and feel of a lot of your site. So I'm going to pick. Maybe this one this one feels kind of like parchment paper, but you might have noticed that, for example, this footer, the color down here isn't changing some things are in it. For whatever reason it's still purple. So when you're switching from a classic to a block theme and you are using patterns. You're going to have some sticky stuff here. So knowing where to go to find it super useful. So when it sticks like this there are two places it can be. The first is in the settings for this particular block. So I'm going to use my list view. And I'm going to look at this footer. Now note that if you're using a template part which is indicated by this kind of work what is like a frames type icon here, this is going to apply to every template that uses this footer so if you get confused like I do it can be a good idea to head to template parts and just edit it there, but I know using this list view I'm editing this footer the changes that I make you're going to apply to everything. So now that this has been selected. I generally use my list view to kind of click around. Just because something that might be like on a button may not be an option for something else so like if I'm just randomly clicking you'll notice that like I don't know where that color is. It's this top column here that saying hey this background let's make it purple to make it match so that anytime I make a big global change on my website using this global styles here I need to remove this. So there is a way to do that. I guess I could just make it transparent. That seems odd. There's normally a button here isn't there a button here to remove that. Interesting. Okay, I'm used to there being a button for now I'm going to make it transparent so that anytime I make a change that that will that will happen. I also want my text to. You just click it again. There it goes haha. So click click it's now off see that that block pattern that means it's transparent. I'm going to save this. And now if I go over here and I pick a different style or I change the different colors of my websites. That should change as well so that's the first place where some of these things can be. I'm going to check this button here. I think that this is probably in a setting as well and that's part of the reason that I implore you to make as many changes as you can using global styles. If you want to rebrand quickly. Doing that here makes it so that I click up a button changes that. If you do a lot of settings which is what I did when I first got started, you end up having to change things blocked by individual block. So here this background has been set in the settings. I am just going to turn that off. So I just clicked a button, turned it off and now that will change as well so I've cleared this out as evidence by the circle here. Okay, I'm going to pause double check. I grew okay so far. So this is getting a little bit closer. At some point I'm going to put this type of query loop into two columns here. I haven't put it yet, but I want to talk about one other place where if you're like hey like something about this is sticking and I'm not sure why. Let's take the site title, for example. So here I'm working in my header any change that I make within that template part will be applied globally. I'm going to expand this to find what I'm looking for. I've got some buttons here that I'm going to change. Okay. So this site title. Let's say in my global styles I want all of my headings to be. I want them to be a different fault. So you'll notice that all of my headings up here are changing. Right. That is really exciting. So I'm going to pick a different one you can see the difference there I'm going to save this. If you were to make this change and you would notice something like your site title which is a type of heading hasn't changed the other place to look as you're migrating is in these blocks here so I'm in global styles. I click on blocks. I can look specifically for the site title block. And I can find that there and you'll notice that in many block themes but not all I do have a typography option here. If you're following this tutorial you're over here in your site title you're not seeing a typography button there's probably a setting that's not on in your theme.json so you might have to add some code there. But if you're using 2023. I can say hey, I want my site heading to be something different. I can do that let's say I want to make it. That doesn't look very pretty on mobile. Let's say I want it to be extra bold. I can save that and now anytime I had some like mobile styles here. I can change every other heading to a different font, but you'll notice that isn't changing anymore. And it's because it is set at the block level so that's one gotcha that had me absolutely tearing my hair out so I hope that it helps you to discover this. So and just asked me am I going to save all of these modifications into a child theme that is a fantastic question. So the word for site editor is a little different in that you don't need to make child themes the same way that you did for classic themes. So for those of you who are new to this, if you were to make changes at the code level. If you were to go into the PHP file here and make the change there anytime somebody updated the theme so if they wanted to, for example, add more styles they want to add more features that come out with 6.2 to their theme. So changes would be overwritten, unless you created a separate child theme. The WordPress site editor is different in that if you head to your templates, you'll notice some of these have a little blue dot. This means that this template has been customized by me the person and the changes that I make the selections that I make in the site editor will be copied over so even if they add even more styles here, what I have chosen in the site editor here will be preserved. So these changes are being saved in the database as Catherine wrote in the chat, and the files are not being changed basically I am adding stuff on top of it. So even if the underlying picture changes. These changes stay on top. So it's a really cool feature. As far as block themes go. Great, great question. I love it. I'm going to head back to unless there are any questions about that so far. Are we good so far. I know we've had. And Catherine did mention, there is a create block theme plugin that allows you to save changes as a child theme, but I won't need to do that. So we talked about using primarily global styles, which is this button up here. It looks like a half moon do be aware that was 6.2 coming out in March sometime can't remember the exact date these may change a little bit so just be aware of that if you are watching this recording later or you go in to edit this and 6.2 has been released, and you've updated some things are going to shift a little bit here. So you can use some settings but you definitely want to try to use them sparingly. So for example. I'm going to select this. That was an odd blip I wonder if that was my computer. So for example, in this header, I used a cover block here. These are settings yeah, these are not these are not global styles so these are settings. Let's say that the image that I pick. The media library, and let's pick. I'm seeing some very interesting things with this one. Let's say that the image that I pick is just not particularly accessible you can't read the text here it's not it's not looking great I don't like that. I'm only going to use this cover block here in this heading it's already set I'm never going to have to like really change that again that might be a use case to change these settings so for. Yes, so for example with the site tagline I could go over here. I could say hey I want to make sure that everybody can read this even though Louie is very handsome. And I can make that change there. There's one instance where you might use a setting just knowing hey I'm never going to do this again most likely I don't need to make this. I don't need to allow this change I want to make sure I can always read this text here that might be a good option. Yeah, so that that might be one example the other thing I could do here and again the thing with WordPress is there are so many ways to do the same thing I could also potentially head down to blocks here and look for my tagline. I might be able to style that here so I might be able to change the background. Now you might notice that I came here to my global styles, and this color isn't changing. So that is because whatever you put in settings here goes right on top of what's on on your global styles. So it's just it's really important to know that as you are designing so I'm going to turn this off now. Change this text color so that it is off as well. So if you do want to use your global styles these individual block settings can be really helpful so if I go here and say hey anytime I use a site tagline let's say I want to use it in my footer and end up here. I can select the colors here. Change that background and maybe change that text to another color so that it is readable my text. It's sticking. This is why I'm showing you this right now. So let's find out. Oh but it's not fascinating. I wonder if this is a paragraph thing. So this might be set somewhere else. Let's find out. No I don't know why it's sticking there interesting so when all else fails I can go back to my settings and say hey I'm going to over want to override this. There's my text. Easy peasy. There it is. And then a great question was asked to these patterns that other people have made come with responsiveness built in all blocks are responsive to some degree Catherine is totally right. Since patterns use blocks they should be responsive. It's a good idea to test things out though, especially if you're designing just on your own, just because some things will stack some things will not, but you can kind of see the difference. So this is what this would look like on a probably a mobile phone right whereas if I make it a little wider, maybe on a tablet it might look a little bit more like that. And testing it on different screen sizes WordPress is getting better and better with every new, every new release. So you might find that certain things aren't as responsive or do really strange things. And for example sometimes like the text will rather than be wide, it'll go into like a single column if it gets small enough. There are ways around it but you're going to have to dig around in the settings a little bit. Okay, so I'm going to continue to work on this website and again it does take some time it does take some elbow grease to really get a sense of how this works and why it works. But I don't have to go live on my other website until I am ready. So at some point when this website looks this website looks the way that I really want it to I'm happy with it I've redesigned it I have the control that I want and all the features in there. I can change my name servers so that birdie blog shows this website over here this birdie blog on my staging website.com. And that is the way that I would recommend doing that. So, yeah, let's let's go to the corrupt slide here. We talked about these. So, and because I'm doing this on a separate website, and not just changing my birdie blog website. I can definitely add some plugins and anticipate issues here in a safe spot. Not all plugins are compatible with block things many are racing to catch up to make sure that they are because again they do see this as kind of the future of WordPress. Certain plugins will be used more successfully than others. Oh, and there is not a beautiful sunset that's just my background thank you Laura. So I'm just curious are there any plugins you'd recommend that you've used successfully with block themes. Are there any plugins that you've used unsuccessfully. Just curious. If you've, if you've seen anything like that, seeing any responses yet but that's okay. But I will say that there will be time consuming to move from a classic to a block theme, especially if you have a lot of complex plugins a lot. If you have, as in my case, lots of enormous images that I should have optimized for my website. So there is probably a pretty big opening in the field of migrating themes from a classic to a block theme for different things so if you can really experiment with this really play with this like I feel like this is one way that you could by switching this over so let's see some of the form plugins have not been working so I that's new to me I've not experimented with that I know there were some questions about that earlier. I know that Catherine you said earlier that short codes generally work pretty well because you can use a short code block. So if I'm editing a page, I have a plugin that uses a short code. We just add one underneath this insert after there is a short code and put her so I could definitely write a short code here and it should display properly. And another person. Oh, go ahead. Oh, I was just gonna. Yeah, you're probably answering the question about the mentor. Yeah, I was going to talk about that. Um, so as far as do block themes work with element or so you may be watching this and going hey I didn't see anything that looks like this in my theme I if I go and edit my site here I don't actually see. What is it the customizer parents customizer, you might be seeing something totally different. And if you are seeing something totally different from what you see here or what you saw in this workspace. That's an advertisement that's fine. If you're seeing something totally different you may be using a site builder such as elementary such as Divi beaver builder. And then you can see the lines of a he bakery out there. And I feel like a lot of those really fulfilled the need that that WordPress has needed to fill all this time right they were allowing you to make pages in a more drag and drop sort of way with WordPress. So they don't necessarily work together you may have to migrate from one to another. And they don't really have any branch features that aren't quite in WordPress core yet so there are you know benefits to using some but it's generally not. As far as I'm aware someone correctly if I'm wrong it's generally really hard to use both what you see in the site editor with a page builder the page builder usually those right on top of the site editor and overrides a lot of what it does. So yeah, let's, let's start wrapping up this one I think. Let's participate issues. And from now you're going to policy and financial site it is important to know you may encounter some migration issues. I had some important issues. I had size issues it's just important to know that if you if I wanted to take, you know what I'm doing over here in my staging website and try and move it to my existing host you might have migration issues so I do think that one of the best ways to move from a classic to a block theme is to set up another installation and do that there and then change the name servers so that yeah. So that would be my recommendation. Is it the only way to do it. No, is it a way that I would do it with way more confidence than just heading over to my birdie blog website and just switching over. Yeah, because people do actually come to this website to learn specifically eclectic motorbolts very niche subject only for people who have equies. But yeah so we talked about that. Some of the last thing that I'm going to do I need to change my name servers I need a 301 redirect we're not going into that. I will probably have to migrate my followers because I'm moving from WordPress calm to pressable things I can do. But the key points that I really want you to walk away with today are if you don't do anything else you just want to go go forward and change your website please make sure that you back up your website without a backup earlier today. My website would have been in a state of disarray and it would have been very tragic for me as the site owner. I really recommend practicing with the site editor. Y'all were mostly more advanced users today so if you know this. Definitely check your plugins make sure that they support block themes before you switch test them, and do know that this process can take some time but with the right planning the right effort, the mindset you can switch themes efficiently with with no downtime there. So with our last minute left, are there any final takeaways. Laura is made a great point. The developers have listened to a lot of the comments that have been made by users and they've added a lot of really cool stuff in 6.2. So if you're working with this now, and you get frustrated and you're like hey this isn't working it's not possible to do yet. That is the keyword yet. We're working on it. Alright, for more tutorials online workshops and courses please visit learn.wordpress.org. We really appreciate your time today. Cheers y'all.