Master Elementor: Build Stunning Websites Without Code.
in Web Development.png)
About this course
Learn to build beautiful websites without any coding! This free course from Brait Academy will guide you through creating professional websites using Elementor and WordPress—no tech skills needed.
In this beginner-friendly course, you’ll learn how to:
Use Elementor’s easy drag-and-drop tools to design your site
Make your website look great on any device.
Create custom headers, footers, and pages.
Build your portfolio of websites without writing code.
Whether you're building your own site or starting a web design business, this course will help you get there. Join our supportive community here, and let’s turn your ideas into reality. Start your journey today and discover how simple web design can be!
Related Courses
FAQ
Comments (0)
In this lesson, we will learn how to install and activate the lightweight and free Hello theme, create the pages for our website, and add a WordPress navigation menu.
This lesson will cover:
✔︎ Installing and Activating the Hello Theme
✔︎ Enabling Headers and Footers in Experiments
✔︎ Creating Website Pages
✔︎ Adding a Navigation Menu
✔︎ And much more!
In this lesson, we will dive into the Elementor Editor and learn how to structure web pages by using sections, columns, and widgets, and learn the basics of working with them.
This lesson will cover:
✔︎ Elementor Editor overview
✔︎ Page structuring and layout
✔︎ Adding & working with widgets
✔︎ Basic custom settings for widgets
✔︎ And much more!
In this lesson we will build our design system for our website, to simplify the building process and guide us in styling our website's elements.
This lesson will cover:
✔︎ Configuring Site Settings
✔︎ Setting up Global Colors
✔︎ Setting up Global Global Fonts
✔︎ And much more!
Global Colors and Fonts used in this lesson:
COLORS:
Primary Color (rename: Grape) - 6759AA
Secondary Color (rename: Almond) - ffffff
Text Color (rename: Basil) - 3BBA97
Accent Color (rename: Raspberry) - EC465F
n this lesson we will define our website settings and structure using the free Hello theme, including the site identity, header, footer, and site layout.
This lesson will cover:
✔︎ How to set up your Site ID, including site name, site logo, and favicon
✔︎ How to create and style a Header
✔︎ How to create and style a Footer
✔︎ How to edit your website layout settings
✔︎ And much more!
In this lesson we will use the Elementor widgets to structure and build our for a restaurant website homepage. We will introduce Elementor’s essential widgets and learn to customize them.
This lesson will cover:
✔︎ How to structure your page
✔︎ The basic Elementor widgets
✔︎ How to customize and style your page elements
✔︎ Image file best practices
✔︎ Workflow enhancements
In this lesson we will cover the responsive editing foundations in Elementor, optimize our homepage for responsive viewing. We’ll also set this page in Wordpress to display as the homepage on the website.
This lesson will cover:
✔︎ Responsive editing foundations in Elementor
✔︎ Inheritance Principles in Elementor
✔︎ Optimizing web pages for responsive viewing
✔︎ Setting a page to display as the homepage on a website
In this lesson we will build the “Our Menu” page, learn about new widgets, discuss more efficient workflow methods, and go over some basic optimization concepts.
This lesson will cover:
✔︎ Workflow Methods
✔︎ New Widgets
✔︎ New Techniques
✔︎ Anchor links and CSS ID
✔︎ And much more!
In this lesson we will create the “Contact Us” page, cover widget positioning and more optimization methods, and conclude the course with a review and suggestions for your next steps.
This lesson will cover:
✔︎ Reusing and modifying previously saved templates and elements
✔︎ Optimizing layouts using fewer columns and custom positioning
✔︎ Course conclusion and review
✔︎ And much more!
Create a clean, responsive template for a single menu item that looks great on any device. Add a food image, dish name, price, description, and dietary icons (like vegetarian or spicy). Include a clear "Order Now" button to encourage action. Use Elementor’s global colors and typography for a consistent design, and save it as a reusable block so you can easily use it for other menu items.
