Choosing a WordPress Theme and Creating Menus for Your Contracting Website

If you’ve been following our website design blog series, you’ve taken some essential steps toward designing a professional website for your contracting business.

First, you secured your website domain and hosting service. (Haven’t yet? Here’s how.)

Then, you created a stunning professional logo (for free!) to use on your business website.  (Still need to do that?  Check out our post on the topic!)

Awesome work! You’re well on your way, my contracting friend. 

Time to take the next few steps in your website design journey.

What are those? Well, that depends on the hosting provider you chose.

If you’re following our blog for guidance, we assume you chose either Shopify or Bluehost as your for your hosting service.

Did you choose Shopify?  

Lovely.  

Since Shopify has produced an easy-to-follow video series detailing how to design a professional site using their platform, we won’t be discussing that process in detail. Instead, here’s a link to their videos!  

With their help, you’ll have a professional, secure site up in no time (and you’ll still need that purdy logo you created!).

Go get ‘em!

If you chose Bluehost as your hosting provider (or another hosting service that pairs well with WordPress), the rest of our website design blog series is for you.

The next steps in your web design journey will be familiarizing yourself with WordPress, choosing a website theme, and creating your website menus.

Let’s jump in!

Introduce Yourself to WordPress!

“What the heck is WordPress?” you ask.

(Don’t panic!  Freedom Consulting has your back, man.)

WordPress is the free software that you will use to build your website.  It’s technically a “content management system,”…but all you really need to know is that it makes website design possible for people who don’t speak computer code.

There’s a little bit of a learning curve, but overall, it is simple to use and still allows for code customization, as desired.

In short, WordPress makes website design approachable and free to the public.


Also, since a large chunk of the internet uses this platform, there are a LOT of free, professional-looking website themes and templates that were created precisely for easy customization.

You don’t need to be a rocket scientist (or an award-winning programmer) to design a beautiful, functional website for your contracting business.

Good news, eh?!

We thought so, too.

Alright – let’s get started!

Sign into Bluehost, then click “Log into WordPress” to sign into your site.

This process can take a minute, so be patient – but eventually, you’ll see the back end of your WordPress website.

Your website’s “back end” is the portion that no one but you – the administrator – will see. It is where most decisions are made for a website, from design choices to content management.  

To change almost anything on your site, you’ll sign into the back end.

The “front end” of your website will be what the world sees when they visit your domain.

It is the polished, finished product of all your hard work from the back end – with only some exceptions.

For instance, unlike most changes you’ll make to your site, WordPress theme customization takes place from the front end. 

What’s a “theme” in WordPress?

Let’s take a look! 

Choose a WordPress Theme

WordPress displays the polished front end of a website using the computer code contained in the site’s “theme.”

A theme’s code is written for you (but can be customized) and, when added to your site, allows visitors to see content in an organized and decorative manner. 

…Once you tell the theme what content you want and how you want it to show up, that is.

Because WordPress is such a widely-used platform for website design, there are countless themes to choose from.

And a bunch of them are free. (YES!)

We won’t discuss many themes here – we’ll just tell you our two favorites: Kadence and Astra.

Both of these themes are highly customizable, offer free templates to get you started, and allow for paid upgrades if you decide you want more control over certain options on your website (without writing code yourself). 

Both Kadence and Astra are compatible with Elementor and Stackable (design plugins that we will discuss in a later blog) and completely responsive. “Responsive” themes automatically resize your site to look amazing on any device your visitors use, which is essential in today’s world!

Our favorite theme is Kadence because it is slightly more customizable than Astra, and we tend to like designing from scratch – but Astra offers a few more free templates than Kadence, if you plan to use one.

The choice is up to you.  Both themes are good options.

Keep in mind that you can always switch themes later, if necessary.  

To add a theme to your site, click the “Appearance” tab on the left-hand side of your site’s back end, then click “Themes” and “WordPress.org Themes.” 

You can browse popular themes here or search for a specific theme name (like Kadence or Astra) in the search bar.

When you find a theme you want to add to your site, hover over the picture and click “Install.”

Once installed, click “Activate” to make the theme live on your site.

After you’ve chosen and added a theme, delete all the inactive ones from the back end of your site (click the theme picture for “Theme Details” and then “Delete”).

Well done!

Okay – let’s get going with Menu setup.

Set up Website Menus

Add Website Pages

At this point, you’ve chosen the theme your website will display, and now you need to start adding and organizing the pages that will hold your site’s content!

Pages are like separate rooms in the house that is your website.

Your Home Page will be what people see when they first glimpse your site – like the exterior of your home.

Your business might require different pages than your friend’s business – just like your housing needs will differ – but you’ll likely both have a Home Page, an About Page, a Contact page, and Legal Pages for your sites (imagine them as the outside of your houses, the bedroom, the kitchen, and bathrooms, respectively…all necessary). 

Everything else in a home – and a website – is customizable.

Maybe you want a Services Page (a garage) and a Portfolio Page or Testimonials Page (trophy room).

Even if you’re not taking money through your site, you may need a Sales Page or Products Page (a parlor) to display your wares.

You get the point, right?

Whatever your business needs, now is the time to think about how you would like your website to be organized. Don’t worry – you can come back and change things later – but getting the house set up for your in-laws to visit is easier to do before they get there, ya know?!

____________________________________


*NOTE* The following actions assume you are NOT using a pre-designed website template (from Kadence, Astra, Elementor, etc.), OR you’ve already installed the template you plan to use. 

If you are planning to start with (and customize) a template and haven’t installed it yet, choose one you like and add it to your site BEFORE you start working on pages or menus, or you will need to create menus again.  

After you add the desired template to your site, you can use the following sections to add (or delete) any extra pages necessary to customize your menus.

Instructions for installing a website template will differ depending on the source. Google is your friend in this process, but to get you started, here are some instructions for adding a Kadence template to your site, and here are some for Astra templates.

All of these involve adding a plugin, which we haven’t discussed yet, but both sets of instructions explain how to do that.

Moving on…

____________________________________


Once you have an idea of which pages you’ll need on your site, go to the “Pages” tab of your website’s back end and click “Add New” to start adding them.

*NOTE* Pages are not the same as Posts. Posts look similar but are housed within or on the Page(s) of your website. A Blog Page, for instance, is where visitors find the blog Posts you write. For what we are doing at the moment, make sure you’re adding Pages and not Posts.

Back to the Page you just created.

Add a title, as you want it to show up on the menu(s) of your site, (we like to start with “Home”), and then click “Publish.” 

You’ll add content to each page later – but for now, we’re just “mapping” your site, so you don’t need anything but a title.  

(Besides, we haven’t launched your site yet – no one will see the blank page!)

Follow the same process of Adding a New Page, giving each page a title, and Publishing until you have a list of all the pages you want on your site. (Don’t forget the legal pages: Privacy Policy, Terms & Conditions, and Disclaimers. We will get more into that later – but you’ll want them available for the menu-making process).

Finished adding all the new Pages? Perfect!

Let’s create Menus for your website.

Create Website Menus

To navigate your website, your customers need access to a site Menu. There are options for where your Menus reside, but most websites have a menu in the Header (located at the top of the site) and the Footer (located at the bottom of the site). 

You’ve added all the Pages necessary for your business website. Now let’s make them usable to your visitors!

To create a Menu, click “Appearance” and then “Menus” on the left sidebar of your website’s back end.

Then, name your new Menu (we tend to go with “Main Menu” and “Footer Menu”), and select its location.  Choose “Primary Menu” as the location if you’re working on the Header Menu and “Footer Menu” if you’re working on that.

After naming and choosing a location for your new menu, click “Create Menu!”

Next, choose the pages you want to add to the Menu you are making and click “Add to Menu.”

Drag and drop the Pages added to arrange them as you see fit. You can make some pages a sub-category of an umbrella page this way. We have three specific Pages housed under the “Services” menu option in our Main Menu, for instance.

To do this, just drag the sub-category Page(s) beneath and slightly to the right of the parent category, until the sub-category Page(s) say “sub item” next to their titles.

Once your Menu is arranged how you like, click “Save Menu.”

Follow the same process to add any other Menus, making sure to save them as you go, and voila!

Your site has menus!

If you need to make changes your Menus, simply Select and Edit them under the “Appearance” > “Menus” tab.

To view your handiwork from the front end of your site, hover over your website name at the top left of your dashboard, and click “Visit Site!”

It will still look pretty plain at this point, but you should see your menus and be able to navigate them!

Great work, Grasshopper!

Conclusion

Phew!

You’ve accomplished a lot today. Pat yourself on the back!

Familiarizing yourself with the back end of your WordPress website, which you started doing today, is a HUGE deal.  

You can’t design your site without learning and doing what you just did.

*Proud High-Five!*

If you have any questions about this process, feel free to reach out to us.  

And also. 

We know you can do this! (Yes, you CAN!)

…But if you don’t want to design your own website, or this is just proving too much for your brain right now, let us know. We can put you in touch with our trustworthy web designer.


Next time, we will continue working in the back end of your site – updating permalink settings and user details – and we will venture into the world of your website’s front end.

Until then, Grasshopper!

*Another High-Five!*