Creating a Front Page for a Block Theme

If you’re using a block theme for the very first time, you may be wondering what the best way is to create a front page — look no further! This brief tutorial will walk you through the basics so you can take your website front page from blog posts to front page!

Learning outcomes

1. Set up and edit a front page for a block theme.

Comprehension questions

1. Should you use the Site Editor to write a front page’s content? Why or why not?
2. What is the first thing you should do when setting a front page for your block theme?
3. Under which “Settings” section in your WordPress dashboard can you find the option to set a front page?

Transcript

Welcome to Creating a Front Page for your Block Theme. I’m Sarah Snow, and this is Learn WordPress. By the end of this quick video, you will learn how to set up a front page on your block theme. Let’s get started.

If you want to create a homepage using a block theme, if you’re like me, it can be really tempting to head into your site editor and start designing your front page right there. Now, that is one way that you can do that, but it will create some problems down the road. For example, it will make switching from a block theme to a different one much harder, and you may lose whatever content you added to your site editor.

In order to protect your homepage content, it’s important to set up your homepage a slightly different way. To start, I’m going to leave my site editor then head back to my WordPress dashboard. I’m going to show you now how to create a front page for your website using a block theme. Before I can set a front page, I need to create that page in the WordPress dashboard. So I’ll head over to Pages add new and create a page called home. I know that I’ll also want to make a blog page. So I’ll make and publish that too. It’s good to know that now is a good time to create any other simple pages you might want. For now please make sure you create at least a page for your homepage and perhaps a blog page if you think that you might ever write blogs for your website.

Now that I have these pages ready to go, I can set my new homepage, head over to the buttons labeled settings, then reading. Here, you’re going to find a setting that is really helpful. Your homepage displays what? Right now it’s set to display your latest posts. However, I want a static homepage. What that means is a static page with basic information that doesn’t change with new blog posts. Here’s an example of what I mean. Now, you may have noticed a small block on this homepage that includes a blog post. Now, one great feature of Full Site Editing is that it allows you to add posts in smaller sections to static pages. Keep in mind that the idea of a static homepage is that the majority of the information on the front page stays put and does not change, even if you write new posts or change your theme. Let’s head back to our Settings Reading dashboard.

In order to set a static homepage, I’m going to select the page that I created home in the field next to home page. For the page where I want my blocks to appear. I’ll select blog next to the field Posts page. Now I’ll save those changes. If I head to my site editor now you’ll see some things have changed. Let’s see what this looks like from the front. Now I have a front page instead of a list of blogs. I haven’t added anything to it yet, but it is in fact a static homepage. To compare. This is what it looked like before a page full of posts. Now, this is what it looks like a static homepage. I can now edit my home page by clicking the button labeled Edit Page. Be careful not to confuse it with Edit Site. That’s the template editor, not the place to write new things.

Now, anything that I add to my home page will appear there in between my site’s header and footer, I can add whatever I’d like here and it will appear on my static front page. I really like to use patterns for this to help inspire and build my homepage. Once I add a pattern, you can see the contents appear between my header and footer on the front end of my site. Now even if I switch themes in order to try something new, my homepage content is protected. It won’t disappear when I switch themes. To learn more about the difference between the page editor and the site editor, I recommend heading to learn.wordpress.org. There, you’ll find some excellent workshops to help you learn even more about WordPress. I hope you create something great, or at least a front page for your blog theme. We’ll see you next time.