This article demonstrates how to create a simple WordPress site from the very beginning, using wordpress.com for hosting. To skip our explanation of WordPress and go straight into the demo, jump to “Creating a Simple WordPress site from scratch” below. There is also a video version of this demo on our YouTube channel.
What is WordPress?
WordPress itself is a type of tool called a Content Management System (CMS). A CMS is any tool which allows a user to create and manage digital content without having to know how to code. CMSes can be used for a variety of purposes, but WordPress is primarily used for creating websites. In fact, as of late 2025, WordPress is used to build over 43% of the publicly available sites on the internet (according to W3Techs).
There are two arms of WordPress. With WordPress.org, you download the free WordPress software and install it on your own hosting (with a hosting company such as Bluehost or SiteGround). We refer to that as self-hosted WordPress. WordPress.com is the managed, hosted version, created by the WordPress company.
How much does a WordPress site cost to run?
A site creator can spend just about as much or as little as they want to run a WordPress website. But, there are two places where you will always need to spend money: securing a Domain Name, and choosing a website Hosting Service. These are covered in more detail below.
When deciding where to invest more money into your website, some factors include:
- How much administrative work do you want to do yourself, or how much you want to hire out to a person, company, or service
- Will the website need any complex features like eCommerce, calendar events, or others
- Will a free website template (Theme) suffice? Or does your site need a more customized look and feel?
We will demonstrate creating a very simple site below, targeting basic features and frugality as the goal.
What are the Components of a WordPress Website?
In order to create a WordPress website from scratch, here is what you will need:
A Domain Name
Your domain name is the “address” on the internet. Some examples include “google.com” “sdmfoundation.org” and “harvard.edu”. Domains must be purchased from a registered Domain Registrar.
Sometimes a website building service will say “Get a year of domain name free if you sign up through us.” This means they are either a Domain Registrar, or they are handling the administrative overhead of securing the domain for you as part of their service.
A Website Host
Websites need a place to be securely hosted. For WordPress sites, that includes downloading the WordPress software, as well as any custom website code and plugins that have been added. Pricing will vary depending on how much administrative work you as the site creator want to handle yourself.
A note on “Self-Hosting” vs “WordPress Managed Hosting”
Any web hosting provider is tasked with securely and speedily serving up your website every time someone travels to its URL in a browser. With WordPress site hosting, there’s an extra job of downloading the WordPress site software, along with any add-ons (also called plugins) that go with the site. This WordPress software and any plugin software need to be periodically updated to keep the site secure and functioning.
You could opt for a “self-hosted” provider. They will host your site, but won’t help with any of the administrative burden of applying software updates. You as the site owner will have to go to the WordPress admin dashboard (as seen in the demo below), apply updates yourself, and test your site to make sure the updates haven’t broken anything.
The other option is “WordPress Managed Hosting”. This means the site host provider will host your website, and handle the administrative overhead of applying software updates. This is often more costly than self-hosting, and different companies provide different levels of service. Maybe one tier of service applies all software updates for you, but doesn’t let you know if anything on your site broke as a result of an update. Read the fine print carefully!
A Website Theme
A “theme” is the name given for a set of design choices for your website. This includes fonts, colors, layouts, imagery, and more. There are thousands of free themes and plenty more paid options that will simplify the design decisions for your site. This project is using a theme called “Retrospect” (shown later).
WordPress itself also publishes free themes, like “Twenty Twenty Five” (pictured above). See more detailed information about this theme at https://wordpress.com/theme/twentytwentyfive.
A Website Builder
A website builder is a tool that assists someone in the construction of the pages of their website. It enables anyone to add pages, links, images, and other content, all without having to write code.
Different builders come with different features, and some could be great solutions especially for complex, unique websites. There is a risk of building a website with one builder and being unable to change builders without completely re-creating the website. This is why the demo below uses the default WordPress builder (Gutenberg/Block Editor). This keeps this basic site as flexible as possible to future changes.
Creating a simple WordPress site from scratch
Here we will demonstrate how to create a WordPress website using a free theme and wordpress.com as a host. To cover our website components mentioned above:
- Domain Name: We can start with a free domain name that ends in wordpress.com, and add our custom domain later.
- Website Host: $4/mo basic plan (pricing as of May 2026)
- Website Theme: WordPress theme “Retrospect” (free)
- Website Builder: The WordPress default builder, called Gutenberg/Block Editor (free)
The purpose of our demo site will be a landing page for a fictional bakery, “SDM Demo Bakery.” We are not trying to sell any goods or merchandise on this site, we merely want a place to display our address, operating hours, and menu.
Getting started on wordpress.com
Go to wordpress.com and select “Get Started” on the home page to create your account. You can start with the free plan, or opt directly into a paid management plan, depending on whether or not you are ready to commit to this host.
Once you have an account, you can “Create a new site.”
Creating a new site
On the Sites page of your WordPress.com profile, click Add New Site, and select a WordPress.com site
Choosing a Domain Name
If you have already purchased a Domain Name (see explanation above), you can tie your domain into your site. If you want to purchase a domain name on the spot, WordPress will search to make sure it’s unique and available, and then let you purchase through them. You can also get started with a free domain, in the form of: MyUniqueCustomDomainText.wordpress.com. You can change to a custom domain at a later time.
Our URL for this example is SdmDemoSiteForBlog.wordpress.com. (URLs are not case sensitive, the upper case letters are to help the read-ability of the domain name).
Choose a hosting plan
At this point in the flow you will now be asked to choose a hosting plan. You can pay for a plan at this time or just get started for free. For the type of simple website we will be demonstrating, a Personal hosting plan ($4/mo as of time of writing) will cover your needs. Keep in mind that extended features like Ecommerce will require a more expensive plan on WordPress.com, and you may even want to consider a different host provider (self-hosted) depending on the long term needs and vision of the website.
Exploring the admin dashboard
Once the hosting plan is chosen, you will now be taken to the Admin Dashboard for your WordPress site.
On the left side of the dashboard, there are a number of menu options. For the purposes of this demo, we will only explore and explain a subset of these. We welcome all readers to make an appointment with SDM to ask more specific questions!
We are going to start by modifying a few Settings, explaining the difference between a Post and a Page, and finally we’ll dive into the site theme and editor under the Appearance menu.
General Settings
Click on Settings in the left side menu, and this is where we will modify the Site Title and Tagline. We will use Title and Tagline when editing the website, instead of creating a new text field every time. This way, if our bakery name were to change from “SDM Demo Bakery” to “SDM Best Bakery,” we will only have to change the text in one place (Settings) as opposed to searching every page of our site for every time we use the Site Title.
After you modify any settings, make sure you scroll to the bottom and click “Save Changes” before leaving the page!
A note about Posts Vs Pages
WordPress sites are especially accommodating for Blog Posts. What is the difference between a blog post and a regular page on a web site? Web Pages are intended to be static (infrequently changing) information, like the Home, About, or Contact pages of a website. Blog posts, on the other hand, should be short-lived pieces of topical content which enhance the content of your site. Blog posts are a great way help your site’s Search Engine Optimization (SEO). Read more from SDM about What is SEO and Using SEO for your small business.
You will be able to see in the dashboard that there is one Page and one Post created by default when spinning up a WordPress website. While it is possible to edit posts and pages directly through the Admin Dashboard, we are going to do this through the Site Editor, which is described in detail below.
Appearance – Themes and Editor Access
Click on Appearance on the left menu, and you will see two options Themes and Editor
Themes allows us to explore the different options for look-and-feel (see explanation of Themes earlier in this blog), to see which Theme has been applied to your site, and to change the Theme if you wish. A Theme is required to get started, but it is a scaffolding set of choices that can be modified, added to, or changed as needed to make your site look and feel the way you want it to.
The site editor (along with the page builder, which will be covered below) is where we will spend most of our time making actual changes to the site.
The Site Editor
This site editor experience comes along with the Theme you choose. This is a place, in addition to the Dashboard, to edit global settings about your website. When building and editing the details of individual pages, we use the Gutenberg Page Builder (covered in more detail later). On the majority of the screen, there will be a preview of the home page of the website. By default this is a “Blog Home Page” which we will get into more detail about below. On the left side is a menu of options to explore. Each of those options is also covered in more detail below.
The Design Menu
Navigation
This refers to the sets of links that help a user navigate around a website. They are typically shown in a top or side menu of a page. By default, non-blog pages are added to the navigation list. You can manually edit how this looks, but once you overwrite the automatic list, it will no longer automatically add new pages to the list.
Styles
These are global settings for the site that have to do with look and feel, such as font types and sizes or button shapes and colors. Changing global style settings is limited on lower tier plans of WordPress hosting, so we won’t explore this menu for this demonstration.
Pages
These are the various screens of information that make up a website. As we mentioned in the Pages vs Posts section above, pages are typically used as long-living sections of a website. An About page could describe the person or organization that owns the website. A Services page could list services and prices provided by a business. It is possible to put all of a site’s information on a single web page, these are sometimes called Landing Pages. More pages and links are better for Search Engine Optimization (SEO). Separating information can make things easier to navigate for customers, so this demo will create more than one page.
Templates
These are saved layouts for a page. Each theme includes some pre-created templates for things like a Blog page. When you create a page and apply a template, the layout is already configured, and all you have to do is add content. We will show a demonstration later. It’s important to note that editing a template edits every page that template was applied to. You want to make sure in editing your site that you are editing individual pages when needed, and templates only when every page of that type needs a change.
Patterns
These are saved layouts for a sub-section of a page. Like templates, each theme includes some pre-created patterns. For example, Contact Forms, Testimonials, and About sections are all common sub-sections of a page. It’s helpful to have these pre-formatted to look nice with the rest of the website, but they are not the entire content of the page. Headers and footers (the top and bottom of a page) are also patterns. These are a special case. A header and footer will be set on the template level, and will not be touched when editing individual pages.
Adding a Home Page
By default, the home page of our website is a Blog Home Page. This means it is designed to show the latest published blog post in a certain spot on the page. Let’s assume we don’t want our site to utilize this blog function, and instead we will create a more simple Home Page.
If the site theme you have chosen only has a Blog Home Page (which is the case for us) – In the site editor, under the Templates menu, click “Add Template” and select “Front Page.” If a menu appears asking if you want to design from a template, you can select “skip” or close that window.
Now we can start designing a home page from scratch. This will open the Page Builder, which we will cover below.
Using the Gutenberg Page Builder
Also sometimes referred to as the “block editor,” the Gutenberg Page Builder is created by WordPress itself. This is where we get into the details of creating what each template and page will look like, and how the pages look and behave on different screen sizes.
There are many other Page builders that offer free and paid versions, with various additional features and options. One popular option is Elementor. The caveat here is, once you select a page builder like Elementor, you may not be able to easily transfer from one page builder to another. And, in the WordPress Personal plan, it is not an option as it requires a plugin. This is why this demo is using Gutenberg, to keep this site as simple and flexible as possible.
When we begin editing the Front Page Template, the screen is mostly empty. This is a blank Front Page. If you try to preview the website at this point, you will see the image to the left, which says “This page is blank because the template is empty.” with a button that takes you back to the editor.
With the page builder open, let’s add a header and footer.
Adding a Header and Footer from Patterns
Recall that we are editing the Front Page Template. On a Template level, we need to set a Header and Footer. We can find some pre-formatted headers and footers among the Patterns. You can find these by either searching all the blocks for the term “header” or by navigating through the patterns menu.
Notice that all the headers are pre-populated with the name of the site. This was pulled from the Site Title we set back in the beginning in the Dashboard Settings.
After selecting a header and footer, the Front Page Template has some content visible
Adding a Cover
Let’s add an eye-catching image to the home page, between the header and the footer. We’re going to add a Pattern called a Hero, which is intended to be the first thing a user sees when they drop into a website. When selecting the one you want, it might not drop into the page between the header and footer. There are up and down arrows that allow you to move objects around
This pattern is a great starting place in terms of formatting. Let’s change the image and text to something that makes more sense for a bakery, and edit the buttons to our liking. Clicking the Hero block once will bring up a small floating menu of options at the top of the Hero.
Editing the Pattern
Starting with the image, clicking “Replace” will open up a menu of options for retrieving images. If we were operating a real bakery, I would love to upload an image of our actual shop or pastries. In this demo case, we can explore the Pexels free image library. Searching for “cookies” brings up a long list of relevant images. Click on one image and click the “select” button.
The selected image is automatically applied as the background image for this Hero element. This block type (Cover) applies a translucent dark layer on top of the image to make the text on top more read-able. Now we can edit the text by clicking on each line of text, deleting the example text, and typing our own.
A note: Whether using a free Pexels image, or bringing your own, there is a lot to consider in terms of naming and formatting. For more information, see our post on How to Optimize and Size Images for your Website.
Now let’s edit the buttons. Clicking on each button brings up another floating menu of options.
We will delete the first button by clicking the three dots and select “Delete.” The other button we can edit the text by clicking on the text and typing, and we can change where it links to by clicking the pencil icon next to the current link. By linking to “/menu” we are linking to a “menu” page (that we will create further down).
Adding a New Page
The button on the front page links to /menu, but there is no page there yet, so let’s add a menu page. Click the W in the upper left corner to navigate back to the Site Editor. On the left side menu, select Pages. You’ll see a page called “About” already exists automatically. Click “Add Page” and call it “Menu”.
knowing what template your page is derived from
From this blank new page, let’s look at the Settings menu, the icon for which is on the upper right side of the screen. In here we can see the name of the Template associated with the Menu page is “Pages.”
Let’s go to the Templates menu (where we created the Front Page template earlier) to better understand the page we’re about to edit.
Looking at the template called Pages, we see that it’s formatted to have a footer on the left side of the page, with content in the middle.
When we are editing the page, we only see a blank screen for adding content. When we preview the page later, we’ll see that footer appear.
Edit the page content
Hop back to editing the page. When the page builder opens to a blank page, look for the patterns called “Menu,” select one for the formatting, and begin replacing the example text with the items from our “actual” bakery menu.
To add a new menu item, we can notice that the other menu headers are of type “H3. Hitting Enter/Return on your keyboard after the last line will start a new block. Typing “/” will open up a menu of block types. Select Heading 3 (H3) and it will match the other menu headers. Just typing words without a “/” will type regular paragraph text.
Previewing
As mentioned earlier, we have been editing the content of the page, but when we preview, we’ll see more structure that’s been built into the page template. Preview by clicking on the laptop icon in the upper right of the screen, and then clicking “Preview in new tab”
Below are two screenshots – one while editing (all you see is the Menu), and one while previewing (the side-footer from the Pages template is applied, showing what an actual user of the website would encounter).
Publishing
If you hit “Save Draft” and go back to the site editor, you’ll notice that the site header only says “About” and not “About” and “Menu.” That’s because the new page hasn’t been Published yet and is in a Draft state. Go back into the page builder for the Menu page and click “Publish” in the upper right. Now the Menu page appears in the front page header.
Prefer a Video Tutorial?
Head over to our YouTube channel and watch a step-by-step guide!
Celebrate, iterate, and share
You have a live WordPress website! That is a huge accomplishment. Now you can add, edit, get feedback, and spread the word. Give your site URL to friends, colleagues, and customers to gather feedback. Make sure to view your site on a mobile phone or tablet to double-check how it looks on smaller screens.
This hypothetical bakery could add a page that talks about the staff, or the origin story of the bakery. It could start adding blog posts about things like gluten free baking substitutions. If we wanted to add new features like online ordering, we would have to add a WordPress plugin that handles ecommerce (online shopping) features. In our case, we would need to upgrade to a higher level WordPress plan that allows plugins. Or, we could also consider moving to a self-hosted WordPress option.
A website URL can be linked to from other online presences, like a business Instagram account, a LinkedIn profile, or put into a QR code that shows up on a business card or flyer. To get “organic traffic” through something like a Google search, you might have to add a lot more content and SEO metadata. Even without lots of traffic, the presence of a professional looking website builds trust and credibility for new visitors.
Conclusion
Websites are more and more necessary for a professional business presence. Think about the long term needs of your site when you’re getting started. Are you selling items on the site? Do you want your customers to sign up for a membership? What is your budget and how much time are you willing to put in? This will help determine the best solution for you.
With this article, you are now familiar with just one way to create a simple website hosted on WordPress.com. If you have used this tutorial, or our YouTube video, to create a website, email in and let us know!
For any questions about WordPress websites, or other website builders, make an appointment and we are happy to help discuss ideas.
If you have questions about this post, or our services in general, just call or email. We’re happy to assist you! Feel free to use our contact form to send us a message. Thank you!
