Learning Elementor for WordPress Design

Learn the basics of Elementor, an efficient and convenient way to design WordPress sites and applications of all kinds.

Introduction

• Elementor: The ultimate WordPress plugin
• What you should know
• Exercise files

1. What Is Elementor?

• What is Elementor?
• Elementor features

2. General Setup

• Working locally
• Install Local
• Configuring WordPress
• Choose and install your theme
• Install Elementor
• Other plugins

3. Elementor Basics

• Introduction to Elementor workspace
• Understand the structure of Elementor
• Template overview
• Sections
• Columns
• Widgets
• Responsive mode
• Working with Navigator and undo
• Creating custom templates

4. Getting Started with Your Project

• Project overview
• Creating project content and menu
• Design system: Global colors
• Design system: Global fonts
• Theme styles and buttons
• Setting up the basic header
• Building a basic footer

5. Using Widgets

• Interior hero: Working with background images
• Designing responsively
• Interior CTA section
• Informational block with custom divider
• Create multiple column blocks
• Duplicate and move elements
• Work with the icon box widget
• Reusable page chunks
• Custom template blocks
• Social icons and saving custom template
• Challenge
• Solution

6. More with Widgets

• Carousel
• Testimonial and rating
• Gallery
• Icon List
• Add a map

7. Fancy Widgets

• Background image slideshow
• Overlapping elements
• Use inner sections
• Add video
• Use masks on images
• Scroll background image
• Challenge
• Solution

8. Completing Your Project

• Set the homepage
• Customize your CSS