Elementor Wordpress Theme



  • By
  • Last updated:

Best Theme for Elementor: Paid or Free? Users often believe all premium WordPress themes are better than free ones. In reality, there are a lot of free-of-charge. Jan 13, 2021 Hello is considered as the starter theme for Elementor. It’s officially being used by the Elementor team to develop and test updates for future patches. That’s how you know that a theme is fully compatible with the Elementor page builder. We provide the best Free Elementor WordPress Themes based on a strong template framework, Elementor Free add-on. All Free Elementor themes and Free Elementor Templates design with a modern, fully compatible with latest Elementor Free version, with high-performance loading, easy to install and customize with drag-drop layout. As the name itself suggests, Podcastr has been specifically designed to work in tandem with Elementor WordPress Theme in order to deliver the best podcast website, ever! The theme is also highly customizable, fast, and lightweight. Even better, Podcaster is the Ultimate Podcast WordPress Theme for Elementor. A theme builder essentially lets you “build” some or all of your WordPress theme using some type of editor (no code required). For example, Elementor Theme Builder lets you design your theme using a visual, drag-and-drop interface. You can either use the theme builder to design 100% of your theme.

Elementor is undoubtedly one of the best WordPress page builders on the market (if you haven’t already, check out our full review). In fact, I rank it right alongside Divi (from Elegant Themes) as one of the two best page builders available for WordPress.

It features a fantastic front-end page builder that’s easy to use and includes hundreds of high-quality content widgets, pre-made page templates and blocks. Elementor is supported well by third-party developers too, so it’s easy to extend functionality.

As with all WordPress plugins, page builders, such as Elementor, need to work in harmony with your WordPress theme. Unfortunately, some WordPress themes conflict with page builders and don’t offer full-width page templates or support Elementor’s excellent theme builder.

So, to help you to get the most from Elementor, we’ve prepared a list of the top ten best WordPress themes for this plugin.

1. Hello Theme — FREE

Hello is a simple WordPress theme that was developed by the creators of Elementor.

It acts as a blank canvas — there’s no settings page and no additional options available in the WordPress theme customiser either.

The lack of theme customisation options may not suit everyone, but this approach means Elementor can be used to control all aspects of your website design. It also means Hello is one of the fastest WordPress designs available today.

The theme can be downloaded free of charge from WordPress.org.

If you’re looking to use Elementor to control every aspect of your website, Hello should be top of your list.

2. OceanWP — FREE/$39-Plus

OceanWP is a flexible free WordPress theme that comes with 13 website designs, and has been optimised for drag-and-drop page builders such as Elementor.

All design options can be found within the WordPress theme customiser, and there’s great support for WooCommerce. The core version of the plugin is quite basic, but eight plugin extensions are available to expand functionality.

The core extensions bundle retails from only $39, and upgrading gives you access to 13 premium extensions and a further 60 website designs.

If you want to use OceanWP properly, I recommend upgrading, as all of the included free website designs use premium extensions to function correctly.

Best elementor wordpress themes

Check out our full review of OceanWP to learn more about what this WordPress theme offers.

3. Astra — FREE/$59-Plus

Like OceanWP, Astra was created with WordPress page builders in mind.

It’s a user-friendly solution that lets you change your website design through the WordPress theme customiser.

Using the Starter Templates plugin, you can import over a hundred website designs that were created using Elementor, Beaver Builder, Brizy and the WordPress block editor.

While Astra is free to download, if you upgrade to Astra Pro you’ll be able to change page headers, adjust colors, add footer widgets and more.

Astra Pro retails from $59. However, you can only gain access to 55 additional website designs if you select one of their more expensive agency licenses.

Read our full review of Astra to learn more about what it can do.

I also encourage you to check out our Astra showcase and our comparisons with OceanWP and Divi.

4. Layers for Elementor — FREE

Layers for Elementor was originally an ‘All-In-One’ WordPress theme that featured its own unique page builder, but, in 2019, the company was sold to Elementor.

All of the features that were previously only available in Layers Pro have now been now built in to Layers free of charge.

Like Elementor’s Hello theme, Layers is a minimal solution that complements Elementor well — however, it’s not simply a blank canvas.

Layers does offer many useful styling options within the WordPress theme customiser, including header arrangement options, header styling, a sticky header, menu styling and more.

If you’re looking for a minimal WordPress theme with support for the WordPress theme customiser, give Layers a try.

5. Jupiter X — $59

Jupiter X is a premium multipurpose WordPress theme that comes with more than 320 pre-made website designs.

The whole WordPress theme was designed around Elementor, adding new features to its page builder, such as a form builder, visual effects and a title bar customiser.

Jupiter X adds many new content widgets too and, as you’d expect, each pre-made website design was created using Elementor’s page builder.

Jupiter X retails at $59 from ThemeForest, and comes with lifetime updates and six months of support.

6. Phlox — FREE/$39

Phlox is a user-friendly WordPress theme that’s built upon Elementor — but it also adds hundreds of customisation options to the WordPress theme customiser to help you to change how your website is styled and structured.

Wordpress

The free version of Phlox comes with 19 high-quality pre-made website designs, and adds 40 new content widgets to Elementor.

Phlox Pro is available from ThemeForest for only $39.

Upgrading will give you access to more than a hundred designs and around $250 of premium plugins. It also adds new features such as white label branding, a unique header and footer builder and unlimited footer and header layouts.

Phlox is easy to recommend as the developers have been generous with features in the free version, and priced the full version competitively.

7. Hestia — FREE/$69-Plus

Hestia has been one of ThemeIsle’s flagship WordPress themes for a long time.

It has a corporate style design that can be adapted for many different websites. From the ground up, the theme has been created to work with the WordPress block editor, Elementor and other page builders, such as Brizy, Beaver Builder, Visual Composer, SiteOrigin and Divi Builder.

The free version of Hestia comes with five website designs, and these can be installed via the Hestia options page, but all website customisations take place within the WordPress theme customiser.

Hestia Pro retails from $69 a year, and adds options for reordering sections on the home page, a header slider, customisable colors and more. If you upgrade to the $99 business license, four additional website designs are made available.

I recommend checking it out.

8. GeneratePress — FREE/$49.95

GeneratePress is a lightweight WordPress theme that works with all major WordPress page builders.

The free version of GeneratePress has many useful customisation options within the WordPress theme customiser, but I recommend upgrading to Generate Pro, as it unlocks 14 premium modules.

The site library module adds dozens of demo website designs for the WordPress block editor, Elementor and Beaver Builder. Generate Pro also adds more options for customising colors, typography, menus, backgrounds, sections and more.

I use the premium version of GeneratePress on my own blog; its minimal designs may not appeal to everyone, but I love its simplicity and how quickly pages load.

9. Bridge — $59

Another ThemeForest WordPress theme that has been optimised for Elementor is Bridge.

Bridge comes packaged with more than 495 beautiful pre-made website designs and layouts for headers, blogs, online shops, portfolios and more.

Free Wordpress Theme

The theme also adds more than 75 unique content widgets to Elementor to expand what you can do with the page builder.

Bridge retails at $59, which is highly competitive when you consider the number of designs and features it makes available to you.

10. Shoptimizer — $99

My last recommendation is WooCommerce WordPress theme Shoptimizer.

Developed by CommerceGurus, Shoptimizer adds many features to help shop owners increase sales and leads — and it also offers auto-complete for searches, mega menus and pre-designed layouts.

All content pages have been designed around Elementor, which gives you greater control over how your shop and other important pages look.

Typography, colors and other website design customisations are all handled through the WordPress theme customiser.

Shoptimizer is available for $99, but is frequently sold at a discount in sales. It’s a great option if you want to create an online shop using WooCommerce and Elementor.

Final Thoughts

All of the WordPress themes in this article have been optimised for page builders, but which one should you choose for your website?

If you want to use Elementor to control every aspect of your website’s design, I recommend Hello, as it makes every page on your website a blank canvas for Elementor’s page builder.

Layers and GeneratePress are also great minimal themes. In contrast to Hello, they also give you many options within the WordPress theme customiser to help to style your website.

OceanWP, Astra and Hestia have been designed with all page builders in mind and include professional pre-made website designs.

If you want closer integration with Elementor, I’d recommend checking out Jupiter X, Plox and Bridge, as they’ve been built specifically for Elementor. This means they add new content widgets, layouts and other features directly into the Elementor page builder.

All of these themes work well with WooCommerce, and many add features for the eCommerce plugin. However, I recommend Shoptimizer if you’re building an online shop, as it adds many conversion and optimisation features that you’ll not find elsewhere.

Which theme do you view as the best for Elementor? Thoughts?

TOP DEALS

Get 4-months off Basic Subscriptions!

Comments (policy)

Out of the box, WordPress food themes (like Gourmand) are visually appealing, feature-rich, and incredibly flexible. You can expect to find all sorts of sections, elements, and widgets on it such as featured recipes, opt-in forms, author boxes, the latest recipes, and much more.

However, if you’re looking for a custom layout with different sections and elements or if you want to rearrange the elements that appear on your page, you can use a page builder to customize sections.

In this tutorial, we’ll show you how you can use Gourmand with Elementor Pro to customize sections and create new sections. By the time you’re done reading, you’ll know exactly how to customize the Gourmand theme to fit your preferences.

Elementor Pro’s Theme Builder

Using Elementor Pro’s Theme Builder, you can customize the Gourmand theme in a visual way. This includes headers, footers, single post pages, archive pages, and just about any other area of your WordPress website.

Here’s how it works:

You start by choosing a template type. For example, it can be a header, footer, single post page, or archive page. Once that’s done, the next step is to start building the framework of your page using dynamic content. Finally, you can set conditions using Elementor Pro to determine where your template should be applied.

With the Gourmand theme, you can customize sections (posts, pages, and archives) using Elementor Pro’s Theme Builder or build new ones. It all depends on your specific needs.

How to Customize Sections in a WPZOOM Theme Using Elementor Pro

Elementor wordpress theme

Here, we’ll show you how to customize sections in a WPZOOM theme using the Elementor Pro page builder. For this tutorial, we’ll assume you already have the Gourmand theme and Elementor Pro installed on your WordPress website.

If you’re not familiar with Elementor, be sure to check out our Introduction to Elementor guide to get an idea of what it is and what you can do with it.

Layout

Let’s say you want to change the layout of the single post page. Start by opening up the post in Elementor.

If you run a food blog, you might have some images of foods, some text, a recipe, and social sharing buttons on your single post page.

Using Elementor Pro, you can change different aspects of the single post page’s layout settings.

These include the:

  • Content Width. You can choose between Boxed or Full Width. If you go with Boxed, you can use the slider to set your width
  • Columns Gap. This is the gap between columns. You can leave this to default if your single posts are structured as single columns.
  • Height. You can choose between Fit to Screen and Min Height.
  • Vertical Align. This option lets you set the section content’s vertical alignment to top, middle, bottom, space between, space around, and space evenly.
  • Overflow. Lets you select how to handle content that overflows its container. You can allow it or hide it.
  • Stretch Section. This option forces the section to stretch to the full width of the page.
  • HTML Tag. Use this to set an HTML tag for your section.

In addition to this, you can also change the order of elements. Elementor is a visual, drag-and-drop page builder which means you can reorder elements simply by dragging and dropping them into place.

So, for example, if you wanted to bring the social share buttons to the top of the post, you would simply drag the social share buttons element to the top.

Elementor also makes it easy to add new elements and sections to your single post page. All you have to do is click the (+) icon to add a new section, select its structure, and drag-and-drop the widget into it.

For example, you can create an opt-in form that lets readers subscribe to your email newsletter. All you have to do is drag-and-drop the WPForms widget in the section and add your form to it. Or you might consider adding a related posts widget to encourage visitors to check out similar recipes.

Moreover, you can even create custom layouts using Gourmand as a base. For example, in order to create a custom homepage layout, go to Templates → Theme Builder → Add New. Choose the Page template type and name it (e.g. Homepage). On the next screen, click on the General Settings icon and choose the Elementor Full Width page template.

With Elementor Pro, you will have access to premium modules that can be used across the website. The elements are categorized in Single, Basic, Pro, General, Site, WordPress. You can even combine Elementor modules with default WordPress and theme widgets.

Play around and explore different elements that will make your website attractive for your readers. Here’s an example that you can easily achieve with Gourmand:

After you’re done with creating your template, make sure to publish it. This way, it will be available in Theme Builder → Templates. Here, each template will also be assigned with a shortcode. The shortcode of the template can be pasted on a new blank page. This way, after publishing, the layout created with Elementor’s Theme Builder, will be displayed on that page. Make sure to also assign the page as a static front page in Settings → Reading.

Style

Using Elementor Pro, you can also change the style of each section on your posts, pages, and archives. This includes:

  • Background. You can choose between classic, gradient, video background, or image slideshow.
  • Background Overlay. The background overlay option lets you set a background type and blend mode for the overlay.
  • Border. You can configure these settings to set a border type and radius. It also lets you add a box-shadow to the section.
  • Shape Divider. The shape divider option is particularly useful if you have lengthy pages. You can set the type, color, height, and width of the divider. In addition to this, you can also flip it and bring it to the front so it’s in front of other page elements.
  • Typography. This option lets you set the typography colors for the section.

So, let’s say you want to style the opt-in form we added to the single post page. To get started, click on the section.

You’ll notice the different section settings appear in the column on the left. Click on the Style tab to configure the different options.

Advanced Options

With Elementor Pro, you can add advanced options to sections in posts, pages, and archives. Here, we’ll show you how you can add motion effects and custom CSS.

How To Update Your Elementor Wordpress Theme

To add a motion effect, click on the section you want to customize and head over to the Advanced tab and click on Motion Effects. There are different options to choose from and you can combine different options for a truly unique effect.

Enable Scrolling Effects and play around with the different effects to get a feel of what you can do with it. For example, if you use the Scale option set to Scale Down, your motion effect might look something like this for a visitor:

Elementor Wordpress Theme

And, if you’d like to add custom code to your page’s sections, you can use the Custom CSS option. All you have to do is enter the custom CSS code in the box and update the page.

Customize Sections in WPZOOM Themes Today

You can use the Elementor Pro’s Theme Builder to easily and quickly customize sections (posts, pages, and archives) in any WPZOOM theme. You can customize existing sections and add new ones.

Wordpress Theme White

Elementor Wordpress Theme

It lets you modify each section’s layout and style, and gives you plenty of advanced options that you can use to add motion effects or custom CSS. We showed you how to customize sections in Gourmand using Elementor Pro. Hopefully, you’re in a good position now to take the next steps.

Ready to start customizing your food blog? Get Gourmand today! Also, be sure to check out our other WordPress food themes.

Related Posts





Comments are closed.