How to Create a Professional Website with WordPress (Beginner Friendly)

Although WordPress is very easy to use and create website with, still many people are struggling making a professional website. In this tutorial I will teach you how to build a professional website for your business using WordPress. The concept of this guide is to give you tips that will help in building a great website that converts visitors into customers.

WordPress-Based Website Builder

Perfect for Beginners! Create Out of the Box, Professional and High Quality Websites with WordPress and BoldGrid.

If you want to learn the basics of how to set up WordPress or want to know how to start a blog in minutes, please check out the linked tutorials.

This tutorial does not involve programming or web design skills. It is perfect for beginners who are starting out with WordPress. Everything is illustrated with screenshots.

Beginner friendly! No coding! No geeky terms! Simple and straight forward! Step-by-Step.

Professional Hosting for Professional Business

While you are creating this website for your business, you want to be professional. To publish your website online, you will need a hosting service. For this guide I used InMotion Hosting as an example. I highly recommend this hosting company for creating and hosting your business website. If you want to learn more about this hosting provider, please read our InMotion hosting review.

So first, you will have to purchase a hoisting plan.

By following this link, you will get 47% instant discount. Scroll to the bottom of the page and choose the Launch Plan by clicking the “Order Now” button.

order inmotion launch plan

Review your choice and click “Continue”.

inmotion business class hosting order process

If you already own a domain name, select that option, otherwise you can register a new domain for free with this hosting plan.

inmotion register free domain

For this example I selected the option to link my domain to InMotion’s server so I continue with the “I already have a domain” option. Review your choice and click “Continue”.

inmotion already own domain name

The system will automatically detect your location and will pick the web server where your website will be hosted. If you want to do adjustments, select a new location for the server. You can choose between East Coast and West Coast. Consider having your website hosted on a server that is closer to you and your clients.

inmotion hosting east coast west coast

Now the most important step of this order is to select he content management system you want to install to your website. Here you will choose “Install BoldGrid, powered by WordPress”. This is the builder we will be using for creating and customizing our website. BoldGrid is a WordPress powered page builder, which allows you to create custom layouts without the need of knowing HTML, CSS or other programming. Please check out our BoldGrid review to find out more about this great tool.

inmotion automatically install boldgrid on signup

Fill in your personal and financial information. This page is secure and encrypted, so your data will be protected. Click the “Purchase Account” button to finish your order.

inmotion purchase hosting account

You will be contacted by phone in few minutes to confirm your order. Once your order is confirmed, you will receive an email with login information. Meanwhile WordPress and BoldGrid are getting installed to your website automatically. At the end of your order, you will have a working system that you can customize.

So far, so good! Now comes the fun part, when you actually create your website.

Creating Your WordPress Website

Once your account is verified by phone, you will receive a welcome email from InMotion with all the login details. This email contains the login to your Account Manager Panel, login to cPanel and to your WordPress site, where BoldGrid has already been installed.

Now access the dashboard of your website and login. The login screen is different from the default WordPress login screen. The dashboard is also a bit different, but it does not make much difference, even if you already used WordPress before.

inmotion boldgrid login

On the welcome screen you will two videos that, one for beginners and one for advanced WordPress users. These videos are a quick presentation of BoldGrid. I highly suggest watching them! The following video explains how to start with BoldGrid:

Now, to get started you will need to click on the “Inspirations” menu.

boldgrid inspirations website

On the inspirations page you can choose from two options: Install as Staging (choose this if you already have a website and want to upgrade it with BoldGrid) or Install as Active (this option is for those who do not have a website yet). We will proceed with the “Active” site.

boldgrid install active sites

The next step is to choose a category for your website. At the time of writing there are about ten categories you can choose from, but there will be added more as BoldGrid evolves. Choose the category that is closest to your website niche.

boldgrid choose website category

Once category is selected you can choose a theme that you like. You can preview any of these themes and see how it will look on a desktop, table or mobile phone. Please note that some themes contain copyrighted images with watermarks. You can purchase these images (using the coin system) or you can replace them with your own photos. We will select the “Uptempo” theme for this tutorial.

boldgrid select theme

After picking the theme you prefer, choose the page set you want to install to your website. We will choose to install five pages, which are the most common for this category. Click the “Select” button to proceed.

boldgrid choose page set

Confirm your selection and finish the installation of the theme and pages by clicking the “Install this website!” button. At this step you can still go back and edit the settings chosen before.

boldgrid install website

The installation and creation of the pages will take less than a minute. Do not close the page until it finishes. Once the installation is done, click the “Customize” button.

boldgrid download install theme website

The theme customizer allows you edit your website and preview the changes you are making. The options can vary from theme to theme. For the theme we selected earlier, Uptempo, we can change the site title, change font, position of title, upload an image logo or site icon.

boldgrid customize website

In the colors section, you can choose from different color palettes. There is a “Suggest Palettes” function that will suggest a color scheme every time you click it. Choose the color scheme that you like!

boldgrid color customizer suggest palettes

There are many other settings you can configure to make your website unique and outstanding. For instance you can choose to have a static homepage, which will display a page selected by you. You can also add widgets to the header and footer and also insert custom HTML (Google Analytics for example). It is also possible to add custom JavaScript or CSS to your theme, without the need to opening any files. We won’t go into details now, because this tutorial would take too long to write and read.

Once you are done, click the “Save & Publish” button! You can come back later and edit any option if you want to.

Now go to the homepage of your website and enjoy the view:

boldgrid website example

You are not ready yet! There are five pages on your website, but these are packed with the default content that comes with the installation. You will want to change these.

boldgrid edit pages

In the WordPress you will be able to change text, add and replace images, clone or delete different blocks, drag and drop blocks vertically and horizontally.

boldgrid page editor

With the “Add GridBlock” function you can select from a wide range of pre-created layouts. This function also allows you to insert Google map into your page, or choose from a wide range of contact forms with various fields.

boldgrid insert gridblock layout

The BoldGrid API also allows you to search for high quality images, both free and commercial. You can set the size for the image you are adding into your page, and the system will automatically crop and install the image to your website. This feature allows you to tune up your pages with beautiful images in just few minutes, without even using image editor software. How cool is that?

At this point, you are done with building your website. Congratulation! You have created a professional website using WordPress and BoldGrid for your business. All this without touching a single line of code, and you were able to add images as well without the need of editing them on your computer.

Summary and Recommendation

This guide turned out longer than I wanted to be, but I think I covered most of the steps that are needed to build a professional website. Hope this guide will help lots of beginners. If you have any questions regarding BoldGrid you can write a comment below, or contact InMotion hosting. The tech support is very helpful and beginner friendly.

I highly recommend both BoldGrid and InMotion for creating and hosting your WordPress site.

Although the process of creating this demo website took me only few minutes, to put together this step-by-step guide took me over one hour. If it helped you, please share on your social media accounts. Thanks!


David Cross

David is the chief editor at WebHostingMedia right from the beginning. He has a great passion for building and managing websites and creating helpful content. He is also interested in programming - currently learning python.