
Explore five mega WordPress Elementor projects and learn to build premium, feature-rich sites using free plugins, with vertical animation, parallax, hexagonal images, and domain search.
Install and activate the Elementor page builder in WordPress, search for the plugin, and learn to create pages with sections using Elementor and its add-ons.
Discover free, high-resolution images for websites and how to choose image sizes for testimonials, backgrounds, and overlays, with sources like Pixels.com, Bixby.com, and Unsplash.
Create a new WordPress page by navigating to pages, clicking add new, entering a title, selecting the Elementor canvas template, publishing, and updating the page as needed.
Master global settings in Elementor by adjusting default colors and fonts, edit and publish pages, and build a professional hero area with drag and drop tools.
Learn to create a custom reset CSS for WordPress with Elementor, set body font sizes and line height, dark background colors, and a primary orange color.
Identify and fix a full-screen height issue in the Twenty Twenty WordPress theme by inspecting style.css, adjusting section padding, and switching to a different theme version to verify.
Update the services section by changing the icon color to the primary color, and preview the next lecture where we feature client counts, projects completed, and team growth for promotion.
build a two-part promo area in WordPress with a counting numbers plugin to show projects, clients, websites, and team members, using a shortcode and visual styling.
Create a client testimonials section in WordPress using the strong testimonials plugin and a custom post type, build a slideshow view with Elementor, customize fonts, colors, and background overlay.
Set up a header with a logo and navigation by creating a top section, configuring a two-column layout, and building a primary WordPress menu under appearance menus.
Learn to style a fixed header in WordPress Elementor by adjusting height, applying fixed positioning and z-index, and preparing for a scroll-triggered background using JavaScript in a follow-up lesson.
Add a footer widget with a title, a darker background, and centered copyright text with the symbol; then set the font to Nonito and adjust padding for a responsive finish.
Install and activate the Elementor plugin in WordPress, explore the getting started interface, and learn to create a first page and set a custom front page.
Change the WordPress reading setting from latest posts to a static page (sample page). Save and refresh to view the custom front page; next, we'll edit it with Elementor.
Learn to edit and manage columns in Elementor, including right-click options, duplicating columns, adding new columns, and customizing headings and buttons.
Install and activate a WordPress theme such as Neave or OceanWP to replace the default theme and avoid issues like padding, and adjust the body font size with custom sizes.
Install and activate essential WordPress plugins, including custom CSS and JS, contact form seven, essential addons for Elementor, premium addons for Elementor, and a responsive menu.
Configure global styles in Elementor by setting default colors and fonts, including Roboto condensed for headings and buttons and Roboto for body text, plus the accent color for buttons.
Learn to create animated svg shapes by drawing a vector ship, copying polygon points, and animating them with the svg animate tag using a viewBox.
Create and animate an svg ship using a polygon clip-path to reveal an image wrapped in figure tag, starting from zero width and height with a duration and indefinite loop.
Add SVG animation code to Elementor by inserting an HTML element, pasting the SVG code, applying custom CSS, and adjusting the animation duration for live preview.
Tackle layout obstacles by adjusting the is Fiji animation to 60:40 and removing default padding. Inspect elements, apply css, and enable overflow-x visible with custom code.
Learn to add content to the hero area in Elementor, including headings, text, typography, colors, gradient background, gradient button, and future particle effects preview.
Fix a font issue on a WordPress Elementor page by explicitly loading the Roboto Condensed font and applying the correct font family for consistent typography in future projects.
Learn how to add animated blobs to WordPress sites using a blob maker, customize colors, enable svg uploads in Elementor, and implement a jump animation with keyframes for visuals.
Create and customize a section at 1920x1080, draw with the pen tool, refine shapes, apply a two-color gradient with 20–30% opacity, upload a background image, and update.
Create a new process section using a center-aligned timeline with essential add-ons, customizing skins, items, and media in Elementor for a polished visual workflow.
Learn to create a presentation video background in WordPress Elementor, using a YouTube video as background with a gradient overlay and centered heading and button.
Create and customize a pricing table in WordPress using Elementor, installing and configuring a pricing table plugin, editing sections, colors, badges, and layout via shortcodes.
Create and customize a WordPress contact form with the contact form seven plugin, including name, email, subject, and message fields, embed via shortcode, and refine padding and typography.
Create a WordPress header menu from appearance, add items such as home, about, pricing, portfolio, testimonials, and contact, and arrange a logo with navigation in a two-column header.
Learn to implement a responsive WordPress menu using a free plugin, configure breakpoints for desktop, tablet, and mobile, and refine visibility and styling across devices.
Create a hexagon chip with a one-line clip-path polygon in HTML and CSS, using precise points to form the shape and preview a border or image inside the hexagon.
Demonstrate placing an image inside a hexagon shape, center it in the layout, and set the image to fill the parent's width and height, preparing for a border.
Discover how to create a hexagon border around an image by nesting hexagon containers, centering with flexbox, and adjusting sizes to form a precise border.
Install and activate the elemento plugin, search for plugins, and explore options such as media, pages, appearance, and plugins, then create a page with elemento and a hero area.
Install and activate the hello elemento theme for WordPress, preview its details, and set a custom homepage using the Elementor page builder workflow.
Set a custom home page in WordPress by selecting a static page in settings. Build with Elementor, add sections and headings, and preview before updating.
Create overlapping images in Elementor and insert social icons, then customize with borders, drop shadows, and a hexagon background using polygon clip-path.
Build a client testimonials and team section in WordPress with Elementor by installing the Owl Carousel plugin, duplicating sections, and embedding custom HTML and JavaScript.
Experiment with the testimonial section layout in WordPress Elementor by adjusting image sizes and margins, balancing alignment, and using inspect element to fix previous and next controls.
Create and style a contact form section in a WordPress Elementor layout, featuring a 24-point heading, paragraphs with icons, social icons, and custom html.
Explore how to build a responsive WordPress menu using the responsive menu plugin, configure breakpoints for mobile and tablet views, customize appearance, and ensure accessible focus outlines.
Install WordPress on a live server using the hosting control panel's installer. Choose domain or subdirectory and set admin username and password, then open the WordPress dashboard.
Learn to create an animated line hover effect for services in Elementor using a canvas template, and set up icons, headings, and text, and prepare CSS for the free version.
Set global colors and fonts across the site, defining primary, text, and accent colors and using Roboto Condensed for typography and gradient colors for the landing page.
build a full-height hero area in WordPress with Elementor, featuring a two-column layout, customizable background types, a heading and body copy, and a glow call-to-action button.
Build a how to use section in a WordPress Elementor page by adding a new section, styling headings and backgrounds, and listing actions like download, install, register, log in.
Build a screenshot gallery in WordPress using Elementor by installing and configuring the slick slider plugin, creating slides, and tweaking height, overlay, and center mode.
Create a newsletter section on a WordPress Elementor landing page by installing the email subscribers plugin, building and styling a subscribe form, and embedding it with a shortcode.
Learn to create and customize WordPress pages with Elementor: add pages, place sections and columns, drag and drop elements, select templates, and adjust global colors, fonts, and responsive settings.
Learn to change your WordPress theme by accessing the dashboard, installing and activating the Hello Elementor theme, and editing pages with Elementor to set a custom homepage.
Set your website's default typography and color scheme by configuring global fonts to Railway and selecting primary and text colors in Photoshop site settings for cohesive branding.
Create a polished domain search interface in Elementor by configuring margins, headings, and borders, centering white text, and adding a css underline with a pseudo-element for a centered highlight.
Create a services section in Elementor, using inner sections and duplicates, adjusting padding and colors, with icons for shared hosting, cloud hosting, reseller hosting, dedicated hosting, and domain name.
Create a testimonial section with a custom Corozal testimonial carousel in a Wordpress Elementor course, building HTML markup, assets, and initializing Owl Carousel for the display.
Learn to implement a responsive WordPress menu using a mobile-friendly plugin, configure a fixed header, and tailor visibility for mobile devices with hash navigation for home, services, pricing, and testimonials.
Learn how to apply entrance animations and motion effects to sections in a WordPress Elementor site, using fade, bounce, and zoom techniques, with overflow handling and section-specific settings.
Compare div p and div > p to understand parent and child selectors, use id selectors with hash, and visualize how first-level children respond to targeted styles in CSS.
Explore how to include css styles: inline, internal, and external styles, and learn how linking external css files and priority rules determine which styles apply.
Learn css borders, including width, style, and color, and create rounded shapes with border radius to form circles. Explore outline concepts and how onfocus removes link outlines.
Learn to control width and height with CSS, apply background color, and center text vertically using line-height and text-align on a div with 300px dimensions.
Explore CSS text formatting properties, including text-align (center, left, right, justify), text-transform (uppercase, lowercase, capitalize), text-indent, letter-spacing, and word-spacing, with practical examples and live style updates.
Explore the CSS display property, comparing block, inline, and inline-block behaviors on divs, and learn how width and height apply to each, including hiding with none.
Explore how float and clear work in css by floating elements, observing their removal from normal flow, and learning how clear restores visibility and text wrapping around images.
Learn how to apply text shadow in CSS by specifying horizontal, vertical, blur values, and color. See how font size, color, and bold text interact with shadow to create emphasis.
Master Elementor and Build 5 Stunning Mega Websites – No Paid Plugins Required
Are you looking for an all-in-one course where you will not only master Elementor but also build five incredible websites packed with cutting-edge, professional features? If so, you are in the right place.
In this mega course, you will learn how to implement premium-looking designs with zero paid plugins. Everything is built from scratch, and you get access to resource files to follow along.
Exciting Features You Will Master
SVG Animation
Animated Blobs
Particle Backgrounds
Animated Text
Real-time Domain Search
Hexagonal Images & Borders
Custom Carousels
Google Maps Integration
Presentation Video Background
Interactive Contact Section
Animated Random Numbers
Filterable Portfolio
Process Timeline Feature
Beautiful Pricing Table
Download App Section
Newsletter Section
Custom CSS & JavaScript
Responsive Navigation Menu
Automatic Logo Changer
Gradient Backgrounds & Buttons
Unique Hover Effects (Animated Line, Icon Flipping)
Stunning Entrance Animations
Unique, Eye-Catching Hero Sections
And Much More
No Paid Plugins – Just Pure Creativity and Smart Techniques
The golden rule of this course is to achieve premium designs without paid plugins. Learn how to craft modern, stylish, and feature-packed websites, all for free.
The Five Mega Projects You Will Build
Creative – A Professional and Modern Website
This project is perfect for those who want to design elegant, clean, and functional WordPress websites from scratch.
Master Elementor: Sections, Sub-sections, Elements, and Default Styles
Add Custom CSS and JavaScript easily
Create an eye-catching Hero Area with Particle Animation and Animated Text
Implement premium features like Filterable Portfolio, Team Carousel, and Testimonial Carousel
Design a fully responsive Navigation Menu
Discover insider tips and techniques to build professional sites quickly
Yolo – SVG Animation and Blobs at Their Best
A project designed for adding animations and interactive elements to your site.
Hero Area with Animated SVG, Particle Effects, and Blobs
Process Timeline and Filterable Portfolio
Presentation Video Background and Pricing Table
Testimonial Promo Area and Google Maps Integration
Fully Functional Contact Form and Responsive Menu
Hexpro – Convert PSD to WordPress
For those who want to turn design mockups into fully functional WordPress sites.
Hero Section with Colorful Particle Effects and Hover Effects
Stunning Overlapping and Hexagonal Images
Automatic Logo Changer and Custom Carousels
Filterable Portfolio and Google Maps Integration
Unique Contact Form with Icon-Embedded Input Fields
Fully Responsive and Stylish Design
Appster – Build a High-Converting App Landing Page
This project focuses on creating a visually appealing app landing page from scratch.
Unique Hero Section with Entrance Animations
Animated Line Hover and Icon Flipping Effects
Interactive Features Section with Auto-Changing App Images
Gradient Effects: Text, Icons, Buttons, and Backgrounds
More than twelve sections, including Newsletter, Pricing, and Download App Section
Learn to Add Premium Features Without Paid Plugins
HostN – A Powerful Hosting Website with Advanced Features
Designed for those looking to create a hosting website with advanced, real-world functionality.
Hero Section with Particle Background and Animated Text
MouseMove Parallax Effect (No Plugin Required)
Real-Time Domain Search Functionality
Interactive Hover Effects and Pricing Tables
Custom Testimonial Carousel with Focused Center Item
FAQ Section and a Stylish Footer
Why You Should Enroll in This Course
Step-by-step guidance with hands-on practice
Real-world projects with stunning features
No paid plugins, achieving a premium look without extra costs
Resource files provided for easy learning
Covers beginner to advanced Elementor techniques
Are you ready to build these amazing projects? Enroll now and take your web design skills to the next level.