How to create a WooCommerce store with WordPress.com and build stunning product pages with WooBuilder Blocks

It’s now the era of online shopping, and there’s no turning back.

As Accenture shares in a May 2020 report, ecommerce purchases from new or low-frequency online shoppers are expected to increase by 160% in the future. After all, with physical stores shuttered last year due to the COVID-19 pandemic, many people discovered the convenience of online shopping and have warmed to the idea of making purchases through the web.

In fact, a 2020 survey conducted by Wayflyer, found that over a third of small ecommerce stores surveyed experienced a 100% to 200% increase in web traffic. Not only that: 77% of stores that experienced a 100% traffic increase also more than doubled their annual revenue.

In light of this, it’s no wonder that more people are looking to start an online store. Creating and managing an online store has never been easier too, thanks to the wide variety of website builders and ecommerce plugins available nowadays.

That said, too much choice can be paralysing – especially if you’re new to ecommerce, and aren’t sure what solution would be good for not only your business, but also for your customers. Fret not, though, because we’ve got you covered!

We’re going to:

• Discuss some must-haves for every new online store,
• Recommend a secure and highly customisable website builder for creating your store on, and
• Share a fantastic ecommerce plugin that will help you design and implement gorgeous product pages.

By the end of the article, you’ll be well-positioned to build a sleek-looking online store that delivers a pleasant user experience and gets you sales. Let’s dive in!

4 essential things every new online store should cater for

The best time to get the technical backend of your store in order is when you first set it up. So don’t neglect to cater for the following when starting your online store:

1. Mobile-first design

Nowadays, many people are surfing the Web through their mobile phones – which means that you’ll need to consider going mobile-first with your online store design. For example, use responsive web design to ensure that your store looks good on all screen sizes, and try to have your store pages load as fast as possible.

2. User experience

If you’re enjoying yourself as you browse products in a brick-and-mortar store, I bet you’d be willing to spend more time in it. So likewise for your online store – you’ll need to provide your visitors with a pleasant user experience so they stay in your store for longer.

Apart from fast page load speeds, providing a great user experience involves:

• Using a clean and simple store theme.
• Well-organised product categories.
• Product pages with eye-catching images and colours.

From the discovery of your store to the checkout stage, the entire user journey should be seamless and pleasant.

3. Search engine optimisation (SEO)

SEO involves making improvements to your website to help it rank higher for relevant search engine queries. Although it can take some time to produce results, SEO can be an awesome way of getting traffic to your website on autopilot, and well worth the investment.

4. Security

As you’ll be receiving customers’ credit card details when processing their orders, you definitely don’t want such sensitive data to fall into the wrong hands. Implementing strict security measures to keep such data safe and secure is hence a must – as are other measures to pre-emptively identify and patch any potential website vulnerabilities.

Using the WordPress.com Business plan and WooBuilder Blocks plugin for your online store

If the above recommendations for new online stores sound intimidating, don’t worry. The best website builder platforms can take care of most of these for you, so you can focus on running your store rather than getting lost in the technical backend work.

One such website builder platform is WordPress.com, which is a managed hosting solution that lets you host and run your website in one place. You don’t need to download any website software, manage a hosting server or pay for hosting separately – simply create an account and pick the most suitable pricing plan for your needs.

A quick note, though: “WordPress.com” isn’t the same as “WordPress.org”. The latter is what people are usually referring to when they say “WordPress”, and it’s an open-source software used as the operating system for a website, which you’ll have to host yourself. Don’t get the two mixed up!

If you’ve done some research in this area, you may already know that WordPress.com is often used for blogs. But did you know that WordPress.com can also be used to run an online store?

This is done through installing WooCommerce, an awesome free WordPress.com ecommerce plugin. WooCommerce is built and maintained by the same folks who run WordPress.com, so you can bet that it’s optimised for WordPress.com websites.

To install plugins on WordPress.com websites, though, you’re going to need at least the Business plan or higher. This plan includes many essential features that online store owners will need, such as:

• Premium website themes designed to be responsive and provide a smooth user experience. As mentioned, you’ll also be able to install plugins (such as WooBuilder Blocks) to add extra features to your website.
• Massive 200GB file storage for you to upload all the media you’ll need to showcase your products. With the Business plan, you’ll also get free use of VideoPress, which will host your videos with no caps on bandwidth or video plays. These videos won’t count towards your storage limit either!
• SEO tools to customise your store pages’ titles and meta descriptions for higher rankings in the search engine results pages.
• Email support in case you run into technical issues. As shared earlier, WooCommerce is owned by the same company that runs WordPress.com. Therefore, you’ll be able to get support for not just your WordPress.com website, but also for your WooCommerce plugin.
• Security measures, such as firewalls and encryption, to keep your website safe from security threats. Your WordPress.com website will also be automatically backed up every 24 hours in case you need to revert your website to a previous version.

How can WooBuilder Blocks enhance your WordPress.com store?

The number one rule of ecommerce is to display your products in the best possible way so that your store can rake in as many sales as possible. To this end, you’ll need to design high-quality product pages that will:

• Improve your ecommerce product page SEO to bring searchers to your store – such as by including keyword-rich content in your pages.
• Create a better user experience so that store visitors enjoy browsing your store (and hopefully spend more money with you).

However, the regular WooCommerce store layout looks pretty generic. There’s only so much you can do to customise it, which can hamper your ability to create an online store that stands out.

This is where the WooBuilder Blocks plugin comes in. With it, you’ll be able to:

• Customise your product pages: Easily create your envisioned product page layouts using blocks. There is a wide variety of blocks to choose from, from images to product descriptions, reviews and more. Adding them to your product page also takes only a few clicks – no coding or design skills needed.
• Create product templates: Design the preferred look for your product pages, then save it as a template for reusing store-wide or for only certain products. This is a massive time saver.
• Conduct A/B split tests of your product pages: Build and test different versions of your product pages, then roll out the version that nets you the most orders.

How to start an online store using the WordPress.com Business plan and WooBuilder Blocks plugin

1. Sign up for a WordPress.com account

Go to WordPress.com and create a free account.

You’ll then be asked to fill in the name of your website, followed by its domain name.

2. Choose a website theme and pick a pricing plan

After that, decide on a theme for your website. As you’ll be starting an online store, your theme should be designed for ecommerce. For example, look for a theme that comes with photo galleries and drop-down menus for easy navigation of product categories.

Then, go through the next few (optional) steps for selecting your website’s font pairing and features. Based on the features you’ve chosen, WordPress.com will recommend an appropriate pricing plan for you – be it the Business plan or a different one. Decide on your pricing plan to complete the basic website setup.

3. Install the WooCommerce plugin

Next, add the WooCommerce plugin to turn your website into an online store.

Navigate to “Plugins” in the left sidebar of your WordPress.com dashboard, followed by “Add New”. Search for the plugin called “WooCommerce”, then install and activate it.

Configure your WooCommerce settings to start setting up your online store. To customise your product pages, however, you’ll need the WooBuilder Blocks plugin – which is what you’ll install next!

4. Add the WooBuilder Blocks plugin to customise your product pages

Head over to this Pootlepress web page to get the WooBuilder Blocks plugin. You can either buy a licence for it right away, or start a 14-day free trial.

(Note: you may come across a plugin called “WooBuilder” in the “Add Plugins” screen in your WordPress.com dashboard. That’s a different and outdated plugin, so don’t use that! Get the latest version of WooBuilder Blocks from the Pootlepress website directly instead.)

Add the WooBuilder Blocks plugin to your website by clicking the “Upload Plugin” button on your WordPress.com website’s “Add Plugins” screen. Activate the plugin, and you can now start designing your product pages to your heart’s content.

For example, you can go for a two-column look such as this one:

Or a three-column product page that uses a solid colour as its background:

Or even have your product image fill the whole background!

Pro tips for using WooBuilder Blocks on WordPress.com websites

Before you get carried away with WooBuilder Blocks, take note of the following pro tips. They’ll help you get the most out of the plugin when designing your product pages:

Be sure that you’re using the Gutenberg editor

“Gutenberg” is the name of the WordPress.com Block Editor, which you’ll use to compose your posts and pages. The editor looks like this:

WooBuilder Blocks works only with Gutenberg, so check that you don’t have the Classic Editor plugin enabled. The following image shows how your editor will look like if you’re using the Classic Editor. You don’t want it to look like this!

Start building your stunning online store today

If you’re launching an online store, it’s important to get the fundamentals right. This includes ensuring that your store looks good on mobile, provides a smooth user experience, is secure and is optimised for search engine traffic. The good news is that when you build your online store using the WordPress.com Business plan, you’ll be well on your way to having everything in order.

You can then turn your attention to finding the best way of displaying your products to delight your visitors – which is where the WooBuilder Blocks plugin comes in. Once you’ve installed it, you’ll be able to create appealing product pages that convert, and an amazing customer experience that your visitors will love.

Excited? Then the first step is to get your free WordPress.com account – and you can sign up here.