eCommerce startup guide 3/3 – Do It Yourself with custom domain, hosting and WordPress theme
In previous articles of the series, we covered the first two crucial steps in launching an online store. We started with selecting the platform and planning the content that a successful webshop must have. Today, we’re tackling other technological aspects: which hosting service to purchase and which ready-made theme to install?
TL;DR: Purchase a domain and DNS zone on AWS, then get Kinsta hosting and implement WordPress, WooCommerce, and the Hello Elementor WP theme with the Rank Math SEO plugin.
Underwater shark-proof cables, mysterious DNS zones, and heaps of HTML/CSS/JS files make up the backbone of every web application. These archaic building blocks, stemming from ARPANET in 1969, still trip up budding online merchants today – especially when they’re going the DIY route.
Fortunately, the WordPress and WooCommerce “stack” has evolved and standardized so much in its 18-year existence that the “do it yourself” part actually boils down to two main technological choices: which hosting service to purchase (2) and which ready-made theme to install (3). We’ve covered everything else, like domain, SEO, content entry, product input and maintenance, customer and order management, eCommerce reporting, and tying digital marketing to eCommerce, in the first two articles of this series, so we won’t dwell too much on those topics.
A hosting server and a ready-made WP theme are long-term companions that, unlike content, you won’t be changing often. We’ll follow the natural course of setting up a WooCommerce store here as well:
- Purchasing a domain and setting up a DNS zone
- Renting a hosting server
- Choosing a ready-made WordPress theme
- Upgrading the installation with plugins
Buying your domain and setting up the DNS zone
A domain is the online address of your online store and likely the first piece of your “brand” puzzle that your user will encounter.
All domains in the world have two main parts: the SLD (Second Level Domain) and the TLD (Top Level Domain). For example, in neuralab.net: “neuralab” is the SLD, and “net” is the TLD. You choose and purchase a domain from one of the thousands of official registrars, and we recommend selecting Amazon Web Services (AWS) and purchasing their Route 53 service.
As for choosing a domain, the TLD itself, like .hr, .com, .net, .biz, .me, is not crucial and won’t significantly impact your business or your SEO rank. There are expert opinions, such as Mario Frančešević (SeekandHit), suggesting that it’s good to have a local domain for a local market. Consider this advice (details in the video below) if you’re opening a webshop exclusively for Croatia.
If you have ambitions to sell internationally, feel free to choose a .com domain or another global TLD. Of course, the choice should be business-sensible, and the domain should be meaningfully connected to your brand. Revisit the second article in the series and consider what kind of domain would be suitable for your company and brand. It’s not unusual for a domain to differ from the brand, but that might complicate promotion and your entire marketing mix.
Croatian domains (.hr) can be purchased from local registrars like Avalon, Croadria, or Plus. You’re also entitled to one free domain with the same name as your company. You can acquire this free domain through CARNet electronically. Old-schoolers might remember the time when registering a .hr domain required a physical visit to Prisavlje or faxing (!) a substantial form.
Once you purchase a domain, which costs around ten dollars a year for a .com version, AWS Route 53 will create a DNS zone for you and allow you to edit it.
A DNS zone is a simple text-based tabular list stored on AWS servers, sometimes referred to as the “internet phonebook” in the IT industry. The primary purpose of the DNS zone is to point the browser to the IP address of the hosting server for the requested page (this is called an A (address) DNS record).
For example, when you want to visit google.com, your browser first asks the DNS zone which server hosts the google.com web application. The DNS zone then responds: “Hey browser, the Google.com server is located at IP address 173.194.36.51, please load the page from that server and display it to the user.” The DNS zone also includes crucial MX (Mail eXchanger) records directing email messages to email servers (Google Suite, Office 365, Zoho Mail…), but discussing that goes beyond the scope of this article.
AWS Route 53 is an excellent choice for several reasons. It’s an extremely affordable yet highly potent system that provides you with an enterprise-grade DNS solution. AWS is a pioneer in cloud services and has developed data centers all around the world. As a result, your DNS zone will be fast and globally dispersed, which impacts page loading speed (which, in turn, affects SEO and the entire user experience).
Renting a hosting server
“Isn’t domain and hosting the same thing?” is a common question among new eCommerce owners. The answer is simple – no. Hosting is the server, a computer that hosts your eCommerce web application. For new readers, a web application is a collection of HTML, JavaScript, CSS, PHP, and other files that must be stored on a constantly available server so that the user can load them in their browser.
In the case of WordPress and WooCommerce, this should be a server with a Linux operating system (which is used on about 2/3 of all global servers). The beauty of WordPress is that its popularity has led to an abundance of specialized hosting companies that will set up and optimize everything for you to ensure WooCommerce works correctly.
Some of the most well-known WP hosting companies are Pantheon, WPX, Kinsta, Liquid, WPEngine, GreenGeeks, SiteGround, etc. Choosing a hosting company can be based on a thousand variables, but there are only three essential ones:
- The hosting company should employ WordPress system administrators and DevOps engineers to help you with specific WordPress issues. This point is critical because you don’t want your system admin to tell you at 2 am on a Saturday, “everything is fine on our end; the problem is in your WP.” You won’t hear such statements from WPEngine, WPX, or Kinsta, and their teams will work with you to troubleshoot problems at any level of your eCommerce application.
- The hosting company should base its servers on Google Cloud and their new C2 VM machines. Google Cloud is a proven top Infrastructure-as-a-Service platform, and their virtual machines provide better loading speeds than AWS or Azure (as you will see in the table below). One of the many reasons is that Google has its global optical network and the first private transatlantic underwater cable called “Dunant.”
- WP performance metrics should be as good as possible, and only a few hosting companies achieve this. The measurements will also show the advantage of Google C2 virtual machines.
Scalable Fun Fact: In the IT world, there’s a false myth that WP or Woo isn’t scalable. For example, WooCommerce’s Achilles heel is the eCommerce database table, which isn’t technically the best solution. However, developers claiming this often forget that scalability mainly depends on servers and less on the choice of application platform (Magento, Woo, Shopify, Presta…). Unlike the number of SKUs or monthly orders, Add To Cart per Minute (ATCM) is a better metric when you want to measure the scalability of an eCommerce system. ATCM is also the recommended scalability metric by WooCommerce documentation. For instance, Chris Lema managed to achieve 2000 ATCMs on WooCommerce WP Engine, which he presented in his “Alec Baldwin ABC” style at the global WooConf in 2016…
In this case, we will refer to the extensive measurement of hosting companies conducted by Matthew Woodward, with one note – we will give preference to two metrics: “WP Execution Time” (milliseconds, less is better) and “Number of Queries per Second” (more is better) because these two metrics best describe the server behavior in non-cached situations, which is a typical eCommerce scenario. In other words, these two parameters will have the most significant impact on maximizing the previously mentioned ATCM.
According to these measurements, it turns out that Kinsta is the champion in Woo hosting for maximizing ATCM, and I can confirm this first-hand. Neuralab typically uses AWS, Kinsta, and WP VIP, and the warm recommendation for your DIY project is to go with the Kinsta team. When purchasing a Kinsta package, you will immediately get the option to install WP and Woo.
Do it, but don’t automatically install the additional suggested plugins because that will come later. The Kinsta interface will give you the IP address of the rented container, which you can now put in the already purchased AWS Route 53 DNS zone. You don’t actually need this entire article if you go with Kinsta because their WP team will set up the entire “stack” if you ask them. Kinsta isn’t cheap, starting packages are around 30 USD per month, but it will save you time and nerves “down the road” because hosting is the main reason why some stingy merchants end up with dark circles under their eyes.
3. Choosing a ready-made WordPress theme
In the WordPress world there is a concept called theme, and technically speaking, they are a set of HTML, CSS, JS and PHP files that give the WordPress website a ready-made look and some functionality. I say some functionality because in the WP world “plugins” should be the ones that give the website a certain functionality (for example, creating and processing forms or automatically filling fields for SEO).
A WordPress theme is therefore designed, fully functional and pre-built WordPress/WooCommerce web application layout. The installation of the theme takes literally 5 minutes and its activation on the WordPress page will completely take care of the appearance of the website itself.
Of course, you can also develop your own extremely fast enterprise-grade WP theme with custom CX/UX/UI (which is what we do at Neuralab), but that is already a project for web designers, frontend engineers and programmers, which is a separate science that we cover across all of our blog posts.
This alone brings us to the main advantage of WP themes – they are practically ready-made, mostly free and standardized, and they also save time for starting an online store. time to market. In short, you won’t need web designers, frontend developers and the entire project of creating a custom WP theme.
With a ready-made WP theme, you cannot “miss” much, but you must be aware of a few moments. Namely, at the last digital breakfast, you could find out the real truth about eCommerce projects – they are full of small wheels, each of which, if not lubricated, can damage the fragile trust of customers (Ivan Vučković, A1, top video). Content, prices, discounts, shipping, payment methods, checkout UX, coupon codes, terms of use, GDPR, SSL, CX, PCI-DSS, A11Y … is your head spinning yet? In this series, we have already talked about the fact that content IS king and that choosing the right eCommerce platform will solve a lot of future problems. But be careful – you waste quality content and using WooCommerce if the WordPress theme is so bad and slow that you lose every third customer!
Matt Mullenweg estimates the value of the WP ecosystem at about 10 billion dollars [Postlight podcast, 03:08] and here we come to one consequential connection – the lack of ready-made themes is that in most cases they are so-called bloated software with a lot of small “things” that you will not need in principle. The author of the topic wants to cover as much market reach and possible usage scenarios as possible, so he improves them with various unnecessary functions. Bloated software has one more serious problem – it increases page loading time. Translated, ready-made themes will always, always be slower than custom (well) built WP themes or bare HTML / CSS / JS. Second, it will be more difficult to maintain later. The third problem is that your website will look like hundreds of others (however, you can overcome this by entering original and creative content, which we wrote about in the second article of the series).
Now the biggest question arises – which ready-made WordPress theme to choose? This opens Pandora’s box. In the 18 years that WordPress has existed, more than 31,000 active themes (!) have come to light, and it is impossible for you to process the entire ecosystem on your own and analyze what each of them offers and how fast it loads.
Also, there are too many variables to choose from, to say the least. Each of them offers some functions, layouts, demos, visualizations, menus, customization options, and importantly for this article – WooCommerce product display options. We will not take all these facts into account directly, but will focus on DIY engineering parameters such as the described loading speed, Google Lighthouse score, GTMetrix and Pingdom metrics.
Namely, these parameters will affect your CX, UX and SEO score in the long term, and in fact they are the only objective fair metrics for comparing topics. Also, in May 2021, Google will release a new version of its SEO ranking algorithm that will take the “Core Web Vitals” metric even more into account. They are respectively:
- TTFB – Time To First Byte – the time that elapses from the user’s click, i.e. the request for a resource, until the first arrival of that resource on the user’s browser. Less is better.
- FCP – First Contentful Paint – the time it takes for the first hints of content to appear on your browser. Less is better.
- MSI – Mobile Speed Index – Google’s page speed index on mobile devices. The time it takes to render all viewable content on mobile devices. Less is better.
- TTI – Time To Interactive – The time it takes for a loaded web page to become fully interactive. Less is better.
- Google PSS – Compiled Page Speed Index, calculated based on the above measured variables. More is better.
We took into account WP themes that meet 4 factors: they are known on the market, have continuous support from their creators, are regularly upgraded to follow the development of the WP system and support WooCommerce functionalities. The shortlist was reduced to 21 WP themes, including the native Woo theme “Storefront”, the well-known “OceanWP” or “Hello Elementor” created by the team that produces one of the most famous page builders in the WP ecosystem – Elementor.
The detailed measurement was done by the Kinsta team, and there is a possibility that the results may vary or that one of the theme producers has released a new (better/worse) version of the same theme. A typical measured installation included WordPress, WooCommerce, imported content from the standard WP Unit Test XML, and an additional 12 different products in addition to the installation of standard WP plugins. You can find more information and settings about the measurement itself on the detailed Kinsta article.
The table above shows that the best Google PSS has Hello Elementor, and that theme also has one of the lowest FCP and TTFB times. Therefore, our recommendation is to build your own WP and Woo using the Hello Elementor theme. You can also try with Orchid, Neve or Generate press (Ocean WP is also a very high-quality and fast theme), but there is no need to worry about it – Hello Elementor supports all native WooCommerce functions, and works well with all the plugins we will need later. You implement the selected topic within the native WordPress admin interface, and the WordPress.org page has hundreds of other official educational videos about managing a WP page and its so-called extensions. plugins.
4. Upgrading the installation with plugins
Speaking of plugins, we will not cover them in detail in this article because Google is full of information and advice about them. Also, the choice of plugins depends on your specific needs, but still, let’s mention three things:
- Do not use heavy / opinionated page builders like Divi or Visual Composer. Even the default WP and its native Gutenberg editor will ensure that you have quite a lot of control over the content, and by using Gutenberg you will ensure the long-term, upgradability and sustainability of the entire WP system. More importantly, you’ll reduce bloat and speed up page loading if you only use Gutenberg. (The recommended Hello Elementor theme, of course, forces the Elementor Page Builder, so leave it inside the installation. But don’t worry… Even with that plugin, the theme is still the fastest according to Kinsta’s measurement. – edited on 1/28)
- For SEO functions, select Rank Math. It will provide you with high-quality filling of all necessary meta fields, good operation of the automated sitemap and control over all 301 redirects (with 404 monitoring), so you really don’t have to look for more than an SEO tool. Yoast SEO is also a popular plugin, but it does not have as strong support for WooCommerce meta fields as Rank Math, and the sitemap generation is more rudimentary than Rank Math. There is an opinion in the WP community that Yoast SEO slows down page loads, but I have not come across a quality independent source that legitimately measures this.
- An additional selection of plugins that I consider to be well made (and that could be useful to you are):
- Search WP to enable advanced searches.
- Facet WP to enable advanced product filtering and sorting options.
- ACF Pro for creating custom fields that you can attach to content, for example, if you want to add a location and folder to a blog post (you will need a developer to implement it).
- Gravity Forms for creating and processing any interactive contact forms or complex forms.
- WP All Import for entering and exporting content and automated “import” processing. This plugin is a crucial companion if you have to import large quantities of products and prices from an external system such as CRM, ERP… it even offers the option of synchronization via Zapier.
And at the very end I will repeat the TL;DR
(1) Lease a domain and DNS zone on AWS, then (2) Kinsta hosting and deploy WordPress and WooCommerce on it (Kinsta will offer these options when picking up the package or their support can do it for you). When you enter WP admin install (3) Hello Elementor WP theme and after that install Rank Math SEO plugin (4). If I lost you in the middle of the article or if you don’t feel like “playing” with all these settings, don’t worry. That’s exactly why there are digital agencies that do all this work (and more) for you. We will discuss cooperation with them in the fourth and last article of the series.
Other articles from this series:
- eCommerce startup guide 1/3 – WooCommerce and democratization of eCommerce
- eCommerce startup guide 2/3 – complete content plan that every web shop needs to have
- eCommerce startup guide 3/3 – Do It Yourself with custom domain, hosting and WordPress theme
- Addendum: eCommerce project – a cost or an investment?