 Welcome to how to switch from a classic to a block theme. Before we begin, let's start with the basics. What is a block theme? This is a type of WordPress theme built using blocks. You can edit all parts of a block theme in the site editor, which is a big change from the way classic themes worked in the customizer, where you could only use blocks on posts and pages. If you're not sure which one you have, please see the learn.wordpress.org tutorial on what kind of WordPress theme do I have. By the end of this tutorial, you will be able to list the recommended steps to take to switch from a classic to block theme, predict what changes may occur on your website before switching, change your theme from a classic to a block theme, and locate and utilize additional learning resources to set up your block theme. Why are some people choosing to switch to block themes? While the reasons can be as simple as curiosity, some of the more common ones are that block themes allow you to edit all parts of your website with no coding required. You would not need to know any CSS or PHP, for example, to change where your logo appeared on your website. You can point, click, and then move. No code required. Secondly, switching to a block theme provides website owners with the latest and greatest features to WordPress with every new release. For example, with the 6.2 release, I can now make a sticky header with a few clicks of a button. A classic theme would have needed code to accomplish the same task. Finally, block themes enhance loading performance, which keeps your website running quickly. Whether you are using a classic or a block theme, when you switch from one WordPress theme to another, certain aspects of your website will be affected while others will remain unchanged. What should you expect when you switch from a classic theme to a block theme? I'm going to switch from a classic theme to a block theme on my sample food blog to illustrate some of these changes. Here is what it looked like before when I was using a classic theme. Now, I'll switch. I'll use the 2022 theme, which is a block theme. The first thing to expect is layout and design changing. The most noticeable change will be the visual appearance of your website. Each theme comes with a unique layout, color scheme, typography, and design element that will replace the previous themes look and feel. You'll also notice that CSS modifications and theme exclusive features disappear. Any custom CSS you've applied to the previous theme will go away. In my block theme, notice that my color choice and underline is gone. Additionally, some WordPress themes come with exclusive features like custom page templates, short codes, or widgets. Switching to a new theme may lose these features affecting the way content is displayed on your site. However, you will no longer need code for most of what you'd like to do in a new block theme. You will move from using the customizer to the site editor. Your new block theme will have a completely different set of editing options. Expect to configure the new theme according to your preferences. When you switch to a block theme, far more control is given to you, the user, to make changes to these same elements. Now, what can you expect to stay the same? First, your content stays. Your posts, pages, media files, and comments will be unaffected. However, due to design differences, the way they are displayed might change. For example, in this classic theme, the featured image serves as a header with the title inside it, and a sidebar is included by default. When I switch to a block theme, this featured image from the post will remain, but where it, the title, and the recipe appear on this theme will be different. With a block theme, I will have much more control over how these features appear. I can do things like move my title so it appears under the featured image, add a post date, and more. Let's look at what this looks like on the front end. Next, your user data will remain the same. Your users, their roles, and their profiles and what they can do will remain unchanged. Next, let's talk about menus, plugins, and widgets. You may need to create new menus, but the existing pages and posts which you used before can still be linked to. As for plugins, your installed plugins will stay and remain active, but not all plugins work with block themes, so you definitely want to check this and test it. Plugins that don't work well in block themes usually are any plugin that relies on a widget and doesn't have a short code equivalent. Also, some plugins that work more behind the scenes such as SEO plugins may be unaffected. Former widgets native to WordPress or that utilize a short code that you had on your former website still exist, but you may need to import them and style them in a block theme to an area that you'd like. Please see the tutorial importing widgets for more information. Overall, switching WordPress themes primarily affects the visual appearance and layout of your website. The core content stays intact, but you may need to take some time to reconfigure different elements, and you'll want to double check your plugins to ensure that they continue to function within your WordPress website. Now that you know what to expect, how is it recommended that you get started switching? Before switching from a classic to a block WordPress theme, it's crucial to follow these steps to ensure a smooth transition. Step 1. Back up your website. Create a complete backup of your WordPress website including your database, media files, and theme files. You can use plugins like wp-vivid-backups, duplicator, all-in-one WordPress, or another backup plugin to accomplish this. You will be migrating your website next, so do keep that in mind as you back up your site. Next, migrate your website to a staging environment. When switching from a block theme, it is strongly recommended that you test your new theme in a local or staging environment. Not all plugins work well with block themes, and it can sometimes take some time to set up your website exactly the way you'd like using powerful block themes. This will allow you to identify any issues, make necessary changes, and configure your new block theme without affecting your live website. Do note that it can take some time to migrate a theme from a live server to a test environment, so allow ample time to do this. If you choose not to migrate to a test environment, consider installing and utilizing a maintenance mode plugin so that visitors to your site are not confused by the changes you will soon make to your live website. In my example, I've set up a second website at a new host because I use a few plugins that require an internet connection to work that I would like to test. Now, I'm ready to switch to a block theme. My current host doesn't provide the option to sort themes by block theme, so I've gone to WordPress.org, selected themes, and then block themes. From here, I will choose a block theme and then upload and install it. When you're looking for block themes, you might notice that the term full site editing or FSE for short is used. When block themes were first rolled out with the WordPress 5.9 release, full site editing or FSE was the term that we used. However, the community moved to use the phrase site editing instead, which has replaced the FSE term. If a theme features full site editing, it also means it's a block theme, identical to site editing, so do keep that in mind. I try out a few before settling on my favorite. Most of the time, you'll notice that your customizer has been replaced by the button editor once you've installed and activated a block theme of your choice. Do note that some plugins like I have installed still utilize the customizer, so both buttons may still exist. For example, I have the SEO plugin Yoast installed, which allows me to control some of its features through the customizer. Since these do not impact the front end of my website, this plugin still works. Before you get started working in your editor, it's a good idea to check existing plugin compatibility. Ensure the new block theme is compatible with your site's existing plugins as well as the latest version of WordPress. Research and resolve any potential conflicts before making the switch on your live website. You can see a list of plugins that are likely to work well with your new block theme by going to WordPress.org, selecting plugins, and searching for ones that work with blocks. New plugins compatible with block themes are added and updated all the time, so if you're not sure, you can also head to your plugin support forum to ask for help for the best way forward. Once you've tested out pages, posts, and other content affected by plugins, it's time to stylize your website. Head to editor, then click into your site editor. Then get styling by clicking on the styles icon. In this section, you can fully stylize the look and feel of your website without using any code. This is a very powerful dashboard, and there's a lot you can do. Edit your typography, choose your colors, maybe add some extra spacing, or you even have the option to style individual blocks, all without using any code. For a more in-depth look at how to use this section, please see the tutorial, Style Your Site with Global Styles, or the tutorial, How to Use the WordPress Style Book with Your Block Theme. Once you've styled your site's colors, fonts, and blocks, it's time to start editing templates. I like to start by working on my homepage. In this case, I will edit this theme's existing query loops to show different content. If you're new to block themes, take some time to explore learn.wordpress.org's library of resources, especially ones about templates. Learn about templates, the site editor, or even how to stylize a front page using a block theme. At this point, I've taken the time to stylize my templates and template parts. I've stylized some templates and used others the theme provides right out of the box. The choice is yours to style as much or as little as you'd care for. Once you've completed these steps and are confident that your new theme is ready, you can proceed with the process of switching to your live site. You can do this by switching your domain to point to your new host, use your migration or backup plugin to migrate your entire website from your staging environment to your live website, or work on your live website step by step the same way that you did in your staging website. After switching, be sure to retest your entire site thoroughly to ensure everything is functioning as expected. Now you should have total control over how your website looks and feels with your new block theme. If you're new to block themes, please visit learn.wordpress.org to find additional helpful resources. Search for relevant video tutorials or take our site editing courses such as simple site design. You can find these courses under the courses section under the heading using the site editor. Happy designing!