How To Use WordPress Website Builder

You may think it’s really hard to build a WordPress website, and way beyond your skillset. But it doesn’t have to be.

Yes, there’s the complicated way to use WordPress, where you configure your own hosting and write most custom code sections yourself. But did you know it’s easy enough to use WordPress as a website builder?

The hard way of using WordPress is WordPress.org, but we’re going to look at the no-code-needed version. That’s WordPress.com – it has hosting included, plus a visual website editor. (And you can add bits of code if you want to.)

Use the free plan to publish a simple blog or level up with a subscription for $4-$45 per month (paying for one year upfront).

Here’s a quick overview of the steps:

How to Build a Website With WordPress

1. Create an account at www.WordPress.com
2. Choose a domain name
3. Select your WordPress plan (free or paid)
4. Pick a template design
5. Begin editing your website
6. Add your own images
7. Write or upload blog posts
8. Click “Save”
9. Publish!

Now let’s go through these stages in some more detail.

Getting Started with WordPress Website Editor

It’s fast and easy to get started with WordPress, especially if you’re just looking to experiment. You won’t have to pay anything up front or give any credit card details. The free version of WordPress allows you to try Premium features, which gives you a helpful insight into how well you’ll get along with the editor.

You start by choosing a website URL name (known as a domain), which you’ll have to pay for unless you’re happy having “.wordpress.com” at the end of it. Like many popular website builders, though, WordPress offers you the first year of your domain name for free.

You can also skip this step, and you’ll get a randomly generated “.wordpress.com” subdomain related to your username or the website name you chose.

Then you select your plan type. The WordPress wizard asks what your main goals are, and you choose between options like publishing, promoting your business, or selling online.

After you’ve chosen what type of category your website falls into, you’re ready to pick a website theme.

Now, you may have heard the perk of WordPress is huge number of free design options. That’s more true of custom WordPress creations, such as those built with WordPress.org. You can add your own themes with some extra wizardry later down the line, but for now, on the free website builder plan, WordPress offers you a limited selection.

Getting to grips with the finer details of the Editor is more challenging, and takes some getting used to. You’ll need to invest at least a couple of hours tweaking the template design to your preferences. But looking through the design previews gives you an idea of the website looks you can achieve.

For instance, here’s the tablet preview of my chosen template design “Loudness”:

Once you’re happy with the preview, continue through to the WordPress dashboard. Now you’ve made it this far, let’s get stuck into the Editor itself.

How to Navigate the WordPress Website Editor

The WordPress Editor is not intuitive. You’ll get stuck very quickly without some guidance.

Think back to when you first learned your way around your local grocery store. You couldn’t find anything at first, and you kept stopping to ask for help. But now you breeze around in a few minutes because it’s become second nature.

Well, this is going to feel like that.

Editing Sections on Your Page

You should know that WordPress divides your web pages into sections. The name for a section is a “Group”.

The good thing about this is it makes it easy to move an entire Group above or below another Group on your page. For example, you can spend some time editing a row of images of your staff. But then decide you’d like to move it higher up on the page.

Now, you don’t have to move each individual image, because you can simply select the entire Group and move it as one unit.

Using the List View

This is where you need to understand the “List View”. This is the “map” of your page structure.

At first you will hate it, because it seems overly complicated. But then you will quickly see why it’s incredibly useful.

Open and close the List View by clicking the icon with three horizontal lines at the top of the Editor page.

The beauty of the List View is the dropdown arrow function. Nothing makes sense until you use the dropdown arrow function. 

Click an arrow to the left of any word, and it will reveal everything it contains. Click it again and it collapses. Now you can gain a clear overview of how each Group is arranged on your page.

It’s easy to rearrange your page structure from this View. You can drag and drop a Group above or below any other Group to move its placement on the Page.

A Group contains “Blocks”. Next we’ll look at what a “Block” is.

Editing Elements Within Sections

When you want to edit a line of text, a button or an image on your webpage, click on it. A little menu will pop up with editing tools for that particular element. Click the three vertical dots to open up a menu with more editing functions on the right-hand side. The dropdown arrow also opens more editing tools.

For better or for worse, every element (text box, button, image, etc.) is known as a “Block”.

Moving Content Around the Page

WordPress website builder is not as easy to use as Squarespace, where you can click and drag any element like you’re making a scrap book. Instead, WordPress offers a snap-into-place style of moving content that takes some effort to master.

To move a Block, click on it. Then choose one of three options:

1. Open the List View. You’ll see the Block highlighted. Click and drag up or down the list to move it into place.
2. Click the up or down arrow in the floating menu. The Block will shift above or below the Block it’s immediately next to.
3. In the floating menu, to the left of the arrows is an icon made of six dots. Click and drag this into place.

While you’re moving a Block, you’ll see a dark blue line or box appear. This shows you where the Block will land once you release the click.

Adding Content to the Page

When you want to add an image, text box or another page feature, there are a few ways to do this:

• Click “+” symbol in the top left corner.
• Find a section with dotted lines, click it, and then click the plus symbol in the bottom right corner.
• Click anywhere on the page, and select the three vertical dots in the floating menu.

Then you’ll see either a floating menu with a search bar, or a sidebar on the left-hand side. You can simply type in the name of the feature you want to add, or browse through the options if you’re unsure.

If you didn’t get either of those menus, click the black “+” symbol in the top right corner of the new block. Or – as the on-screen prompt reads – simply type the “/” symbol then start typing a word related to your feature. For instance, “/mail” brings up suggested options of “Mailchimp”, “Contact Info”, “Subscribe”, and more.

Adding Blocks is a convenient editing method  – albeit with a bit of a learning curve. It allows you to spontaneously add in a new page feature without planning it in advance. That means your page evolves as you have new ideas, and you’re not limited to a rigid design.

Essential WordPress Website Editor Tips

There’s a lot to take in when you’re learning to use WordPress. So it’s worth remembering these top tips above all else:

1. You have to click the “Save” button

Luckily there are little reminders built in that should stop you from losing work by mistake. However, you should get into the habit of regularly clicking “Save” in the top right corner of the Editor.

This isn’t the case when you’re writing a blog post, though. Once you’ve saved a draft, any changes you make are auto-saved every 15 seconds.

2. Find the Editor under “Appearance” in the left-hand menu of your dashboard

If you close the Editor window by accident or because you need a break, it’s tricky to find again. Go to your WordPress Dashboard, and on the left-hand menu you’ll see a paintbrush icon near the bottom next to the word “Appearance”. If you click it, you’ll see “Editor” pop up under “Appearance”.

Click “Editor” and then click the preview of your website on the right to get back into editing again.

If you’ve started to create more than one site, remember you can switch between them by clicking “Switch site” in the top left corner of the left-hand menu on the main Dashboard page. Just make sure you’re under the “My Sites” tab.

3. Ctrl + Z is “Undo” (or just click the Undo arrow)

I used this constantly when I was first getting to grips with the WordPress.com Editor. If you don’t already know, holding down the Ctrl key and tapping “Z” will reverse the last edit you made. It’s a real life-saver.

If you’re not a fan of keyboard shortcuts, then the arrow pointing left (at the top left of the screen) does the same thing.

2023 Updates to the WordPress.com Website Editor

In March 2023, WordPress hailed the arrival of WordPress 6.2, nicknamed Dolphy. Menu navigation is arguably simplified, but it also means everyone has to get used to the new layout. So if you were used to the old one, then sorry.

But existing tutorials and guides around using WordPress as a website builder mainly center on the older version. Some of WordPress.com’s existing support guides and video tutorials are now out of date. For example, the basic guide “Use the editor” (uploaded in 2022), is based on the older style editor. That means the menu toolbars look slightly different as of 2023.

For instance, one of the initial set-up steps indicates a Settings icon (a cog) which is no longer on the top toolbar.

And you can no longer “add” extra text editing options to the sidebar menu by clicking the “+” symbol, as you used to. Instead, that symbol has been replaced with a “⋮” which lists the options to reset each property back to its default.

Quick Tip: How to Check Whether a WordPress.com Tutorial Video is Old

It can be really hard to tell if the tutorial video you’re watching is old or new. To check the publishing date of a video when you’re on the WordPress website, click the video title that appears overlaid on the media player. It will open a new window.

My browser blocked YouTube from opening up (WordPress probably wants to keep you on their website). But all you need is the Video ID, which is the 11 characters after “v=” in the URL.

Highlight that code. Then go to the URL bar, delete everything in it, and type in “www.youtube.com/watch?v=” then paste the code you just copied. Hit “Enter” and the video you were watching on WordPress.com should now load on YouTube.

You can find the date the video was published in the grey box beneath the video player.

Whew! If all that was just one too many steps too far, you may be wondering if there’s a simpler way to build a website. The answer is: yes. In our review, GoDaddy emerges as one of the quickest ways to put together a solid, decent-looking business website.

With GoDaddy, you won’t have to worry about reading lots more long blog posts about how to edit or add new features. GoDaddy’s editor options are somewhat similar to WordPress, in that you can move sections up and down by clicking arrows. However, the editing tool is much more basic, overall. That means your design options are limited compared with WordPress. But that simplicity could save a lot of headaches if you get started with WordPress but can’t get used to its intricacies.

Should I Build with WordPress?

WordPress is a powerful website host, and a reliable home for millions of websites around the world. But it’s really geared towards publishing new content.

So, if you’re eager to commit to a website that grows over time, with custom features and a thriving news or blog section, then WordPress is a great choice. While it’s possible for beginners to publish a WordPress site, it’s a good idea to have some professional developers on hand. That way you can create specific elements to better structure your webpages and carry out business functions like collecting customer data.

But if you’re only looking for a relatively static digital presence, such as promoting your services as a local business, then WordPress isn’t for you. We’ve put together an easy website builder comparison page with an overview of pros and cons of the leading platforms. Check it out for expert research-backed recommendations that’ll suit your website project best.