How to Replicate a Popular Blog Design With the Elementor Pro Single Builder

How to Replicate a Popular Blog Design With the Elementor Pro Single Builder

I was deeee-lighted to be asked by the guys at Elementor to make a guest tutorial video for them. Quite an honour!

They asked me to make a tutorial showing how to replicate a popular site’s blog post design, using the brilliant new Single Builder in Elementor Pro.

Challenge accepted.

In this video for Elementor, watch over my shoulder as I replicate the blog design for a very popular and well-known WordPress hosting company.

This one video is bursting with all kinds of Elementor workflow tips and tricks. You’ll learn exactly how to use the new Single Builder in Elementor Pro… and much much more besides.

Watch the video:

Also check out a ton of other great videos on Elementor’s YouTube channel.

Pssst! Want a free BONUS extra tip we didn’t have time to fit into the main video?

Learn how to make those nifty little callouts embedded within Flywheel’s blog posts with my free BONUS video. Grab it below.

Yes! Please Send My Free BONUS Outtake Lesson

Learn how to make those lovely little callouts embedded within Flywheel’s blog posts. Really easy for clients to manage!

30 thoughts on “How to Replicate a Popular Blog Design With the Elementor Pro Single Builder

  1. Thank You Dave, for introducing me to Elementor. I have been watching your videos, learning and creating a lot recently.
    This new video is really helpful to a lot of learners(especially beginners), this can help them to experience the beauty of creation.
    Thanks again.
    – Joy

  2. Hi Dave,

    Very nice video. I have one question. In the custom css you use the selector “selector” as in

    selector {
    position: absolute;
    top: 0px;
    left: -60px;
    }
    I’ve not seen the actual word “selector” used this way in css before, and my attempts to Google info about it just gets me information about selectors in general…

    Help out a self-taught css-er, here, would you? Thanks!

    • Thanks Eileen. It’s actually special to Elementor. If you add custom CSS in that box (and that box only), you can use the word ‘selector’ as shorthand for: ‘select THIS widget’. Saves having to figure out how to select that widget itself. πŸ™‚

  3. Thank you, Dave! I learned a lot in this video – and like you said at the end, “Phew!” – for me, anyway (not a designer or developer). Good stuff!

  4. Thanks again Dave,
    This will save time and I’ll be able to create a “look” for my Blogs
    You have a nice, easy and informative way of explaining Elementor in your videos.

  5. Great video, I learned a lot!

    One question about the comment widget which is visible at 22:20 in the video. It states that it uses the active theme comments design. For me it’s not clear where elementor starts and the theme ends. In this case it seems to me that you depend on the theme for the comments design or am I wrong?

    • Thanks Leonard. Yes, the Elementor post comments widget uses the same styling as used by your theme. It’s a shame you can’t change those, but I think we’ll see different ‘skins’ for that widget soon.

    • I will do my friend! Made probably 100 videos this last year, but all for paying students. Had a lot of practice. πŸ™‚

      Good to hear from you buddy. I hope all is well.

  6. Thank you Dave for taking the time to show and explain, extremely useful. Another great way to learn is to tear apart an existing layout, so with that in mind, is this layout available as a template to download for us to experiment with?

  7. Hi Dave,
    Absolutely love what you do and HOW you do it.

    Would it be possible to include a JSON file of the blog template?

    thanks

Leave a Comment

Tweet
Share
Share