Elementor Beginner Tutorial - Build a Fully Responsive Custom Website in WordPress Using Elementor

Published: 22 August 2022
on channel: Reialesa
2,586
72

Get Elementor Pro: https://be.elementor.com/visit/?bta=2...
Awesome, affordable hosting: https://www.hostg.xyz/SHGec

Download the resources (images, text, CSS, links to tools): https://drive.google.com/drive/folder...

🗞️ Subscribe to my newsletter: https://www.reialesa.com/newsletter/

Chapters:
00:00 - Intro
0:01:30 - Setting up the back end (WordPress and plugins)
0:09:23 - Setting up the front end (global fonts, colors and general website settings)
0:13:17 - Creating our first section
0:29:17 - Using CSS to make clickable columns
0:30:28 - Making the first section responsive
0:38:04 - Parallax scrolling section (motion effects, z-index)
0:55:35 - Third section (reviews)
1:10:15 - Fourth section (icons)
1:22:12 - Logo slider section
1:26:17 - The rest of the CSS explained
1:30:52 - The last section (new arrivals)
1:39:04 - Header
1:40:10 - Using the theme builder to create the header (Elementor Pro only - if you don't have Elementor Pro, just try to build this out like a normal section)
1:52:12 - Using pop-ups to create the mobile menu
2:04:27 - Using the theme builder to create the footer (Elementor Pro only - if you don't have Elementor Pro, just build this out like a normal section)
2:08:05 - Creating a form to collect emails (Elementor Pro only)
2:18:47 - Website overview and tips

This is a tutorial made for beginners and intermediate users that want to learn how to build a fully custom website in WordPress with Elementor easily. We'll be building a simple, yet modern and aesthetic, website for a conceptual plant online store. We're going to make sure it's fully responsive so that it looks great on all desktop, tablet and mobile devices.

We'll go over the basic structure within Elementor - sections, columns and widgets. We'll take a look at how to use widgets to create content and how to style them appropriately. When it comes to widgets, we'll go over icons, images, text editors, headings, image carousels, spacers, icon lists and more.

We'll use motion effects to create a very fancy, yet simple, parallax scrolling effect. Elementor makes this easy but wield your power responsibly! We'll create a logo slider along with a custom header that's going to look amazing on mobile because we'll use a pop-up to create the mobile menu. Don't worry, we won't forget about the footer either.

I'll also do my best to give you some great design and user experience tips and tricks that you can use to get better at designing and building websites, fast. Everything you learn in this tutorial can easily be applied to your own WordPress website and you'll be creating awesome custom websites, without the use of templates, in no time. #ElementorTutorial #Beginner #WordPress

Get in touch:
https://www.reialesa.com/youtube/

Don’t be shy! Let me know what you’d like to see next, ask me anything related to design or just simply say hi.

Please note that some of the above are affiliate links, which means I earn a commission if you make a purchase, at no additional cost to you. Thank you very much if you decide to use them!


Watch video Elementor Beginner Tutorial - Build a Fully Responsive Custom Website in WordPress Using Elementor online, duration hours minute second in high quality that is uploaded to the channel Reialesa 22 August 2022. Share the link to the video on social media so that your subscribers and friends will also watch this video. This video clip has been viewed 2,586 times and liked it 72 visitors.