Elementor – WordPress Page Builder Tutorial (2018)

WordPress page builders are all the rage and Elementor is by far leading the way in innovation.

If you are wanting to get started using Elementor, then this tutorial is perfect for you. It covers all the Elementor settings and how to build pages using the WordPress page builder.


  1. Les Osborne says:

    I’ve watched a number of your tutorials and they are have been very educational. I am trying to find a tutorial for the Pro Text widget. In the style tab there is an option to add columns. This is a great option, especially for mobile browsers where you want to keep multiple columns as oppose to running them one after the other vertically. I have figured out how to set these up but I am still looking for instructions about Break Points. If I add 3 columns and put 3 identical contents in, they show as 3 good columns. If one column has more text, there is an auto expansion into the next column. This feature is great for mobiles. Is there any tutorial that talks about this feature and how to set the vertical height or break points? You can see mine at tiger721.com The second from the bottom has two section that use this feature. Any help is appreciated. This is a great feature to tell people about.

  2. Hey Adam, thank you for your amazing work!
    I would like to know your preferences concerning the customization of the header-footer, the fonts, and the colors when working with Astra theme (with the Pro addon) and Elementor Pro.
    1. Which one do you think is better to use in order to achieve the best result?
    2. Which one helps in making the website load faster?
    3. Would you recommend setting the fonts with Astra or Elementor (I saw in your video that you use Elementor, but how does this affect the page speed?
    4. Any other suggestions would be highly appreciated!
    By the way, I am sure that all of your subscribers would appreciate watching a video on this topic (fonts, colors, and headers… Astra or Elementor?)
    Thank you,

    1. I prefer to do everything in the theme that I’m using. However, there’s a good chance that I might make a custom header using Elementor and a custom footer using Elementor Pro.

  3. Surjeet Singh says:

    How to apply Christmas snow effects in elementor page builder

  4. Kevin Grover says:

    Hi, I am wondering why my default header template comes with the hamburger menu icon that I cannot get rid of in the top right of my screen, it is making it impossible for me to setup my menus in the top header, Please help me get rid of this hamburger !

    Thank You

    Kevin Grover

    1. That sounds like a theme setting. You could reach out to the theme developer or if you have Elementor Pro, build your header with that.

  5. Andrew Lian says:

    Follow up to my earlier message. I think I solved it. I used a negative margin setting on the section. I thought I might report this. Sorry for any additional work for you. I have to say that I love your work and have started following it, especially the LifterLMS and related stuff. Thank you Adam.

    1. Yea this is exactly why they released the new Navigator feature, to prevent issues like this.

      1. Andrew Lian says:

        Thank you so much! Love your videos and good advice.

  6. Andrew Lian says:

    I am not sure if you can help but I need a bit of help. I am using Elementor free version. I would like to move the first section on the front page higher up the page but am unable to do so (cannot find the right settings). D you have any advice?

    Thanks so much

  7. Hello Adam, amazing tutorial I follow all your youtube videos. I have a question; your website i notice how your top menu and main menu join when i view it on mobile, do you minding telling us if that can be done with elementor custom template header.

    1. Yea that is a feature in the Astra Theme. One of the reasons I love it and recommend it so much. You may want to ask your theme developer to build the same feature.

      1. yeah, i use oceanwp … i was able to figure it out Adam. thanks

  8. Firstly WP Crafter is superb. I agree that Elementor Free & Pro are very good especially for making web pages mobile responsive. However one exception is – the Accordion Widget. This VERY VITAL ‘piece of equipment’ for any website is utterly useless. #1 : The first item is always open by default on landing which is stupid. The idea of an Accordion is to hide text so the web page loads faster. This problem is mentioned time after time on forums & reviews but Elementor won’t resolve it. [I have rectified this with complicated javascript which shouldn’t be necessary if Elementor is supposed to be the ‘bees-knees’.] #2 : Even worse is that with long item articles when a visitor finishes reading say Accordion Item 1 & clicks on Accordion Item 2, Item 2 opens at the end so the reader has to scroll back to the top to start. This is barmy, like landing on a web page & it opens at the bottom so you would have to scroll back up. Since the Accordion is available in the free version check it out first to see if its ‘limitations’ fit with your ‘accordion plan’. If yes then Elementor Free & Pro are absolutely brilliant.

    1. There is a way around this. There is a free plugin that I made a review on recently, Granular Controls for Elementor, that has a setting to make them all collapsed by default.

      1. Thanks for your time on this. I will check out your recommendation. I really do appreciate your reply. Kind regards.

  9. Hey Adam,

    What plugin do you use to make YouTube sticky videos?

Leave a Reply

Your email address will not be published.