Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!

Grab it

Learn to create a professional WordPress website from scratch in this comprehensive 4-hour tutorial. Master the installation process, customize themes using Elementor and Phlox Pro, and develop essential pages. Explore advanced techniques for creating engaging blog posts, configuring portfolio items, and optimizing your site for search engines. Gain hands-on experience with responsive design, custom CSS, and animations. By the end of this tutorial, you'll have the skills to build and manage a fully-functional WordPress website, potentially opening doors to web development opportunities.

Syllabus

Intro.
Overview of the Tutorial.
For who is the tutorial?.
4 Goals.
Get a domain and webhosting.
Install Wordpress.
Clean up the Wordpress backend.
Change the user information.
Create a Site Title.
Add pages to your website.
Create a menu.
Introduction to Wordpress themes.
Get The Phlox Pro Theme.
Install The Phlox Theme.
Add SSL (https://) to your website.
Activate Your Website.
Select a Static Page As Homepage.
Optimize Your Permalinks for Google.
Get the free Elementor Page Builder.
Fix the White Screen Problem with Elementor.
A Short Introduction To Elementor.
Import A Complete Website In A Few Clicks.
Uninstall A Demo.
Add an Icon and a Logo.
Download The Image I use in the Tutorial.
Optimize your Images for Google.
Assign the menu to your website.
Remove the Page Title Area.
Boxed or a Fullwidth website.
Add Social Icons To Your Website.
Configure the Header.
Configure the menu style.
Configure the Menu for a Smartphone.
Create A Top header bar.
Use Custom CSS to change colors.
Configure the Typography.
Configure the Footer.
Explenation of the structure of Elementor.
Bring back the amazing Elementor Handles.
The Navigator Explained.
Create a Section with a Call To Action Hero.
Configure the Default Colors, Fonts and Color Picker.
Configure the background of a section.
Get Paid Or Free Stock Images.
Import and Optimise an Image within Wordpress.
Configure the background image of a section.
The Shape Divider.
Create the content of the section.
Add buttons using an inner section.
Make your website responsive using Elementor.
Create an area with information about your services.
Create an Image Gallery.
Duplicate area’s.
Add a video.
The use of padding and margin.
Add animations to elements and columns.
Import a pre made template from Elementor.
Adjust the template.
Introduction to all Phlox Pro Elements for Elementor.
Create a background and adjust it using Blend Modes and Filters.
Use The Phlox Pro Settings to create an absolute position and add a Parallax Effect Within an Image Element.
Configure the Modern Heading Element.
Use Custom CSS.
Add a text about yourself.
Make this section responsive.
Create an About Our Team Section.
Give a complete section an intro animation.
Remove the white bar below a page.
Install Contact Form 7.
Get free templates from ferdykorp.com.
Use Elementor Blocks to build pages in minutes.
What is Elementor Pro?.
Import a template for the contact page.
Import a pre made template from Phlox Pro.
Select the blogpage as the blogpage.
Create a blogpost using Gutenberg Blocks.
Go back to the Classic Editor of Wordpress.
Interesting things in the Gutenberg Editor.
Create a blogpost using Elementor.
Configure the blogpage and posts with Phlox Pro.
Change the date on a post or schedule posts.
Configure the Blogpage using Elementor and Phlox Pro.
Add Widgets in the Sidebar.
Add a Facebook Like Widget.
Install the Phlox Portfolio Plugin.
Create a Portfolio Item.
Export and Import Templates.
Create a second Portfolio Item.
Configure the Portfolio Page.
Show the latest blogposts and portfolio items on your homepage.
Create a Footer Area with Widgets.
Wrapping Up.
Thank you.