Here we’ve gathered all WordPress Elementor video and text tutorials we have to date. Use them to create and polish your next WordPress website. We've also divided the videos into sections, so you navigate the collection and choose an elementor tutorial easily. Below, you will find clear howtos for both professional web developers and newbies. We will talk a lot about Elementor page builder and the opportunities it offers to designers of various backgrounds. If you haven’t decided yet whether you want this tool at all, check out our archive of testimonials and a short online course. From the WordPress tutorials below, you will learn about the amazing things you can do with Elementor Page builder and JetElements plugins. You will also see many of our flagship templates being used to create spectacular and full-featured websites. Where can you get these templates? One way to get them is to browse the Elementor marketplace. But there’s one more way.
You can access ALL Elementor templates and use them how you like for only $19 a month. Moreover, the themes you get for this little money will already include all the plugins you see in these videos. Well and as if that wasn’t enough, here’s a 5% promo code for our blog readers: BecomeThe1! Apply it when subscribing to ONE and join the Templatemonster design community!
If you want to be the first to see our new web design and web development “howtos” and fresh WordPress tutorial for beginners, subscribe to TemplateMonster YouTube channel.
Before we start, I want to ask you a few questions. If you could be making beautiful and functional websites (one or two, or dozens of them) without having to hire someone? What if you didn’t need to wander around the web in search of information and help, wouldn’t it be great? What if you didn’t have to pay for expensive web design courses or get endless tickets from thee providers? What if your next website could finally look and work as you want it to? How much easier would your life be? How much money would you save? Well, there’s only one way to find that out. You can sign up for our FREE 5-day Elementor crash course and spend an hour a day developing your web design skills. Suppose you’ve got an hour a day and a mailbox, that’s a great start! And we surely have expertise and the desire to help people make most of Elementor Page builder and web design in general! Let’s see how far this can take us. Almost every our WordPress tutorial on Youtube is coupled with a blog post that covers the same topic. I hope you enjoy them all!
More to know: How to Install Elementor WordPress Template
Here’s a nice video about WordPress for beginners. It will explain how to install Elementor and add your first WordPress template. Elementor Page Builder is an easy frontend design tool that delivers beautiful results with minimum effort from the user. Anyone can master Elementor and get their website polished and packed with functionality.
Now we are inviting you to join our free Elementor web design course developed for every WordPress beginner. We are offering easy-to-follow videos and big informative posts to help you explore web design with Elementor. Whatever knowledge and skills you already have, our practical course will help you work more effectively and use the full potential of Elementor Page Builder. Remember that Elementor Page Builder is made for you whether you are a professional or a WordPress beginner!
More to know: How to Create a Stunning Blog Painlessly
From this tutorial, you will learn how to use JetBlog plugin to increase the converting potential of your website. You will learn how to add posts, create post lists, and adjust post settings. We will use the Huffington post blog as an example and learn how you can make similar layouts. You will also try out different post presentations, play with colors and designs, add media, and do other important things with Elementor.
More to know: How to Create a Mega Menu with Elementor Builder Quickly and Easily?
Our next video deals with creating a MegaMenu. You will learn how to create highly customized and advanced menus that drop down to show categories, media, and HTML. You will also get to customize menu reveal options and form factors. Mega Menus are huge and all their contents elements are visible to the users at the same time. This simplifies the navigation process and helps visitor see more content.
From this video, you will learn how to create a top-notch Mega Menu that will display your products, blog posts, contact form, map, or pretty whatever you choose to put there. You will need your Elementor Page builder and the JetMenu plugin to add an advanced Megamenu to your website. All the steps in the tutorial are clear and easy to follow, so have fun!
Sticky menus are a must for any website in 2019. Some of us may not even remember the times when we had to scroll back up the pages to access navigation. In this video, we show you how you can use MyStickyMenu plugin to create sticky menu bars. Follow these simple steps and get your sticky menu fully customized to your liking
Any element on your WordPress page can be made sticky with Elementor and JetTricks. The element of your choice, like a subscription form or a media player, will be made visible from any spot on the page. Basically, you will be creating a sticky column at the side of your page and putting there the selected element or widget. Cool, isn’t it?
More to know:
Your new WordPress website will need smart navigation. Among other choices, you will have to decide between accordions and tabs. Will you divide the content into sections with tabs or make the pages short and viewable with accordions? Whatever you prefer, this video will teach you how to make use of JetTabs plugin to build effective navigation.
More to know: How to Add and Manage Brands Module in WordPress Elementor Themes
Next, we’ll continue getting to know the functionality of Elementor Page Builder. To let the everyone see which brands do business with you, you can add a Brands Module to your website. You will need a JetElement plugin and Elementor Page Builder. Expect to learn how to add content, set the number of pages, style the sections, and add links.
If an image is worth a thousand words, a good table can beat a dozen images. Using Elementor, you can create very pretty tables with filters and advanced settings. This video will walk you through the steps of customizing table headers and body and before adding various types of content. Make sure you check out all table styles and choose the prettiest colors.
More to know: How to Create Testimonials Using Elementor Page Builder
There’s one thing people can’t get enough of - it’s social proof. When the testimonials section on your website looks trustworthy and inspiring, it encourages conversions. You will need the JetElements plugin and your Elementor Page builder to achieve that. You will be adding photos, icons, titles, setting the section behavior, adding advanced typography, and backgrounds.
More to know:
In this video, we will be creating pricing tables with WordPress plugins and JetElements add-on. You will learn how to set columns, add titles and other content, add images and icons, etc. Pricing tables allow displaying prices, product characteristics and included/excluded features in a compelling way. You will need to choose the most appropriate design from the color and other design options offered by the addon.
More to know:
You will use the ContactForm7 plugin and JetElements add-on to create contact forms that match the design of your website. The design of the forms should also fit the personality of your brand. You can use premade forms or create the design yourself. Your contact form should be easy to find and make it clear why someone should use it.
Since Facebook has made us all crave stories, likes, and shares, having a timeline on your website is very appropriate. You can use it to visually communicate important information about a company or a project in the About Us section of your website or any other page. This video will explain to you how you can add a personalized timeline to your Elementor-built website.
More to know: How To Create Animated Text With Elementor Builder
The animated text adds life and dynamism to website designs and helps to guide people’s attention to where you want it to be. You will add to the aesthetic and emphasize the brand name or CTA. In this video, you will use JeElements to work with different text designs and animations effects.
Animated flip boxes are super cute and practical. They allow displaying content from both sides while grabbing the viewer's attention by the movement itself. When hovered upon, the flip box behaves in some way and communicates the message in an amusing way. You will learn how to choose the layout, style, and effects of the animated box you create and add different types of content
More to know:
Parallax means that the background elements of a website layout move slower than those closer to the fore. This creates the illusion of depth in a design.On mobile screens, it is important to make sure that parallax doesn’t slow the website down but adds to the dynamism and attractiveness of your layouts. From this video, you will learn how to create Responsive Parallax with JetTricks. You will learn how to create Parallax and adapt it to different screens with ease.
More to know:
One page websites are still trending and animation adds dynamism to them. If you want site visitors to stay longer on your website and look through all the content with a single scroll, this video is for you. Traditionally, you will need Elementor builder and JetElements addon. You will create a few sections in the WordPress template with the Elementor Magic Button and then enable the Scroll Navigation Widget.
More to know: How Do You Create Double Exposure Effect On Your Website Background
Inspired by the latest trends in web design, we will be creating a double exposure effect in this tutorial. You will not have to use any software like Photoshop, just your Elementor Page builder. You will add your images, make them overlap, and then turn them into one double effect element. With this tutorial, the whole process will be as easy as can be.
More to know: How To Add A Background Video To Your Pages With Elementor
Web designers use background videos to help companies communicate their mission, core value, or the brand concept. Overall, videos glue the eyes of visitors to the website and make them stay longer and consume more content. To create a video background, you will need to create a new section with your Elementor builder, customize it a bit, open the Style tab and drop your video to the background.
More to know: A Step-by-Step Guide For Creating Gradient Overlay Using Elementor Blending Modes
Gradients have made a comeback a few years ago. They are not going anywhere from the top positions among web design trends. It is possible to create gradients in Photoshop or similar software but it’s even more easy to create them right in the Elementor page builder. You will select an image and then blend it with a gradient tile. In this video, we will explore the design possibilities of the section style customizations in Elementor templates.
More to know:
Progress bars including circular ones are among the most popular tools to increase website conversions. They allow showing users that a certain task is still on its way to completion. This helps users to concentrate on a task and not drop the task uncompleted. And how about mixing this wonderful tool with gradients? Watch the video to see how you can do it.
More to know: Add Gradient to Progress Bar
The same principles apply to linear progress bars. Again, you need a JetElements addon and your Elementor page builder. The Progress Bar widget is one of the alternative tools offered in the set, you can drop it into your newly created section and style your progress bars as you like with one color, another one, changing angles, border radius, etc.
Most often, blog footers contain copyright notices, social buttons, contacts, and navigation. Headers usually include a menu, an important widget, page tabs, etc. What you will choose to add to your blog headers and footers will become clear after you watch this video and follow our detailed tutorial. Grab your JetElements pack and have fun!
More to know:
When scrolling through your website blog, people will want to be able to see post titles and choose which ones they want to read. Displaying an image with the post title will also help site visitors choose the most interesting content. Have you already found your perfect way to show blog posts on your website? Smart Tiles or Text Ticker, or Video Playlist? There are many more options! In this video, we will be exploring post display options with Elementor Page Builder and the JetBlog.
More to know: How to Create a Posts Carousel Using JetElements Posts Widget
More to know:
Arranging your images of different sizes neatly is something any web designer will have to do. In this tutorial, we will be discussing different gallery layouts and how you can style them with Elementor page builder and JetElements plugin. You will play with the settings like border type and radius, change icons and titles, create overlays, and change alignment.
More to know: How to Create a Masonry Blog Layout with Elementor
Masonry layout is another option for displaying gallery images. It is based on columns but unlike in the justified layout, images in it do not have the same height. The use of space is optimal in this layout and you don’t have to adjust images to make them look aligned. In this video, we will be creating a masonry gallery to your WordPress template with Elementor Page builder.
You will need an image slider when creating a portfolio website or needing to display your projects, images, products, important messages. Most WP templates have images sliders installed but if you want to choose its location yourself, you may need additional plugins like JetElements. The video will show you all the tricks you can do with the Elementor slider widget.
More to know: Image inside Text
Bold headlines and creative typography help make a lasting impression on website viewers. If you want to combine images with letters in your design, grab you JetElements pack and watch this tutorial. Choose the headline widget, drop it into the section, adjust the title and decorative elements, play with the type size, add an image inside. And this is it!
More to know: Image Accordion on WordPress with Elementor
Image accordions are basically sets of images that expand allowing to display a lot of content in a tiny website section. We will take a close look at the process of creating the image accordion using the JetTabs plugin. Drop this widget into the section, choose images and have fun with style presents.
More to know: How to Create an Attractive Image Grid, Masonry or Justify Layout with JetElements Images Layout Widget for Elementor?
We’re all used to having to buy premium themes to be able to change theme colors. Cheap or free themes didn’t seem to give such an opportunity. With Elementor, any theme you want to use will be customizable in terms of colors and typography. You will not have to touch a line of code to do that. Convenient? Indeed.
More to know:
One more proven way to boost website conversions is to set up a countdown timer. This tools will show your site visitors how much time they have until a certain offer expires. In this video, we are using the Elementor Countdown widget. It offers a bunch of customizable designs, so you can create any type of countdown timers with little effort.
More to know: Display Current Weather and Weather Forecast with Elementor
Some websites, especially those dealing with travel and air transportation, would benefit from a widget that displays the current weather forecast. In this video, we will explain how you can get one for your website using Jet Elements and Elementor Page builder. As usual, you will have plenty of design and customization options to create your perfect weather tile.
More to know: Pie Chart Circle Progress on WordPress with Elementor Page Builder
Progress pie charts are the most popular among business websites. Their main aim is to show how far one is on their way to completing some operation. Watch this video how easy it is to add one of these widgets to your website. With jet Elements add-ons, you’ve got a huge range of tools to try out.
More to know: Add Instagram Feed to WordPress Page with Elementor Page Builder
Photos! We need more Instagram images everywhere! Why not add an Instagram feed to your website and offer your site guests a comprehensive social media experience? You can choose which photos to display: those from a specific Instagram account of a certain hashtag. You also choose how your Instagram feed will look like by setting up its design parameters. Here are some more amazing widgets and tools you can add to your website with Elementor page builder.
More to know:
If you are making a website that is supposed to showcase the best works of a designer/creative artist and display their best projects, this tutorial is for you. We will be making a portfolio website using Elementor. The process of customization and adding your content will be made clear to you, and you will be able to follow our steps easily.
Most websites are made to promote and advertise something. The quality of landing pages that lead to these websites from social media and Google ads can make or kill any digital marketing campaign. In this video, you will be making an awesome landing page for a high-tech product in half an hour or less. If you think this is impossible, then start watching this tutorial right now.
This video will explore how you can add an mp3 player of your own creation to your website. With Elementor, anyone can style an audio player, choose all the design elements like backgrounds, gradients, border, and place it anywhere on the website. Adding media to your website with JetElements is as easy as cake.
With Elementor and JetElements you can create a highly customized video player and add it to your WordPress site. Your new player will pull videos from YouTube, Vimeo, or your media library. You will need to go through video options, thumbnail overlay options, and play button parameters. These steps are easy if you follow the instructions offered in this video. Here are some more WordPress tutorials for beginners and experts:
Do you want to see more of our WordPress tutorials youtube? Then subscribe to our channel! These are the themes you’ve seen used in our tutorials:
And don’t forget about the 5% promo code: BecomeThe1
A Step-by-Step Guide For Creating Gradient Overlay Using Elementor Blending Modes
How To Create And Shape Up Your Portfolio With Elementor Builder
How to Create Testimonials Using Elementor Page Builder
How to Create Pricing Tables with Elementor Page Builder
How to Create a Responsive Parallax Scrolling Effect with Elementor
Top 50 WordPress Elementor Business Themes
Subscribe to our newsletter and access exclusive content and offers available only to MonsterPost subscribers.
Leave a Reply
You must be logged in to post a comment.