Launch Your Website
Easily Build Your Website From Scratch
Follow these steps to quickly build and launch your website.
Customize your website to match your brand and attract your ideal audience.
LESSON 1: BUILDING THE FOUNDATION
Disclosure: Some of the links on this page are “affiliate links.” This means if you click on the link and purchase the item, I may receive an affiliate commission at no additional cost to you.
Step 1: Purchase Your Domain
Already have a domain? Skip to Step 2.
- Visit to GoDaddy.com
- Enter the domain name in the Search Bar
- Click the Search icon
- Locate the available domain, and Add to Cart
- Follow the steps to complete purchase
Step 2: Purchase Your Hosting Plan
- Visit Siteground.com
- Find the StartUp plan (WordPress Hosting), and click Get Plan
- Choose I already have a domain and type in your domain
- Click Proceed
- Fill out your information
- Add payment information
- Choose the plan period (12 or more months recommended)
- Click Pay Now
- Follow the steps to complete your account
Step 3: Point Your Domain To Your Hosting
If you have an existing WordPress website and you are transferring it, do not point the domain to your Siteground servers yet. First migrate the site using the SG migrator plugin. Once it’s completed, you can change the DNS.
- Log into your Siteground account
- Click Websites
- Click Site Tools
- Scroll down and locate the Name Servers
- Note each name server as you will copy and paste them into your GoDaddy account
- In another tab, log into your GoDaddy Account
- Under My Products
- Locate your domain and click DNS to the right of it
- Scroll down and locate the Nameservers section and click the Change button
- Choose I’ll use my own nameservers
- Paste the 2 name servers from Siteground in the blank fields and click Save
- Once you are done with the DNS, you MUST wait for the website to finish propagating. This can take anywhere between 2 hours to 72 hours (larger websites with a lot of content take more time). If you are building a website from scratch, then it should only take a few hours.
Step 4: Install WordPress
- Log into your Siteground.com account
- Click Websites
- Locate website and click Site Tools
- Click WordPress on the left
- Click Select under WordPress (or WordPress + WooCommerce for an e-commerce website)
- Under Admin Info, enter a username (recommended not to use an email as your username), password, and email
- Click Install
LESSON 2: SETTING UP THE THEME
Step 1: Download the Divi Theme
- Visit ElegantThemes.com
- Click Pricing
- Choose plan (Lifetime plan recommended so you don’t have to worry about renewals and you have lifetime support)
- Create account and purchase plan
- Click Account
- Click Product Downloads
- Click Download Divi Theme
- Save the ZIP file for the next step
Step 2: Install Divi Parent Theme
- Log into your website via WordPress (via Siteground in Site Tools > WordPress > Install & Manage > Scroll down and click the Log In icon on the right > Start Now > scroll down and click Exit OR go directly to yourdomain.com/wp-admin and log in)
- On your Dashboard under Appearance, click Themes
- Click Add New button
- Click Upload Theme button
- Click Choose File button, and upload your Divi ZIP file
- Click Install Now
- Once it’s finished installing, click Activate
Step 3: Install Divi Child Theme
Regardless of the type of design you will have on your website, you will need a child theme. It can be a blank layout child theme or a premium layout child theme. There are several marketplaces that sell premium
A. If you are designing your website from scratch, download this free blank layout Divi Child Theme file (click the link to download the zip file).
B. If you are interested in purchasing a premium pre-designed layout child theme, click here to choose an option. (Bizzy Bee Theme is currently free for beta testing)
- On your WordPress Dashboard under Appearance, click Themes
- Click Add New button
- Click Upload Theme button
- Click Choose File button, and upload your child theme ZIP file
- Click Install Now
- Once it’s finished installing, click Activate
For premium themes, follow these extra steps:
- Go To Divi > Divi Library. Click on “Import & Export” at the top and import the .json file. Upload/import/Divi Builder Layouts.json. This will import all layouts into your Divi Library.
- Go to Divi > Divi Options. Click on “Arrow Up / Arrow Down” at the top and import the .json file. Upload/import/Divi Theme Options.json. This will adjust all Divi Options Settings.
- Go to Appearance > Customize. Click on “Arrow Up / Arrow Down” at the top and import the .json file. Upload/import/Divi Customizer Settings.json. This will import all Customizer Settings.
LESSON 3: SITE IDENTITY & BRANDING
Step 1: Upload Your Logo and Favicon
- Under Divi, click Theme Options
- Under Logo, click Upload and choose your logo file (recommended in png format)
- Under Divi, click Theme Customizer
- Click General Settings, then click Site Identity
- Under Site Icon, click “Select site icon” and choose your Favicon file. It is recommended that your favicon be no larger that 512 pixels by 512 pixels and fit within square frame so that it doesn’t get cropped.
Step 2: Choose Your Brand Colors
- Under Divi, click Theme Options
- Go to Color Pickers Default Palette
- Enter the six-digit hex codes for each of your brand colors (or drag the color picker to choose your custom colors). It is recommended that you keep black as one of your colors so that you can find gray colors in the color picker, otherwise you will need to enter the hex codes for the gray scale colors.
- Click Save Changes
Step 3: Set Your Site Identity
- Under Divi, click Theme Customizer
- Go to General Settings
- Select the Site Identity tab
- Enter a Site Title
- Enter a Tagline
- Click Save and Publish
- Click the back arrow within the Theme Customizer
Step 4: Adjust Your Layout Settings
- Select the Layout Settings tab
- Adjust each to your preferred settings
- Click Save and Publish
- Click the back arrow
The Theme Accent Color will change the color of elements such as Links, Widget Headers, Icons, Mobile Menu Icon, Primary Menu Active Link and a few more main elements.
Step 5: Set Your Typography
- Select the Typography tab.
- Adjust each to your preferred settings.
- Click Save and Publish.
- Click the back arrow twice.
You’ll also have the option to customize your typography more in Lesson 5.
Step 6: Style Your Buttons
- Go to Buttons.
- Select the Buttons Style tab.
- Adjust each to your preferred settings.
- Click Save and Publish.
- Click the back arrow.
- Select the Buttons Hover Style tab.
- Adjust each to your preferred settings.
- Click Save and Publish.
Step 7: Choose Your Header Format
- Go to Theme Customizer
- Under Header Format, choose your Header Style
- Click Publish to Save
Step 8: Style Your Primary Menu
- Go to Theme Customizer
- Under Header & Navigation, select Primary Menu Bar
- Adjust the Menu Height
- Adjust the Logo Max Height
- Set your Font Styles and Colors
Step 9: Choose Your Footer Layout
- Go to Footer
- Select the Layout tab
- Choose your favorite Column Layout
- Set your Footer Background Color
- Click Save and Publish
- Click the back arrow
Step 10: Add Your Footer Widget
- Go to your Theme Customizer
- Under Widgets, choose your Footer Area
- Select your widgets
- Adjust the settings
- Click Publish to Save
Step 11: Edit Your Footer Credits
- Select the Bottom Bar tab
- Adjust each to your preferred settings
- Edit the Footer Credits with your copyright info
- Click Save and Publish
LESSON 4: ADDING THE CONTENT
Step 1: Create Your Pages
Get started by adding standard pages such as the Home, About, Contact and Blog pages.
- From the Dashboard area, click Pages on the lefthand menu
- Click on Add New at the top
- Next to Title, type Home
- Below the Title, click Use Divi Builder
- Click on Choose a Premade Layout
- Click on Your Saved Layouts at the top
- Select the Home Page option
- You will be redirected to the Visual Builder for the page
- You can hover over Sections, Rows, and Modules to edit them (it is recommended to edit layouts AFTER you have already created all the pages, since you will be working on other items first)
- Click on Publish (or save if already published) on the bottom right
- Click on Exit Visual Builder at the top
- Follow the same steps for the About Page, Blog Page, Contact Page, Services Page, etc.
Step 2: Create Your Menus
- From the Dashboard area, click Appearance on the lefthand menu
- Then click on Menus
- Click on Create a New Menu
- Next, check the boxes on the left for all the pages you want to add to your main menu on the top (where your logo shows) and click the Add to Menu button. You can click on View All to show all the available pages.
- After your pages have populated on the right side, click and hold to drag and move the pages in the correct order.
- Check the box for Primary Menu below and click the Save Menu button.
- If you would like to add a Secondary Menu (shows above the Primary Menu) or Footer Menu, then follow the same steps except choose the corresponding menu box at the bottom before saving the menu.
Step 3: Homepage Settings
Method 1
- Go to Theme Customizer
- Click on Homepage Settings
- Select the Static Page option for Displays
- Select the Home page from the Homepage dropdown
- Click on Save at the top
Method 2
- Go to WordPress Dashboard
- Go to Settings
- Click on Reading
- Choose Static Page from the 2 options
- Choose the Home page you created for your Homepage
- Leave the Blog page unselected
- CLick Save
Step 4: Set Up Permalinks
This step should only be completed if you haven’t created any blog posts yet to avoid broken links. If you have, stick to the same permalink structure you’re already using.
- Under Settings, click Permalinks.
- Choose your option.
- Click Save Changes.
Step 5: Add a New Blog Post
- Go to Posts, click Add New
- Enter your Post Title
- Enable the Use The Divi Builder button
- Insert a column (i.e. a Single Column)
- Insert a module (i.e. Text)
- Add your content.
- Click Save
- Click Publish if the post is complete
- At the top, click Exit the Visual Builder then Save and Exit.
Step 6: Assign Categories
- At the top, click Edit Post
- On the righthand side select Categories and create a new category or select an existing one.
Categories help to organize your posts and help visitors find they posts they want to read about. This is optional, but always recommended.
Step 7: Set Your Featured Image
The featured image is what will appear on the blog feed of your website. By default, this will also be the first image that appears within your blog post.
- To set your Featured Image, locate the Featured Image box on the lower right side
- Click Set Featured Image
- Select an existing image from your Media Library, or upload a new one
Step 8: Publish Post
- Click the Preview button to view how your blog post will look before publishing.
- If you are still working on things, but need to come back later to finish, then click the Save Draft button and edit your post later.
- Once you are ready to share your new post with the world, click Publish.
LESSON 5: FINALIZING THE DESIGN
Designing with a Purpose
There are countless ways to customize your website design to make it perfect for your brand. Utilizing the different Modules that are built into Divi, you can create a unique design that helps your website stand out within your niche.
And if you know HTML and CSS, you can create some really impressive designs. For some inspiration, see this post from Elegant Themes where they showcase 13 awesome Divi websites.
However, there are specific strategies that you can implement to grow your audience, to maximize your conversions (a.k.a. help you gain the most customers/clients/prospects), and to make you money!
If you would like personal help implementing key marketing strategies on your website, click here to submit your information for an opportunity to work one-on-one with me. Get ready to grow your audience, make more conversions, and make more money!
Don’t Know Your Niche Yet? Get My FREE Niche Planning Workbook Below!
Need Some Inspiration? Here are Over 50 Niche Ideas!
