In this tutorial I show you how to make an amazing website using the Divi theme! I will show you step by step how to create a website using the Divi Theme. An amazing theme that contains a front end editor that makes creating websites easier and faster than ever before! Divi came with a recent update that enables you to make websites even faster! I wil cover that in this tutorial!
Example website: https://divi5.com
Demo Files: https://ferdykorpershoek.com/create-a-wordpress-website-using-the-divi-theme/
Webhosting: http://webhosting126.com
Like me on Facebook: https://www.facebook.com/FerdyKorpershoek/
The Divi builder is a front end editor that shows the result of your editing immediately. The Divi theme comes with 80+ other themes and a few amazing plugins!
Making websites was never so easy as it is this day! If you have a question, please leave a comment!
Overview with Timestamps:
Intro
00:00:15 Overview of the tutorial
00:07:08 For who’s is this tutorial?
00:08:13 Get a domain and webhosting
00:12:53 Install WordPress
00:15:49 Clean Up WordPress
00:16:40 Configure the Permalinks
00:17:24 Remove blogposts
00:17:47 Change User Settings
00:19:23 Create Pages
00:20:53 Create and Assign the menu
00:24:00 Change the homepage to.a static page
00:24:41 Introduction on Themes
00:25:39 Get the Divi Theme
00:25:56 What do you get with the Divi theme?
00:28:25Install the Divi theme
00:29:44 Configure the API Key
00:30:34 Use images I use in the tutorial
00:31:02 Upload a logo and Configure the Theme Options
00:32:25 Social Icons
00:32:25 Other Options
00:33:27 Google Analytics
00:34:27 Change the logo size
The Visual Builder
00:35:10 Explenation of the layout
00:37:05 Creating a blurb
00:39:09 Duplicate Modules
00:39:51 The Editor View
00:40:46 Overview of the options in the Visual Builder
00:42:27 Display options of the Visual Builder
00:42:48 Zoom Out To Drag and Drop
00:43:14 Change to tablet or smartphone view
Create The Homepage
00:43:47 HeaderSlider
00:45:54 How to work with backgrounds
00:49:51 Create a Video Slide
00:54:52 Import Custom CSS to style your website extra
00:57:06 Import Section Options
00:58:18 The Blurb Module
01:03:46 The Video Module Explained
01:04:48 The Text Module Explained
01:07:17 The Gallery Module Explained
01:10:01 The Button Module Explained
01:13:04 Save a Module/Section to your library
01:14:11 Change the look and feel of sections and modules
01:18:11 Use Custom CSS to style your modules
01:23:40 Create a simple clients section
01:25:16 Zoom out to drag and drop areas in your website
01:26:35 Configure the responsive visibility of areas in your website
01:26:55 Work with animations
01:29:04 Load From Library | Pre Made Layouts
01:35:14:16 Divi Theme Settings
01:35:53 Boxed Layout
01:36:20 Website Width
01:36:30 Gutter Width, Section Height and Row Height
01:38:26 Typography
01:40:15 Configure the background of the website
01:41:19 Configure the Menu
01:42:01 The Primary Menu
01:44:27 The Fixed Menu
01:46:25 The Secundary Header
01:48:14 Button Styles
01:48:49 Responsive Settings
01:50:24 Additional CSS
01:50:31 Create beautiful dividers
01:53:12 Verify Your Domain
01:53:50 Add SSL to your website
About Page
01:55:24 Import Pre Made Layouts
01:56:50 Import a Video Background
02:03:24 Create A Custom Footer
02:08:12 Adjust the Socket in the Footer
02:09:08 Add links to your Socket
02:10:54 Change the look and feel of an area in a few clicks
The Services Page
02:13:10 Import a Pre Made Template
02:14:08 Change images using the Divi Filter
02:15:43 Use Fluid Styles to save a lot of time
The Portfolio Page
02:18:36 Create a Portfolio Item
02:20:15 Create a Gallery
02:20:42 Optimise Images | SEO
02:23:16 Create a related projects section
02:26:25 Save your project as a template
02:26:49 Create a second portfolio item
02:29:03 Create a third portfolio item
02:31:18 Configure the portfolio page
The Blog Page
02:36:34 Configure the blog page
02:37:00 Create a fblogpost
02:38:40 The excerpt text
02:39:10 The Text Editor | headers | paragraphs
02:43:22 Style your blogpost
02:46:45 Add a link
02:48:15 Add Images
02:52:17 Use custom CSS to get rid of the sidebar border
02:54:02 Use the live editor to make a blogpost
02:56:32 The Countdown module
02:58:27 Change the postdate or schedule blogposts
03:00:05 Configure the blog page
The Sidebar
03:07:44 Sidebar Widgets
03:08:49 The Facebook Likebox Widget
03:10:33 Blogpost Comments
The Contact Page
03:12:44 Add a free image and optimise it in WordPress
03:15:26. The Call To Action Module
03:16:36 Add 3 blurbs
03:19:30 The Google Maps Module
03:19:43 Get the Google API Key
03:21:11 Configure the Google Maps Module
03:23:19 The Contact Form Module
The Homepage
03:25:19 Add Most Recent Posts on the homepage
03:26:34 Add Most Recent Projects on the homepage
Responsiveness
03:28:05 Make your website even more responsive
03:37:05 What is next?
03:37:22 Thank you so much
You have saved me! I created a page in Divi without understanding the modules. With this information I understand what I need to do to get it the way I I vision my blog. I so appreciate you sharing your knowledge. You rock!
Ferdy I am not able to find your images to practice with.Can you please help. thank you Heidi
How do you make a classifieds website with Divi?
Is there a way to create a video portfolio or gallery for my YouTube videos in Divi? Thanks, Ferdy! Your two Divi tutorial videos have been sooooo helpful! Thank you!
If I copy some styled text from some webpage and paste it into Divi Builder, it doesn't enable me to easily change the font of that pasted text to match the surrounding text. This seems like a horrible oversight as this scenario seems to be very common. It doesn't even enable me to find out the name of the font that is currently the default!
Hi Ferdy- Loving this tutorial. Quick question but. I installed and purchased Divi prior to finding your tutorial. Im currently stuck at 35.10 my site page does not have the "enable Divi builder" HELP!! What might i have done incorrectly? Appreciate the response
It seems like everything is done either in the WP backend or in the Divi Builder plugin. So, do I need to have the Divi Theme activated? Can I use the Divi Builder plugin with another theme, such as VideoPro?
Hi Fredy! I just bought the DIVI theme but why is it that I can't upload the theme on my wordpress? It says that 'The link you followed has expired'. Please help me…
Ik dacht eerst t*ring wat een lange video, maar die timestamps zijn perfect. Thanks!!
Thank you very much for this amazing tutorial…i am so excited to put the skills I have learned in this video into real life projects…. Best regards
Thank you so much Ferdy! Your videos are awesome!
please learn some of free themes. every themes you learn must pay.
This was the best tutorial I've seen to date! Thank you for doing such a great job being precise and reviewing so many features so thoroughly.
you are just amazing
At 35:07 when you close out. Why when i click on the "X" it just takes me back to the Dashboard. How do I fix this?
Ferdy your tutorials are great. Like to know if you have one that shows how to create a parallex slide down menu bar that appears from off screen at the top of the page when you start to scroll down.
Thanks SO Much Ferdy. I love this video and really appreciate the bullet points in the description. Great work!