Learn from scratch how to create an amazing and professional WordPress website using Elementor and the Phlox Pro theme. In this video I show you step by step how it is done. You wil learn how to install WordPress in a few clicks, create a page using Elementor, import free templates and Phlox Pro templates, how to create blogposts using Gutenberg and Elementor, how to create Portfolio items and how to configure the blogpage and portfolio page. Dozens of people say that they started making websites for a living after watching my video’s.
If you like this video, please like it and feel free to subscribe for more upcoming videos!
This is the website we will make: https://elephlox.com
Here is an overview of what we will cover with timestamps:
00:00:00 Intro
00:00:15 Overview of the Tutorial
00:01:40 For who is the tutorial?
00:02:08 4 Goals
Let’s get started
00:02:22 Get a domain and webhosting
00:09:02 Install WordPress
00:10:43 Clean up the WordPress backend
00:11:41 Change the user information
00:12:32 Create a Site Title
Create The Website
00:14:08 Add pages to your website
00:16:39 Create a menu
00:19:40 Introduction to WordPress themes
00:20:28 Get The Phlox Pro Theme
00:26:47 Install The Phlox Theme
00:28:45 Add SSL (https://) to your website
00:30:45 Activate Your Website
00:32:29 Select a Static Page As Homepage
00:33:14 Optimize Your Permalinks for Google
00:33:48 Get the free Elementor Page Builder
00:35:06 Fix the White Screen Problem with Elementor
00:35:49 A Short Introduction To Elementor
Import a Phlox Pro Demo
00:36:41 Import A Complete Website In A Few Clicks
00:42:18 Uninstall A Demo
Customise The Theme
00:42:59 Add an Icon and a Logo
00:43:47 Download The Image I use in the Tutorial
00:45:06 Optimize your Images for Google
00:45:49 Assign the menu to your website
00:46:59 Remove the Page Title Area
00:47:20 Boxed or a Fullwidth website
00:48:10 Add Social Icons To Your Website
00:50:10 Configure the Header
00:52:46 Configure the menu style
00:53:57 Configure the Menu for a Smartphone
00:54:47 Create A Top header bar
00:55:57 Use Custom CSS to change colors
00:57:10 Configure the Typography
00:59:12 Configure the Footer
The Elementor Page Builder
01:01:16 Explenation of the structure of Elementor
01:03:24 Bring back the amazing Elementor Handles
01:04:39 The Navigator Explained
01:05:21 Create a Section with a Call To Action Hero
01:05:42 Configure the Default Colors, Fonts and Color Picker
01:09:23 Configure the background of a section
01:12:10 Get Paid Or Free Stock Images
01:14:52 Import and Optimise an Image within WordPress
01:17:11 Configure the background image of a section
01:20:31 The Shape Divider
01:21:39 Create the content of the section
01:26:09 Add buttons using an inner section
01:31:27 Make your website responsive using Elementor
01:34:53 Create an area with information about your services
01:37:56 Create an Image Gallery
01:41:51 Duplicate area’s
01:43:54 Add a video
01:46:10 The use of padding and margin
01:48:28 Add animations to elements and columns
Import Demo’s
01:56:22 Import a pre made template from Elementor
01:57:16 Adjust the template
Phlox Pro
01:59:09 Introduction to all Phlox Pro Elements for Elementor
02:01:18 Create a background and adjust it using Blend Modes and Filters
02:05:38 Use The Phlox Pro Settings to create an absolute position and add a Parallax Effect Within an Image Element
02:07:16 Configure the Modern Heading Element
02:09:49 Use Custom CSS
02:11:05 Add a text about yourself
02:12:58 Make this section responsive
02:15:13 Create an About Our Team Section
02:22:28 Give a complete section an intro animation
02:24:26 Remove the white bar below a page
02:28:56 Install Contact Form 7
More Templates
02:25:22 Get free templates from ferdykorp.com
02:29:36 Use Elementor Blocks to build pages in minutes
02:33:50 What is Elementor Pro?
02:35:45 Import a template for the contact page
02:38:44 Import a pre made template from Phlox Pro
Blog
02:44:20 Select the blogpage as the blogpage
02:44:48 Create a blogpost using Gutenberg Blocks
02:45:08 Go back to the Classic Editor of WordPress
02:53:33 Interesting things in the Gutenberg Editor
02:57:22 Create a blogpost using Elementor
03:04:17 Configure the blogpage and posts with Phlox Pro
03:15:26 Change the date on a post or schedule posts
03:16:51 Configure the Blogpage using Elementor and Phlox Pro
03:26:40 Add Widgets in the Sidebar
03:30:52 Add a Facebook Like Widget
Portfolio
03:33:11 Install the Phlox Portfolio Plugin
03:33:47 Create a Portfolio Item
03:40:02 Export and Import Templates
03:43:19 Create a second Portfolio Item
03:47:43 Configure the Portfolio Page
Wrapping Up
03:53:39 Show the latest blogposts and portfolio items on your homepage
03:53:58 Create a Footer Area with Widgets
03:57:19 Wrapping Up
03:58:32 Thank you
How To Make A Wordpress Website 2019 | Beginners#howtobuildawordpresssite
Comments
Post a Comment