Service and retail businesses need a website that describes their products, shares their location and hours, and invites visitors to move forward with a purchase. Business website design doesn’t have to be complicated, but you do need to get these basics right. A website that’s confusing or slow will reflect poorly on your brand, and ultimately deter customers.
This is what inspired us to create Fit Web Themes: Business Edition. It’s the most cost effective way to create a fast and modern business website. As a WordPress theme, you can fully customize the site to match your branding without the need for any programming, and pricing starts at just $2.95/month for the website, domain and business email accounts.
This guide will explain how to create a setup a business WordPress website in just 30 minutes. If you have any questions along the way, you can submit a question in our user forum.
Fit Web Themes: Business Edition
Fit Web Themes: Business Edition is a one-stop way to get all the essential business website design features—like contact buttons, maps integration and mobile functionality—on a platform that’s easy for you and your visitors. To design your site, simply add your content and adjust colors, fonts and formatting on an easy-to-use menu. There’s no programming required.
To use our free theme you’ll need a WordPress account. If you have one already, you can skip to installation instructions below. Otherwise, we’ll show you how to set up a WordPress account next. Using Bluehost, you get a WordPress website, custom domain (www.YourSite.com) and business email, all starting at just $2.95/month.
Step 1: Get Your Domain & Hosting
To create a business WordPress website, you first need a hosting plan. We recommend Bluehost because they combine everything into one package (website, domain AND professional email accounts) and offer the best pricing starting at $2.95/month.
To get started, simply follow the link and click “Get Started Now.” The first step is to choose your hosting package. Their basic plan starts at just $2.95/month and it should be sufficient for most single-location businesses. You’ll typically only need the “plus” plan if you want to create more one website, or want to set up more than 5 business email accounts.
Lastly, you’ll enter your payment information and finalize your order. An important note: In order to get the best pricing, you do need to pay for 3 years upfront. However, you can also cancel within 30 days for a full refund.
Step 2: Set Up WordPress
Once you’re signed up for Bluehost, you’ll be prompted to set a password and confirm your email address. After this, you’ll be routed to the Bluehost dashboard. There’s 3 quick settings to change here:
- Click “My Sites” on the left panel, then “Manage Site.”
- Find the “Settings” tab. In the box that says “Site URL,” change the temporary URL to the one you just purchased. This ensures your new domain is linked up with your new site.
- Now click the “Security” tab. In the box that says “Free SSL Certificate” click enable. This will change your website to an “https,” which is better for search engine rankings.
Once you’re finished, click “Log in to WordPress” and you’re ready to start working on your website.
Step 3: Install & Customize Fit Web Themes
Clicking “Log in to WordPress” will bring you to the WordPress dashboard. This is your main ‘control center’ where you’ll design your website, make edits, add blog posts, etc.
First things first, you need to get Fit Web Themes: Business Edition installed on your site. To do this, hover over “Appearance” on the left menu and click “Themes.”
Now click “Upload” in the top-right corner:
Now click the button “Upload Theme” at the top of the screen. This should open a prompt to upload a file. Download Fit Web Themes: Business Edition here, then upload this entire .ZIP file onto WordPress. Once loaded, click “Install Now.”
Once finished, click “activate.” You’ll now have our theme installed on your site. The next step is to start designing!
Designing your website is as easy as adding your business information and photos. If you prefer, you can also make simple adjustments to the format of the site.
Fit Web Themes: Business Edition was designed to be as user-friendly as possible. Yet, it’s also highly customizable: You have full control over colors, fonts, and page formatting, all managed from the easy-to-use customization menu.
As you’ll see, the customization menu is divided further into subsections, like Header and Social Links. Click on the buttons below for instructions on each section— and remember, you can also ask a question in our user forum if you need any additional help.
Click Box For Instructions
Here is where you design the header panel to your website. First, you can upload a logo, or simply entering your business name as text (you’ll be able to adjust the font later.) Below that, enter your street address and phone number.If you still need a logo, check out graphic designers on Fiverr. You can hire a designer for as little as $5 to create your business logo.
By default, the header color is transparent black. This allows you to easily read the white text, while still making your background image visible behind it. If you want to change the header or text color, simply click the box and use the sliders to adjust it.
Now add social media icons to the top-right corner of your website. Simply paste your page link under the appropriate field and the icon will automatically appear. There’s also an option to add an email address with a mail icon.If you haven’t created social media accounts yet, I recommend checking out our guides to learn the benefits of Facebook, Yelp, LinkedIn and Instagram for business.
Here you can choose your website’s font and color themes. By default, Fit Web Themes: Business Edition uses Comfortaa for headers, and Open Sans font for the body. However, you can try out different fonts and preview them instantly.
Body font is used in paragraph sections like “About” or “Hours.” Your headings font appears in section titles, and sub-headings is used for buttons, and your main navigation menu.
|Body Fonts||Header Fonts|
Default Background Color will change the background color for certain sections and pages on your site. The reason it doesn’t change the background color everywhere is because some sections (like Location and Gallery) have their own color controls.
If you want to use the same background color across your whole website, simply locate the 6-digit HEX color code, write this down (or copy it to your clipboard) then apply it anywhere else you want to use this color.
Here you’ll choose which sections you want to appear on your homepage, and in what order. Simply click and drag a section to re-arrange. Or, click on the eyeball icon to remove a section from your website.
Here’s a rundown of the 7 homepage sections available for this theme:
- Hero. Features a title, background photo and button. This should almost always appear at the top of your website.
- Location. Displays your address, hours, and contact information, plus an embedded Google Map.
- Gallery. Adds a simple image gallery to your homepage.
- About. A place to add a short bio, or product/service description.
- Testimonials. Add up to 5 testimonials + headshots from past customers.
- Email Capture. An optional mailing list signup form powered by Mailchimp.
- Footer. Add text, links, or images to the bottom of your website.
The hero section features a large banner image with text and a button at the bottom. Think of this as the main “headline” of your website. It should capture your visitors’ attention, provide a simple summary of your business, and give visitors a easy way to proceed via the button.To add an image, you can select one of the 3 default images we’ve provided (boxes, cityscape, or tools), or upload your own. What typically works best is a photo of your team, or products. However, if you don’t have any photos just yet, you can find more royalty-free photos on Pixabay, Unsplash, or Pexels.
Use “Background Color” to adjust the color of the banner just below your image. This makes it easy to read your hero text and button:
Adding a Button
To add a button, simply enter text and a URL. Also choose a color and button style that matches your website theme.
To change the button font, head back to the Design menu on the previous page. Change the “subheadings font” to adjust the button text font.
This is a simple menu to add your main business information, including your address, hours of operation, phone number and email addresses.This section also features an embedded Google Maps widget that shows your address as a pin on the map. To set this up, you’ll need a Google or Gmail account (which you can create for free), then follow these instructions from Google to get an API key.
If you don’t have a physical location for your business (or just don’t want to encourage drop-ins) simply remove this section. Head back to the customization menu, click Section Order and hide the Location section by clicking the eyeball icon.
A simple gallery to display photos of your products, team members or office/location. You can upload as many photos as you like. The photos will appear as thumbnails, and visitors can click to zoom-in.Layout Columns changes the number of columns in your photo gallery. You can use it to increase or decrease image sizes. For example, changing it to 3 will feature larger rows of 3 images each.
Add a paragraph description of your businesses or products. We’ve provided a rich text editor so you can add links, photos, or change the style of your font.
If you plan on writing more than a couple paragraphs, I recommend creating a separate page instead. The main purpose of your homepage is to get visitors to call, email or visit your business. A lengthy text-based section can distract from the more important features. This guide explains how to create new website pages a little further down.
Note: By default, the about section will be hidden. To enable it, you’ll have to head back to Section Order and click the eyeball icon.
Testimonials is where you can share reviews from past clients. Simply add their quote, enter their name and workplace under attribute, and (optional) upload a headshot. WordPress will automatically crop the photo as a circle.
You can enter up to 5 testimonials. To add more, just click “Add new Testimonial” at the bottom.
Section: Email Capture
This is an optional section for Mailchimp users who want to add an email newsletter signup form on their website. Simply write a header and subheader, then add your Mailchimp API Key and List ID. This will make an email signup field appear below.As with all the sections, you can move the email signup form wherever it fits best on your website. If email marketing is a major source of new clients, consider moving it higher up to maximize signups. Simply head to Section Order and drag email capture above the other sections.
If haven’t started email marketing yet but are interested in trying it out, Mailchimp has a free edition for small businesses. Click here to sign up, or learn more about what they offer in our email marketing software buyer’s guide.
Like the header, your footer appears on every page of your website. It’s typically used to display website credits, photo credits, or copyright information. You can also add up to 6 accolades, which are small icons that represent awards, achievements, or press links for your business.
Simply click “Add new Accolade,” and upload an image. Ideally this should be a transparent PNG, so it doesn’t clash with the background color of your website. You also have the option to link a URL, e.g. the article that mentions your business.
To find these logos, just use Google Images. Set the color to “transparent” on the top menu bar.
Here is where you create your main navigation menu, which appears on the right side of the header.Click “Create new Menu” and name it “Main Navigation.” Check the box that says “Navigation Menu” and click Next.
Now Click “Add Items.” This opens a menu where you can decide which links to add to your navigation bar. Because you’ve only created 1 page so far (Home) there won’t be too many options. Just click “Home” for now— you can add more later.
Once you’ve finished making edits on the customization menu, click the gear icon up top and select “Save Draft.” Then click the X to head back to the main dashboard. You can come back to the customization menu at any time to keep working.
Step 4: Add More Pages To Your Website
Many businesses like to add additional pages to highlight more about their products/services, origin story, order information, etc. It gives you the opportunity to add extra information without making your homepage too crowded.
Fortunately, WordPress makes it easy to do this. New pages automatically contain the header, footer and background color of your homepage, so they’ll fit the style of your website.
To create a page, head back to your dashboard and click “Pages” on the left toolbar. Then click “Add New.”
For each page you create, there are 3 key elements to complete:
- Page Title. Add at the very top.
- Page Slug. The URL of the page you’re creating; add just below the title.
- Page Contents. Add in the large box below. To include a photo, click “Add Media.”
Once finished, you can preview your page, save it as a draft, or just click “Publish” to go live. You can always make edits later, even after it’s published.
Remember to add additional pages to your navigation menu, so they’ll be linked at the top of your website!
Create a Blog For Your Business Website
In addition to providing great websites, WordPress is also an excellent blogging platform. If you’re looking for a way to post news updates, share advice, or promote special events, consider adding a blog to your site.
Simply head to “Posts” on the right left menu bar, and click “Add New.” Just like creating a new page, you’ll add a title, write text and add images/media content.
I recommend saving each blog posts under the same category name, like “Blog” or “Updates.” This way, adding your blog to your main navigation bar is easy. Just click “Add Items” > “Categories” > “Blog”
If you wanted to create 2 different blogs (e.g. one for events, another for news and updates), then simply use 2 different categories. Then you can link to them separately on your navigation bar.
Step 5: Publishing Your Site
When you’re ready to go live, click the Bluehost button on the left menu bar.
Now find the window that says “Launch Your Site” and click the button “Launch.”
This will make your website go live. You should now be able to type your URL and reach your site. If you’re experiencing any problems, head back to Step 2 and make sure you entered the URL under the “settings” panel.
The Bottom Line
Along with your website and domain name, Bluehost also lets you set up 5 professional email accounts that use your domain (firstname.lastname@example.org). To set this up, check out our guide on creating a business email account.
As a new website owner, you’ll also want to learn how to rank high on Google searches (just a few quick steps will do a lot of help!) and be sure to keep following our marketing section for even more tips on boosting website traffic and getting more customers through the door.
If you’re still having trouble setting up your website, or have any remaining questions about how to use Bluehost or WordPress, you can also drop us a line on our user forum.