Learn it · Free course
Elementor 101
Learn Elementor the way it works today. This course is rewritten from scratch for the Atomic Editor in version 4: Flexbox and Grid layouts, Classes and Variables, Components, Theme Builder and popups. It's all text and diagrams, so you can work through it at your own pace.
- Lessons
- 11
- Reading time
- ~3h
- Price
- Free
- Version
- 4.3
Curriculum
From blank install to launch-ready site.
Lessons build on each other, so go in order the first time. Your progress is saved in this browser only, with no account and no tracking.
-
01
Free, Pro and One explained, the new Atomic Editor, and which plan fits your project.
-
02
Hello theme, the free plugin, Pro activation and the handful of settings worth changing on day one.
-
03
Top bar, Elements panel, canvas, Structure and responsive modes — and the shortcuts that save hours.
-
04
How Atomic layout elements nest, when to pick Flexbox or Grid, and a hero section built step by step.
-
05
Heading, Paragraph, Button, Image, SVG and friends — plus where the classic v3 widgets still win.
-
06
One Style tab for every element, hover and focus States, and per-device values for any property.
-
07
Colour, font and size Variables, reusable Classes, the Design System panel and Default Styles.
-
08
Reusable Components with overrides, saved templates, Cloud Templates and importing a kit safely.
-
09
Site parts, display conditions, single and archive templates fed by dynamic content.
-
10
Popup triggers and conditions, the new Atomic Forms, and motion that respects your visitors.
-
11
A practical pre-launch checklist and the habits that keep an Elementor site fast after go-live.
Before you start
- A WordPress site you can experiment on. A staging copy or local install is ideal.
- The free Elementor plugin. Lessons 09 and 10 need Elementor Pro.
- About 15 minutes per lesson. Steps are short, so you can stop at any point.
This is an affiliate link. If you buy through it, I earn a commission at no extra cost to you. It helps keep this course free.