In this video I show you step by step how to create a WordPress website using the Divi theme. Since WordPress and Divi where updated it was time for a new and better tutorial. So I will show you how to create a website yourself from scratch using the amazing features that the Divi theme has got to offer.
We will get a domain name and webhosting if you don’t have that already, install WordPress, create pages, install the Divi theme, work with the Visual Builder, make use of pre made layouts, learn how to optimise our workflow, configure our theme, create a portfolio, create blogpages and blogposts, optimise our website for all devices and create a contact page.
But that is not all. We will work with the Divi 4.0 theme builder. With the theme builder we can assign custom made headers, templates and footers to any page, post and category. I will show you in the overview of the tutorial what is possible.
Here are some important links:
https://webhosting129.com Domain and Webhosting with 70% discount
https://ferdykorp.com/divi The Divi Theme with 10% discount
https://ferdykorpershoek.com/create-a-wordpress-website-using-the-divi-theme/ The images I use in the tutorial
Demo website: https://divi4.com
Create a portfolio: https://www.youtube.com/watch?v=aMgFCVpQjAY
Create blogposts: https://www.youtube.com/watch?v=dvPcszGVujU
Divi 2020 Tutorial Overview With Timestamps:
00:00:00 Intro
00:00:15 Overview of what you will learn
00:08:28 Get Webhosting
00:09:57 Choose Domain Name
WordPress
00:12:53 Install WordPress
00:15:39 Clean Up Your Website
00:16:45 Configure Your User Account
00:18:26 Create A Site Name and Tagline
00:20:30 Make Your Website Secure
00:22:21 Create Pages
00:26:00 Create A Menu
00:29:48 Select the homepage
The Divi Theme
00:30:20 Introduction to Themes
00:31:42 Get The Divi Theme
00:35:49 Use the same images as I use
00:39:08 Add Google Analytics to your WordPress website
00:40:26 Get automatic Divi updates
Customize the Divi Theme
00:41:39 Add a site icon
Building Your Website
00:42:46 The Visual Builder
00:43:44 Sections, Rows and Modules
00:50:58 Adjust the Visual Builder Layout
00:51:40 Using the wireframe
00:52:53 Import pre made websites
00:53:43 Save Layouts
Start From Scratch
00:55:56 Create A Fullwidth Header00:59:13 Create a background color, gradient, image or video
01:08:51 Get images for your website
01:10:31 Optimise your image
01:15:42 Add a gradient background with an image
01:17:24 Create a Section with 3 columns
01:18:42 Configure the Blurb
01:24:31 Add a video
01:28:03 Add a gallery
01:31:31 Add a button
01:33:28 Save to the library
01:34:58 Change the look and feel of a section by changing the colors and adding css codes
01:42:01 Copy and paste module styles
01:42:48 Add a CSS animation
01:47:20 Use entrance animations
01:48:44 Implement dividers
01:53:01 Change the row settings and gutter
01:54:13 Import a pre made section
Divi Theme Configuration
01:59:43 configure the Theme
02:00:18 Layout Settings
02:02:33 Typography Settings
02:04:17 Website background
02:05:00 Header Format Settings
02:06:21 The primary menu bar
02:07:48 Creqte a transparent header
02:09:55 Change the logo for the fixed header
02:13:21 Create a topbar
02:15:32 Configure the responsive settings
The About Page
02:17:34 Import a pre made template
02:19:43 Download a free video
02:22:25 Make Styles Default
02:23:20 Extend Styles Through the page
02:24:30 Use Multi Edit
The Services Page
02:29:12 Import a pre made template
02:29:41 Change the background color
02:33:58 Find and Replace
The Contact Page
02:38:59 Create the contact page
02:39:17 Use Free Stock Images
02:41:04 Crop images in WordPress
02:42:36 Use a gradient overlay
02:43:14 Create a call to action
02:44:42 Add a row with 3 columns and blurbs
02:47:28 Create a form
02:49:54 What we have made so far
Make your website responsive
02:51:07 Optimise your website for all devices
02:54:08 Hide elements from certain devices
03:00:25 Enable Split Testing
03:03:55 Create a global element
The Divi Theme Builder
03:06:43 The structure of a website
03:08:49 Import a pre made layout
03:12:09 Create a Global Footer
03:13:38 Create a different header for a specific page
03:16:27 Assign a blogpost template to all blogposts
03:19:27 Adjust the blogposts template
03:26:45 Import a blogpage template
03:28:01 Import a product page template
03:32:39 Import a product catalog template
03:34:21 The Bloom and Monarch Plugin
03:36:48 More Tutorials
03:37:33 Thank you
