Hey hey hey! We are back with a completely new how to make a wordpress website for free tutorial using one of the BEST themes available: Empire Theme by Soho Themes
In this how to make a wordpress website for free video, we’re going to show you how to make and how to build your own wordpress website from scratch. You don’t need to know any type of coding. It’s just going to be copy and paste and drag and drop. By the end of the video, you’re going to be a wordpress expert!
So without further adieu, let’s learn how to make our wordpress website for free and start creating the wordpress website of your dreams!
Step 1: Register a Domain and Get Hosting Service
Step 2: Go to Email Inbox
Step 3: Log Into Cpanel
Step 4: Install WordPress
Step 5: Download Empire Theme (WordPress Theme)
Step 6: Install WordPress Theme
Step 7: Install WordPress Plugins
Step 8: Download Demo Content
Step 9: Upload Demo Content
Step 10: Create WordPress Website Homepage
We need to create a new page. Right now we have the wordpress blog page showing, which isn’t the page we want.
- Go to your wordpress dashboard
- Hover over page
- Click Add New
Now you should be on a new page. And what we want to do is title this page.
- Title the page Home
- Select Backend Editor for Visual Composer
- Click Publish
Now once you’re back on your wordpress website homepage after the page has been published…let’s do the following
- Click Change Permalinks
- Select the option you want
- Click Save
Update WordPress settings
We’re going to set the homepage and add WWW. to your website domain now.
- Go to your dashboard > settings > reading
- Click A Static Page Option
- Select Homepage for Homepage
- We’ll come back and select the blogpost page later
- Click Save
Now let’s go to the General Settings
- Hover over settings > general
- Add “www.” for WordPress Address and Site Address
- Double and triple check you added http://www.domain.com
- If you mess up, your site is going to crash so be extra careful!
- Click Save
- Log back in and you’re good to go!
Step 11: Customize Theme Settings
Before we start creating and making our wordpress website homepage, I want to select our options for our wordpress website.
- Go to your dashboard
- Hover over Empire
- Click on Theme Options
Here I will just type out the options that we use for our demo wordpress website that we make together.
General Tab
- Leave everything as is
Header Tab
- Upload your custom logo (go to the demo content if you want)
- If you need a logo, you can go to logomakr.com and make one 🙂
- Show search visibility
- Turn on Languages if you want to make your wordpress website in multiple languages
404 Page Tab
- I like to change the background color to white
Blog Tab
We keep everything as the default
Footer Tab
- If you want your logo to show up -> check the box
- If you want to change the copyright -> you need this premium plugin (it supports the developers)
- If you want to add your social media button links -> type them in
- You can change the footer colors accordingly or leave them as the default
Typography Tab
- I use Arial for all the font options on my website
We leave everything else as is …if that changes…I will update it here.
Make sure you click the SAVE button!
Step 11: Learn How to Use Slider Revolution
Before we learn how to make our homepage for our wordpress website, we are going to make the slider for the top of the homepage. To do that, we’re going to use the premium theme, Slider Revolution, which I can offer to you for free.
- Go to your dashboard
- Find Slider Revolution and click on Slider Revolution
- Click on Add New
- Title your slider – we’ll name our’s “Slider 1”
- Put the same name in the Alias
- Select Default Slider option
- For this tutorial we’ll use the Full Screen option
- Click Save Settings
Now you should be on the slide editor
- Go to main background and select the button titled Main/Background Image > click the button to choose your image
- Select the image you want and upload it
- Now add some text boxes for the header and subheadline (change the font sizes)
- Add some buttons if you want (watch the video to learn how to customize the buttons)
Click save when you’re done!
We can add additional slider images if we want. But for this tutorial, we’re only going to add one. You can watch this more detailed tutorial if you’d like to learn how to really use the slider revolution to it’s fullest potential.
Step 12: Customize and Build WordPress Homepage
Now it’s time to go back to our homepage and start making our wordpress website! I’m really excited to show you how to do this.
- Go back to your wordpress dashboard
- Hover over pages and click on that link
- Find your home page link and click on it
Now you’re back on the edit homepage
- First, you can go to the bottom and select hide your page title
- Then you can change the transparency of the header if you want. We want to make the header transparent for the demo site.
Now let’s go back up to the top and make sure that we have the backend editor selected for the visual composer
Add Slider to WordPress Homepage
- Click the + icon and find the revolution slider 5 and click to add that to the top of your homepage
- Just select the slider you created and click “Add selected slider”
- Click on the pencil for the row settings
- Select Stretch Row and Content (no padding) for Row Stretch
- Click save
Add About Section to WordPress Homepage
- Add a Heading module
- Click save
- Now to to the rows tab on the left and click custom and add “4/12 + 8/12” to split the row widths
- Now edit the heading and add your text
- Add the following options: H3, Headying Style – Style 1, Heading Alignment – Left
- Click save
- Click the + and add a text block below and add a description
- Click save
- Click the + and add a buton
- Add your button text
- Add your URL for the button
- Align the button Left
- Click save
Create blogpost page and set blog post page
Create About Page
- Go to your wordpress dashboard
- Hover over pages
- Click Add new
- Title the page “About”
- Click the Backend Editor for the Visual Composer
- Add a text box for the Page Title (-20px for the top padding)
- Add a separator
- Add a new column and add a custom row option of 5/12 + 7/12
- Add text and image to each row – add large to the image size
- Add a new row (stretch row)
- Add a Heading
- Add a new row and make it 3 rows
- Add three service widgets
- Add a button
- Add a new row and change it to two rows (stretch row)
- Add a single image – add large to image size and center it
- Add a text block
- Add a button below the text block (left)
- Add a new row and make it 4 rows (stretch row)
- 0px for the bottom margin
- Add counters for each row for icons
- Add another row (stretch row and content)
- Add 0px to the bottom margin for the row
- Add a heading
- Add a button
Now you’re done building your About page for your WordPress website! I hope this section helped you learn how to make a wordpress website about page!
Create Team Page
- Create a new page and name it Team
- Turn on the visual composer backend builder
- Add a text box for the Page Title (-20px for the top padding)
- Add a separator
- Now let’s add a row and make 4 rows
- Add team members into each and add details
- Add another row (row stretch and content)
- Add heading
- Add button
Create Contact Page
- Add a row and make it 4 columns
- Add contact info widgets
- Add a new row
- Add a heading widget
- Add another row and make it custom (1/4 + 1/2 + 1/4)
- Add a contact form widget into the middle row
- Add another row (stretch row and content – no padding)
- Add 0px to the bottom margin
- Add a map widget (zoom 12, height 400)
- Add another row (stretch row and content)
- Add a heading
- Add a button or newsletter widget
For your contact form, go to the contact tab and click on contact form and replace the text with this code
<div class="form-group"> [text* your-name placeholder "Name"] </div> <div class="form-group"> [email* your-email placeholder "Email"] </div> <div class="form-group wpcf7-message"> [textarea your-message placeholder "Message"] </div> <div id="recaptcha_response" class="g-recaptcha" data-sitekey="6LcUERkTAAAAAKj94Lv1HoeLspJykDfslIqF4Fyx"></div> <div class="btn-wrapper mt-40"> [submit "Send"] </div>
Create Testimonials / Success Stories Page
- Create a row and change it to however many rows you want (three for the wordpress website demo)
- Add single testimonials in each row
- Add additional rows if you want
- Add another row (stretch row) – change the background color for this row if you want
- 0px bottom padding
- Add a heading
- Add another row and change the columns to 4
- Add logo blocks to each row
- Add another row and change the background color (if you want)
- 0px bottom padding
- Add a heading
- Add a button
Create Blog Post Page
- Add a new page
- Title the page
- Go to the blog template and change it to blog masonary
- Turn on the builder (back end)
- Add a row (stretch row and content – no paddings)
- Add a heading
- Add a newsletter form
- Click publish
Now we need to set our blog post page
- Go to settings > reading > set blog post page
- Save changes
Make sure your theme settings are set for the masonry view
Now let’s customize our sidebar
Appearance > Widgets