How To Create A Business Website In WordPress The Right Way (Using Pre-Built Astra Starter Websites Which Are 1-Click Import)

Business-Website-Main

Want to create a stunning business website in WordPress?

We’ll be using Astra Ready Websites (specifically the Digital Agency theme) for the demo site in this example. These are pre-built websites built in WordPress that are 1-click import using the Astra Starter Sites plugin. All you need to do is choose a business theme, import it, then everything’s already there; you just need to customize the theme and tweak a few things. It makes designing business websites so easy. I’ll still walk you through everything step-by-step.

I’ve seen a lot of posts on how to start a business website where bloggers refer you to bad hosting, complicated WordPress themes, and plugins that slow down your business website. We will be using a solid foundation: SiteGround’s hosting, Astra, Elementor, and Yoast SEO.

A little background; my website gets 3,000 visitors/day, loads in <1s, and generates about $150k in affiliate income each year. I’m obsessed with WordPress design, performance, and helping people build websites the right way from the ground up. This is what I do for a living.

 

1. Purchase Domain & Hosting

SiteGround is who I recommend to get domain and hosting through.

They were rated the #1 host in multiple Facebook polls because their speed, support, features, and reliability are much better than most hosts including Bluehost, GoDaddy, and EIG brands.

You want to make sure you’re setup on a solid infrastructure when starting your business website; choosing the right host is one of the biggest mistakes people make. Don’t listen to all the affiliates telling you to sign up for Bluehost when there are much better options available.

2017-WordPress-Hosting-FB-Poll

Elementor Hosting Recommendations

July 2019 Hosting Recommendation

WordPress-Host-Poll-Aug-2018

2016-WordPress-Hosting-FB-Poll

Favorite Hosting For Elementor

2018 Hosting Recommendations

WordPress Hosting Poll Sept 2018.png

Step 1: Choose A Hosting Plan
SiteGround’s StartUp plan is good if you’re only hosting 1 single business website, otherwise you will need their GrowBig plan for hosting multiple sites. GrowBig also comes with more storage, server resources, and staging. This depends on your individual needs for the website.

SiteGround-Plans

Step 2: Sign Up And Choose A Domain Name
When signing up for a hosting plan, SiteGround will ask you if you already have a domain and give you the option to register a new one. Enter your details and sign up for domain + hosting. Be sure to sign up using the WordPress hosting page as it makes it easier to install WordPress.

Business-Account-Setup

 

2. Install WordPress

After you signed up, you will be taken to SiteGround’s launch wizard.

Select start a new websiteWordPress as your software, and create your WordPress login details. You probably don’t need domain privacy or SG Site Scanner which both cost money.

SiteGround Setup

Complete the setup and you will see a confirmation page.

 

3. Login to Your WordPress Admin Area

SiteGround will send you a confirmation email with your WordPress login details including the admin URL. Use these to login to your WordPress dashboard. Before you start playing around in the dashboard, be sure to follow the next 2 steps for adding SSL and downloading a theme.

Business-Website-Account-Setup

WordPress Login

Yay, you’re here!

Business-WordPress-Dashboard

 

4. Make Your Website Secure With SSL

Adding SSL makes sure all your images and links are HTTPS from the start.

Business-Website-SSL

To add SSL, first go to your SiteGround’s dashboard and go to My Accounts → Go To cPanel. In the Security tab, click Let’s Encrypt SSL, then activate Let’s Encrypt SSL on your domain name.

Business-Website-SSL

Next, in your WordPress dashboard on the left side, head to SG Optimizer → Environment Optimization → Enable HTTPS. SiteGround will ask you if you want them to automatically configure everything for HTTPS, where you’ll click Confirm. You may need to refresh your website and wait a couple minutes, but you should see HTTPS in your domain name. That’s it!

Enable-HTTPS-SG-Optimizer

SG-Optimizer-Force-HTTPS

 

5. Download A Killer Business Theme

Astra’s pre-built websites a great place to get your WordPress business theme.

They are all beautifully designed, mobile responsive, super user-friendly, and load extremely fast. And since they’re pre-built and 1-click import, you can literally have a pre-built business website within minutes. For all these reasons, Astra was also rated highly in Facebook polls.

Astra Themes Facebook Poll

Step 1: Install the Astra Starter Sites plugin in WordPress under Plugins → Add New → search for Astra Starter Sites. Install/activate the plugin, then you will be prompted to activate Astra.

Astra Starter Sites Search

Step 2: Go to Appearance → Astra Starter Sites and choose the Elementor Page Builder which is the most user-friendly, easiest, and fastest page builder for WordPress. Astra also has some additional themes under Beaver Builder, Gutenberg, and Brizy, but use Elementor if you can.

Select Page Builder

Step 3: Find a killer WordPress theme for your business. This tutorial uses the Digital Agency Theme as an example, but there are tons of other themes you can use for your business. Customizing them is nearly identical since we’ll be using Elementor and the WordPress Customizer, so choose a unique theme based on which layout and design you like the most. Themes labeled ‘Free are free, while those labeled ‘Agency’ require a premium Astra account.

Free-Business-Themes

Step 4: Import your business theme by selecting the theme and clicking Import Site. Astra will begin to import the entire pre-built website including all content, plugins, widgets, and WordPress customizer settings required for the theme. When it’s done importing, clear your cache and you will have a beautiful website for you business which you can start customizing.

Import-Business-Theme

Importing-Business-Website

Refresh your business website and it will look exactly like the theme:

Business-Website

Here are video instructions in case you’re lost:

Other Business Themes To Choose From
While I highly using Astra for your WordPress theme, here are a few other (legitimate) places to get a WordPress business theme. I do not recommend Divi (it can load very slow) or most themes on ThemeForest since they often get abandoned and can cause issues down the road.

Free-Business-Themes

 

6. Customize Your Website’s Design Elements

You can customize nearly every part of your business website under Appearance → Astra Options. These settings change ‘sitewide designs’ across your entire website (everything from fonts, colors, logo, header, footer, etc). To change the main content on each page, see step #9.

Astra Options

Thing You Can Do In Astra’s Options

  • Upload logo
  • Upload favicon (16x16px site icon in browser)
  • Change footer layout + copyright area (bottom of site)
  • Change font type, size, weight, line height, paragraph margins
  • Change layout of your navigation menu on desktop and mobile
  • Change layout of pages/posts to fullwidth, sidebar right, etc
  • Change colors (text, theme, link, link hover, header, background)
  • Customize the info shown on the blog (author, publish dates, category)
  • Customize the sidebar on your blog (if you choose to have one) and it’s width

Changing the logo:

Business-Site-Identity-Settings

Customizing fonts:

Customize-Business-Fonts

Changing colors:

Customize-Business-Colors

 

7. Give Your Website A Name

Give your website a name (your business name) under Settings → General.

Business-WordPress-Title

 

8. Research Keywords Around Your Services

Keyword research should always come before creating individual pages.

Let’s say you’re a photographer in Chicago offering many different types of photography services. Using Google Autocomplete, you can see which types of photography services people are searching for (try using the complete the phrase and fill-in-the-blank method). Each type of service should have it’s own page on your website. So if you offer headshot photography, you should create a separate page to better target that keyword. Google is all about relevancy!

Creating a list of phrases and making sure your titles, permalinks, and content revolves around them (keyword-focused content development) is key for SEO.

Google-Autocomplete-Fill-In-The-Blank-1

Google-Autocomplete-Plural-Keywords

Researching each keyword’s competition ensures you aren’t competing with large, authority sites with great content. You don’t want to spend time creating content for a keyword you won’t rank for. There are plenty of keywords in Google Autocomplete; but how many searches do they have? How competitive are they? Will you be able to create better content than whoever’s in the top results? These are questions you should ask when building a keyword list.

Keyword Research Tips

  • Broad keywords = more searches but higher competition
  • Specific (long-tail) keywords = less searches but less competition
  • New websites should usually start by targeting long-tail keywords
  • Each keyword should have it’s own page unless 2 are very similar
  • Don’t rely on just a few keywords to get traffic; find as many as you can!
  • Use tools like Google Autocomplete, MozBar, and Keywords Everywhere

 

9. Create And Design Your Pages

Now that you know your keywords, you can create awesome pages around them.

Go to Pages where you can add, delete, and edit pages. Create the pages you want, then click Edit with Elementor to change the design. Watch the video below to learn about Elementor. Your home, about, services, and contact pages are already pre-built and ready to customize.

Business-Website-Pages

Nearly everything point, click, and edit:

Edit-Business-Homepage

Use Elementor Templates To Customize Your Design
Elementor has different templates for blocks, full pages, and the option to create and save your own templates. If you don’t like certain layouts and designs on your current business website, you can use these to design your own pages. In the blocks section alone, they have templates for contact forms, services, call to actions, service sections, and more. You should be able to find everything you’re looking for in these templates. To add them, click the folder option when editing a page with Elementor (shown below), select your template, then add it to the page.

Add-Elementor-Templates

About Page templates:

Elementor Templates

Testimonial templates:

Testimonials-Elementor-Templates

Team templates:

Team-Elementor-Templates

Hero templates:

Hero-Elementor-Templates

Feature templates:

Features-Elementor-Templates

Client templates:

Clients-Elementor-Templates

 

10. Create Your Services Page

Go to Pages → Services → Edit With Elementor.

The Digital Agency Astra theme already comes with a pre-built services page, but Elementor also has tons of templates (they have full page templates and individual sections/blocks). Between all of Elementor’s templates, there are tons of different designs for building pages.

Business-Website-Services-Page

Service templates:

Services-Elementor-Templates

 

11. Create Your Portfolio Page

The Digital Agency Theme does not come with a pre-built portfolio page, but it’s easy to create with Elementor’s templates. Simply create a page named Portfolio (or whatever you want), then edit with Elementor. Go to Elementor’s templates and view the page and block templates.

Business-Portfolio

Portfolio templates:

Portfolio-Elementor-Templates

If you’re just looking for a simple portfolio, search “gallery” in Elementor’s widgets and select a Basic Gallery or WordPress Gallery, then upload the images you want (ideally the same size).

Add-Elementor-Gallery

 

12. Create Your Contact Page

Go to Pages → Contact → Edit With Elementor.

Customize your contact page like you would any page (with Elementor). To customize the form, go to WPForms and you can select different form fields, confirmation messages, and the email(s) the form is sent to when someone fills it out. To create a more advanced contact form, I recommend either the pro version of WPForms, Gravity Forms, or CF7 Conditional Fields.

Business-Website-Contact-Page

WPForms-Builder

Contact templates:

Elementor-Contact-Templates

 

13. Optimize Pages For Keywords

Many people rely on Yoast’s SEO plugin, but here’s the gist of SEO:

Step 1: Choose A Keyword
As described in step 8, use Google Autocomplete to research keywords around your services. It’s key to find a balance between a keyword’s monthly searches, competition, and profitability.

Step 2: Create Page Around Keywords
Create a separate page for each keyword, unless they’re nearly identical in which case you can target 2 keywords on the same page. Otherwise, they should have their own page or blog post. The page should be as helpful as possible, ideally 1,000+ words and a video is always a bonus.

Step 3: Add Your Keyword In The Right Places
Edit a page (not with Elementor, but the regular WordPress editor) and scroll down to the Yoast SEO section. You can customize how your snippet appears in Google (called yoast SEO title + meta description). You should use your keyword here, but these should also be enticing to click on and follow Yoast’s length bar which should be green for optimal character length.

  • Use keyword in SEO title + meta description
  • Use keyword in page title and a couple times in content
  • Use keyword in permalink (yourwebsite.com/headshot-photgraphy)
  • Aim for at least 1,500+ words with unique, helpful content with multimedia

Do not obsess over getting all green lights in Yoast. Stuffing keywords just to get your lights green is not what good on-page SEO is all about. Enticing headlines, in-depth content, adding a table of contents, unique images, and click-through-rates are some important factors to focus on.

Business-SEO

 

You can do this under Appearance → Menus.

Keep in mind that any pages you wish to add to your navigation menu, they will need to be published under Pages → All Pages → Edit → Publish. To create or edit your navigation menu, simply drag and drop your pages from the left to your navigation menu to the right. A dropdown menu can be created by dragging a page under another page and creating an indent.

Business-Navigation-Menu

To change the design of your menu, go to Astra Options → Header Options.

Business-Primary-Menu

 

15. Setup Your Blog

The Digital Agency theme doesn’t come with a blog automatically, but is very easy.

Step 1: Create a page called “Blog” and a title.

Step 2: Create a post or two in the Posts section. Add a large image to each post.

Step 3: Go to the WordPress Customizer → Homepage Settings → Posts Page, then select “Blog.” Now, all your posts will automatically populate on the new Blog page you created.

Add-Business-Blog

Step 4: Customize your blog’s design in the WordPress Customizer settings and widgets section. You can choose to have a sidebar, add widgets to the sidebar, and choose what you want your single post’s structure to look like (whether to show comments, publish dates, etc).

Add-Sidebar-To-Business-Blog

Step 5: Create a few (broad) categories around main topics you plan on writing about. Further down the line, you can use tags to organize your posts into microtopics, but don’t overdo them.

Business-Blog-Categories

Step 6: use the “post name” permalink structure under Settings → Permalinks.

Permalink-Structure

Here’s what the blog looks like:

Business-Blog-Page

Use An HTML Table Of Contents In Your Blog – my best “secret sauce” to on-page SEO is to create a table of contents when writing longer content. This organizes your content for users and search engines, lets people jump to link and jump to specific sections, and gives you a higher chance of being award jump-to links in Google. See the TOC at the top of this post.

Use Your Blog To Drive Traffic, Links, Shares – my blog has always generated 90%+ of my traffic (because blogs are suppose to be helpful)! Start by creating awesome cornerstone content, which is comprehensive (3,000+ word) content around topics your visitors would find most helpful. Look at some of my tutorials in the sidebar; most those are cornerstone content.

 

16. Customize Your Business Mobile Website

If you’re using an Astra theme, your business website is already mobile responsive.

But if you want to change certain elements on your mobile website, you can do that with Elementor. When editing a page with Elementor, click the responsive mode at the bottom of theediting screen and you can see how the page looks on a phone and tablet. Just like you would edit any page with Elementor, you can do the same for the mobile version of the page.

Customize-Mobile-Business-Site

 

17. Install Essential WordPress Plugins

To get the most out of your business website, you’ll want to install some plugins.

Many people go crazy with plugins, but too many plugins (or just the wrong ones) can really slow down your website or even cause compatibility issues. That’s why it’s so important to only install plugins you absolutely need, and ones that are both lightweight and highly rated.

Here is a list of plugins I have tested extensively which you may want to consider:

  • Anti-Spam – prevents spam comments without using CAPTCHA.
  • Duplicate Page – very helpful for using other pages as templates.
  • Elementor Pro – more functionality including extra Elementor templates.
  • iTheme Security – robust security plugin with 1-click configuration.
  • Redirection – redirects URLs if you changed them during the design.
  • ShortPixel – compresses images to load faster (an item in GTmetrix)
  • SG Optimizer – SiteGround’s plugin which speeds up your business website and fixes multiple items in GTmetrix including caching, minification, and image optimization font optimization, combining files, and managing PHP versions.
  • Updraft Plus – free, highly rated backup plugin that is also lightweight.
  • WordPress SEO Plugins – full list of SEO plugins curated by myself.
  • WordPress Speed Plugins – full list of speed plugins curated by myself.
  • WPForms – contact form plugin which comes pre-installed when importing your Astra theme. The Pro version allows for even more fields and features.
  • Yoast SEO – robust SEO plugin which I have a tutorial for. You can break Yoast down into 3 steps: settings configuration, keyword research, and on-page SEO.

 

21. Optimize Your Website To Rank High In Google

Configure Yoast’s SEO Plugin – Yoast can be broken down into 3 steps: configuring the settings, researching keywords (step #8), and optimizing content (step #13). Below I will show you some basic tips for configuring Yoast’s Settings (found in the SEO tab of your dashboard).

  • In General → Features, only enable features you actually use. In my opinion, the XML Sitemaps and SEO Analysis are the only features you truly need, since that creates a sitemap and gives you on-page SEO recommendations. The more familiar you are with on-page SEO, the less you need features in Yoast, since for the most part, they are simply recommendations for on-page SEO.
  • In Search Appearance → General, fill out your company name and upload logo.
  • In Search Appearance (Content Types, Media, Taxonomies, Archives), control which content should be indexed in Google and which should not. Usually, pages and posts are the main content you want indexed in Google. Categories, tags, archives, and other content should usually not be indexed in Google.

 

18. Setup Google Tools

Google Analytics and Google Search Console are equally important. Google Analytics is more for learning about your visitors, while Search Console helps optimize your website for SEO.

How To Setup Google Analytics – sign up for a free Google Analytics account and add your website. Fill in your website details and they’ll give you a tracking code (eg. UA-156905224-1).

You can either paste the JavaScript tracking code directly into the header of your website, or use a plugin like GA Google Analytics to enter the UA number which also has some settings. Google Analytics and Search Console take several days to collect data on your business site.

How To Setup Google Search Console – sign up for a free Google Search Console account and add your website. You will be asked to verify ownership by copying/pasting a TXT record into your DNS. To do this, copy the code, then login to SiteGround and go to My Accounts → Go To cPanel → Advanced DNS Zone Editor. Paste the record there. Click “Verify” in Google Search Console, then you will be taken to a dashboard where you can add your Yoast XML sitemap, check SEO analytics, and check for mobile, security, and sitemap errors (among other things).

Business-Google-Search-Console-Verification

Submit Your Sitemap To Google – to submit your Yoast XML sitemap to Google, find your XML Sitemap in Yoast under SEO → General → Features → XML Sitemaps → See the XML Sitemap. Copy the last part of the sitemap URL which should be sitemap_index.xml. Next, login to Google Search Console, go to Sitemaps, paste the last part of the URL, then Submit.

Business-Website-Sitemap

 

19. Make Your Images Format On Facebook

By default, your website won’t format nicely on Facebook.

By adding og:images (open graph images) in Yoast, you can make your business website format beautifully when shared on Facebook and Twitter. To do this, edit a page and scroll down to the Yoast SEO section, then click the Social tab. Next, click the Facebook and Twitter tabs. In these sections, you’ll see an option to upload a custom image for Facebook (1200 x 630px) and Twitter (1024 x 512px). Optionally, you can customize the page’s Facebook title/description.

Yoast-OG-Image

Yes, this means you need to create custom graphics for each page if you want it to format properly. But it encourages people to share your content and is especially good for blog posts.

Without custom image:

Business-Sharing-Before

With custom image:

Business-OG-Image

Ideally, you should do this for every page/post on your website.

 

20. Make Your Website Load Fast In GTmetrix

Configure SiteGround’s SG Optimizer Plugin – as explained previously, go into your SG Optimizer settings and enable managed PHP, HTTPS, and minification, combination, and optimization of files. You can also use it to optimize Media including images and Gravatars.

SG-Optimizer-Frontend-Optimization

SG-Optimizer-Media-Settings

Use Cloudflare’s Free CDN – activate in SiteGround under My Accounts → Go To cPanel → Cloudflare → Activate Free. With Cloudflare, you’re hosting heavy website files on 200+ data centers around the world, reducing the geographic distance between your server and visitors.

Business-Cloudflare-Activation

Optimize Images – there are 3 main ways to optimize images in GTmetrix: optimize images (lossless compression which can be done with a plugin like ShortPixel), serve scaled images, and specify image dimensions. Avoid oversized images and measure the dimensions of each section (sliders, full width blog images, etc) so you can upload them with correct dimensions.

Avoid Slow Plugins – avoid this list of slow WordPress plugins.

Keep WordPress Software Updated – keep WordPress core, theme, and plugins updated.

Run Your Website Through GTmetrix – GTmetrix is a great speed testing tool to see your page load times and which images, plugins, and elements take longest to load on your site. As you build your business website, keep an eye on your GTmetrix report to keep your site fast.

Business-Website-GTmetrix-Report

 

21. Get A Custom Business Website Design

Want a custom design for your business website?

Our team creates beautiful, search engine optimized websites in WordPress. To get a quote for a custom design, contact our team to schedule a time to talk about your website needs.

hair-salon-web-design-mockup

I hope this tutorial was super helpful for building your business website. If you have any questions, leave them in the comment below and I’ll be sure to answer them as soon as I can.

See Also: My 35-Step On-Page SEO Checklist

Cheers,
Tom

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments