Mô tả

Learn Elementor and unleash a powerful & free page builder for WordPress with this Elementor course.  With it, you can drag and drop your way to a powerful website design.  Elementor works a little differently from most page builders.  For a start, you design live on the front-end of your site, not in the back-end Dashboard.

The free version is a page-builder that comes with dozens of beautiful widgets and templates that you can use to build your web page content with pixel perfect precision.  It's an impressive and well-established page-builder.

The Pro version of Elementor will blow you away!  If you have ever been frustrated trying to make your WordPress theme look like the demo you saw on the theme's homepage, you are not alone.   Most themes require extra plugins and an in-depth knowledge of the support documentation to make it look anything like the one that drew you to it in the first place.  With Elementor Pro, you don't need to ever feel that frustration again.  Elementor Pro gives you the same drag and drop page builder, but also allows you to create your own WordPress theme, designed exactly as you want it.

This Elementor course covers both the free and paid versions of Elementor. 

After a discussion of why you should learn Elementor, you'll install the plugin and a theme.  We'll then cover:

  • How to borrow inspiration from other websites, to craft your own unique design.  That includes choosing the right fonts and colours for your site.

  • We'll look at the box model and you'll learn how padding and margin can affect placement of elements on the page. 

  • We'll take a look at Hex colour codes.

  • We'll go through all of the back-end settings, including how to install custom fonts and icons (for Pro users).

  • You'll become familiar with the front-end Elementor interface as we go through all of the menu and settings.

  • You'll get to know how an Elementor page is structured using sections, columns and elements.  At this stage, I'll set you a few design tasks and then go over the solutions in detail.

  • You'll learn how to use templates so that you can create a design element once, and re-use it as many times as you want.  You can even export your templates from one site and import them into another.

  • You'll see why global widgets are a powerful asset in your toolbox.

  • For Pro users, we'll look at building an entire theme with Elementor, based on the inspiration we got earlier in the course.  We'll see how different templates can be created and used in different areas of the site design.  We'll create templates for the site header, footer, blog page, 404 page, single post template & archive page template.  Will design the homepage.  We'll design a landing page.  We'll even design a popup and set the trigger conditions to define when it shows on your site.

  • Elementor offers you some great tools, including motion effects.  These can be used to bring movement to your pages, so we'll look at those.

  • How (and why) we can use and integrate advanced custom fields and custom post types into our site design.

  • And finally, we'll look at mobile optimization.  This powerful set of tools will allow you to check (and fix) your site design so that it looks great on a desktop, tablet AND mobile phone.


    Elementor was created for every site owner that wants to create beautiful web content.  It was created to allow you to design the site YOU want.  This course teaches you how to use it!

Bạn sẽ học được gì

Why learning Elementor is a great option if you want a page builder and/or theme creator.

The differences between the free & Pro versions of Elementor.

Where to get inspiration for your website design, colour & fonts.

What the box model is, and why it's so important as you design your site.

How to use Elementor as a page builder.

How to create a use (and re-use) templates.

How to use Elementor Pro to create your own theme.

How to use motion effects in your design.

How to ensure your site looks great on desktop, tablet and mobile phone.

How to use custom fields and custom post types for better website design and easier maintenance.

Yêu cầu

  • A working knowledge of WordPress.
  • Elementor plugin is required for this course. If you want to design your own theme, then you will need the Pro version.

Nội dung khoá học

16 sections

Get Ready...

3 lectures
Introduction
04:29
Why Elementor?
04:29
Course Goals
01:20

Installing Stuff

3 lectures
Installing Elementor
10:35
Choosing a Theme
05:29
Installing Astra
05:47

Designing Your Site

5 lectures
Thinking Containers and Elements
07:10
Finding Inspiration
10:16
Finding Fonts
05:14
Colour Palettes
08:50
Design Summary
01:05

Essential Skills & Resources

3 lectures
Box Model
11:17
Hex Colours
06:13
Images
03:42

Elementor Backend Settings

11 lectures
Backend Settings
13:04
Submissions (PRO)
02:17
Custom Fonts - Installing (PRO)
08:51
Custom Fonts - Linking (PRO)
03:58
Custom Icons (PRO)
02:59
Custom Code (PRO)
02:52
Role Manager
03:02
Element Manager
03:01
Tools
06:52
System Info
01:55
Get Help, Apps & License
02:12

Templates Menu

5 lectures
An Overview
06:18
Theme Builder
04:18
Kit Library
04:56
Add New
02:16
Categories
02:32

Elementor Interface Settings

6 lectures
Interface Layout
08:31
Hamburger Menu
16:10
Global Colours
05:28
Global Fonts
07:55
Theme Styles
09:17
Dial Pad Menu
05:35

Elementor Page Structure

17 lectures
Elementor Page Structure
03:06
Adding Containers
04:51
Container Direction
09:14
Container :: Boxed v Full Width
10:55
Container Alignment & Spacing
13:46
Container Padding & Margin
09:36
Container Wrap
07:36
Custom Positioning in Containers
05:08
Container Styles
06:24
Basic Elements
15:20
General Elements
20:32
WordPress Elements
02:14
Pro Elements
04:45
Some homework for you
02:27
Solution: Homework 1
10:15
Solution: Homework 2
09:06
Solution: Homework 3
05:46

Re-Useable Templates

4 lectures
Re-Useable Templates
05:27
Import & Export of Templates
02:50
Global Widgets
06:15
Built-In Templates
08:13

Introduction to the Theme Builder

2 lectures
The Theme Builder
04:24
Template Display Conditions
06:01

Demo Site

16 lectures
Demo Site Setup
07:16
Create a Menu
01:51
Creating a Header Template
05:29
Creating a Footer
17:23
Design Homepage
22:12
Archive Page - The Blog
09:00
Archive page - Posts Widget
10:20
Adding Recent Posts to the Homepage
04:28
Archive page - Loop Grid
16:31
Single Post Template
08:30
Page Template
04:08
Search Results Template
03:21
The 404 Page
05:30
Creating a Landing Page
05:47
Creating a Popup Template
11:28
Full Site Editing
02:07

Mobile Rendering

8 lectures
BreakPoints
07:04
CSS Size Units
12:50
Font Clamps
04:20
Hide Elements
03:55
Swapping Columns on Mobule
01:46
Responsive Styles
06:01
Responsive Advanced
04:20
Site Checks
21:05

Dynamic Sites With Custom Fields & Custom Post Types

6 lectures
What are Custom Fields
04:50
Creating Custom Fields
07:52
Creating Custom Post Types
07:35
Adding Recipes
02:27
Displaying the Recipes
09:48
Adding the Archive Page
05:40

Animations & Motion Effects

7 lectures
Problem with Animations?
00:42
Viewport for Scrolling Effects
05:37
The Scrolling Effects
09:58
Mouse Effects
04:35
Sticky
02:39
Entrance Animations
05:21
Transform
03:12

Legacy Videos From Older Versions of Elementor

6 lectures
What is this section?
00:28
Thinking Sections, Columns & Elements
09:29
Sections
17:09
Columns
07:09
Inner Sections V Flexbox
18:44
Flexbox Responsive Design
11:55

Resources

1 lectures
Bonus Lecture
00:09

Đánh giá của học viên

Chưa có đánh giá
Course Rating
5
0%
4
0%
3
0%
2
0%
1
0%

Bình luận khách hàng

Viết Bình Luận

Bạn đánh giá khoá học này thế nào?

image

Đăng ký get khoá học Udemy - Unica - Gitiho giá chỉ 50k!

Get khoá học giá rẻ ngay trước khi bị fix.