The Complete Elementor Course for WordPress

Explore the basics of elementor by understanding sections, columns, and elements, and apply basic styling, background images, and spacing with margins, padding, and negative margins.

Master the basics of sections, columns, and elements in the Elementor course, learning how sections hold columns and how elements stack vertically or align horizontally to build layouts.

Edit sections, columns, and elements in Elementor using layout, style, and advanced tabs to set height, min height, fit to screen, background color, overlay, gradient, typography, borders, shadows, and buttons.

Learn to use margins and padding in Elementor to control space inside and outside elements, add borders, and apply hover effects across columns and headings.

Review the homework and explore how to design a two-column section in Elementor, including headings, text, color, typography, buttons, spacing, and responsive layout.

Learn to design a homepage replica in Elementor after completing basics, watch first, then implement in chunks to build professional WordPress websites.

Design and build the WordPress homepage from scratch using Elementor, covering page setup, header and hero section creation, and precise styling of borders, colors, padding, and layout across sections.

Design a WordPress homepage in Elementor by creating sections and columns, adding headings, images, and overlays. Display three steps for success, testimonials, and a free consultation CTA with cohesive typography.

Explore theme styling by configuring the header and footer in WordPress with Elementor, including setting a static home page, uploading a logo, customizing colors and borders, and styling menus.

Design an about us page in WordPress using Elementor, styling headings, colors, and typography (Mary Feather) with two-column sections, quotes, and border and shadow effects.

Design a complete services page in Elementor by duplicating sections from the about page, adding a graphic design service, and adjusting padding, box shadow, and top and bottom margins.

Design a contact us page in WordPress with Elementor, replicating an existing layout, adding a contact form and two-column sections with a purple background overlay.

Choose images with proper licenses for your WordPress site, using free visuals from Unsplash or paid options like Shutterstock, and resize to 1280x720 JPEG at 70% quality for faster loading.

Learn to choose website colors by aligning with your logo and using a two-color or three-color palette. Apply color psychology for branding and keep the design professional.

Master the art of using box shadows in Elementor to elevate your website design with minimal, precise shadows on columns, images, and sections, including copy-paste styling and opacity control.

Master minimal hover effects in Elementor by changing button background color and subtle border or box-shadow tweaks for a professional, distraction-free site, and avoid distracting animations.

Apply entrance animations in Elementor using motion effects like zoom in and fade in on sections and columns, with controlled duration and delays.

Learn to optimize your WordPress site for mobile rendering with Elementor by testing responsiveness using Chrome developer tools, adjusting font sizes, spacing, and alignment for mobile and tablet views.

Learn to optimize your WordPress homepage with Elementor using the mobile editor and responsive mode to tailor typography, spacing, padding, and alignment for mobile devices.

Optimize the WordPress home page for tablet view in Elementor by switching to tablet mode, resizing elements, adjusting columns and spacing, and testing with Chrome developer tools for iPad.

Learn to optimize the about page for mobile in Elementor using responsive mode, a single-column layout, and typography and padding tweaks.

Learn how to optimize the about page for tablet view in Elementor by converting two columns into one, and adjusting widths, padding, and heading sizes for a balanced layout.

Learn how to optimize the services page for mobile and tablet with Elementor, adjusting responsive settings, single-column layouts, padding and margins, and heading sizes for clean spacing.

Render the contact page with Elementor, optimizing for tablet and mobile via a single-column layout, centered headings, adjusted minimum height and spacing, and a 60% tablet split.

Learn to configure mobile theme settings in Elementor with Astra, customize headers and footers, and align the primary menu to the off-canvas menu for responsive tablet and mobile views.

Learn to set and apply global colors in Elementor, including primary background, accent, and text, enabling one-click site-wide color changes and easy client revisions.

Learn to configure global fonts in Elementor, setting a primary font for headings and body text, adjusting line height and size, and applying typography across the site via site settings.

Explore theme style site settings in Elementor, including typography, buttons, images, and form fields, and learn how to customize colors, hover effects, shadows, and borders.

Explore site settings in WordPress and the Astra theme, covering site identity, logo, site icon, background color, dark mode, and layout defaults, plus container width and responsive breakpoints.

Configure Elementor settings, enable the editor for posts and pages, manage theme colors and fonts, review usage data sharing, and implement Google Maps with API key setup.

Navigate advanced settings to enable external css, manage the switch editor loader, and allow unfiltered svg uploads, then review font loading options, experiments, and the admin toolbar.

Explore the role manager in WordPress, assign roles like author and editor, grant or restrict access to posting and page elements, and manage who can publish content.

Explore the Elementor tools settings, including regenerating files and data, cache handling, safe mode, debugging, replace url, version control, maintenance mode, and import and export kit.

Learn to enable maintenance and coming soon mode in Elementor, create and customize templates, design a coming soon page, and restrict site visibility for non-logged-in visitors.

Explore the other settings in Elementor, including maintenance mode, access controls for authors and editors, system info utilities, and handling submissions with custom fonts, icons, and code.

Discover why Elementor Pro costs 49 per year and unlocks custom header and footer. Explore benefits like widgets, motion effects, theme builder, kit library, and the 30-day money-back guarantee.

Upgrade from the free Elementor to the pro version by purchasing, downloading, uploading, and activating the pro plugin on WordPress, then access all pro features.

Install the Halo element blank theme to remove the header and footer, then design the body with Elementor to craft a custom header in the next lecture.

Design a custom header in Elementor using the theme builder, adding a header template, and customizing a two-column layout with a logo and nav, plus responsive adjustments.

Import and insert premade header layouts to quickly create a complete header with menu, button, search, and social icons, then customize the logo and colors with built-in mobile optimization.

Learn to create and customize a footer in Elementor's theme builder, add a site-wide footer with a contact form, and publish it across the entire website.

Learn how to edit previously created headers and footers in Elementor, using page-level editing, header and footer editors, and the theme builder in the WordPress dashboard.

Create and customize an Elementor Pro contact form, add fields from name to phone and date, enable reCAPTCHA, and manage submissions and MailChimp integration.

Create and customize WordPress popups with Elementor using templates, adjust layout and styling, and configure triggers and exit-intent offers to capture leads.

Master motion effects in Elementor, adding scrolling, horizontal, and intersection animations, with scale, blur, and zoom transitions, and configure a sticky header to boost user experience.

Discover why the Elementor course adds an e-commerce module, its engaging path, freelancing demand, and how building e-commerce templates and product pages deepens mastery of single and archive templates.

Install and activate the WooCommerce plugin to convert your WordPress site into an e-commerce store, then configure store settings, payments, shipping, and pages like cart and checkout.

Learn to add five products to a WordPress e-commerce site using sample images, set product details, pricing, inventory, publish, and explore dynamic pages and templates.

Configure essential WooCommerce settings in WordPress, including shipping zones, flat-rate methods, currency, and direct bank transfer payments, to launch a functional e-commerce site.

Perform a live demo of adding to cart, checkout, and order processing on a WordPress WooCommerce site, including customer accounts and admin order management.

Learn how to create and manage product categories in WordPress WooCommerce, assign products to categories, configure slugs and subcategories, and understand category pages and related products.

Explore how WordPress templates in Elementor drive consistent product pages, create a single product template, apply it globally or by category, and customize with drag-and-drop elements in the theme builder.

Design and customize a single product template in Elementor for WordPress, arranging product image, title, price, description, add-to-cart, related products, and category styling with borders, typography, hover effects, and dividers.

Learn to use dynamic tags in Elementor to pull WooCommerce product data, customize images, buttons, and headings, and link to cart or media with flexible sizing, alignment, and styles.

Master the preview mode to design a single product template in the theme editor by switching products to preview how it adapts and displays related products.

Learn how display conditions control which templates render for products, including creating a novel template, assigning conditions by category, and managing templates in the theme builder.

Learn to use advanced custom fields (ACF) to add ISBN, pages, language, and format to WordPress products, and display them with templates, dynamic tags, and conditional logic for novels.

Design a header with a menu cart, shop page, and categories to give a static WordPress site an e-commerce look using Elementor, including a hover mini cart.

Configure the header menu in WordPress using Elementor, adding shop and my account links, organizing product categories as a dropdown, and styling the dropdown for a polished header.

Compare single and archive templates in this Elementor course: single templates show one product or post, while archive templates list multiple items and auto-update with new products.

Design and customize the product archive template in Elementor's theme builder, configuring archive titles, product grids, pagination, and styling to unify shop pages and category views.

Design and customize the my account page in Elementor using the WooCommerce my account widget, creating a vertical dashboard with sections for orders, downloads, addresses, and account details.

Learn to design a dashboard template for the my account page in Elementor, create the dashboard section with icons, dynamic user data, and personalized links to orders, address, and logout.

Design and customize the cart page in Elementor for WooCommerce, configuring layout options, sticky right column, and styling totals, update cart, and coupon sections.

Design and customize the purchase summary page in Elementor, using dynamic tags for the user name and WooCommerce details with typography and color tweaks.