Elementor I have written about it many times on the blog and invariably since its launch I recommend it both to my clients and during training courses. Not only does it allow you to quickly and very conveniently manage the content of your website, but it also allows you to quickly create really visually attractive websites.

This is currently my opinion the best page builder for WordPress and continues to strengthen its leadership position with its growing capabilities and PRO version.

You can read about Elementor in its basic form, for example, in the article Elementor, the website you control. See also the tag Elementor. Therefore, I will not discuss the basics, but focus on the key capabilities of the PRO version that make this tool capable of replacing virtually any theme.

Some time ago Elementor was basically used as a tool to manage the content of individual pages and articles. What we could do was to install a theme we liked and with the help of Elementor we could arrange the content as if it was made of building blocks. It allowed, and still allows, to create virtually any arrangement of individual objects within a given sub-page or article. It works great!

But note... going back in time, starting with Elementor Pro version 2.0 we can not only do what I have mentioned, but also build our own page layout, so create page header, footer, define default appearance for articles or archives. This was an incredible step forward, because it made us almost completely independent of ready-made themes, which usually have a more or less ossified structure. We are independent of the standards they impose and that is something sensational!

You will find this solution only in the Pro versionwhich costs $49 for a single site. You can find the Pro version at www.elementor.com

But to the point. Let's take a look at how the functions that allow you to build your own template work.

How does the theme builder work?

As an example, I'll take a clean installation of WP + Elementor + Elementor Pro + the free OceanWP theme. I could just as well use the Elementor theme that is dedicated to the PRO version with the nice name Hello. You can find this theme here. Meanwhile, I have a "barebones" site that looks like this:

Clean installation of WP and OceanWP

It's not crazy, is it? Indeed, installing a fresh theme usually doesn't add anything interesting. In the case of OceanWP, the theme is not bad and offers you a huge amount of configuration options in the free version and works well with Elementor.

Where we see the inscription above Want to publish your first entry?... is an area which can be freely composed in Elementor. However, in the free version we have no influence on how the header and footer of the page will look like. These areas of the page, when working with the free Elementor, depend on the template we have chosen.

Of course, you can use additional plugins to create header and footer, but this is only the tip of the iceberg of possibilities we get with Elementor PRO, and besides, taking care of the site also means minimising the number of plugins installed.

In the free Elementor you can create a header or footer as a standard section, but to place it where you want you have to add it manually to every subpage or article on your website. It is not very comfortable, especially when you will have to change something in those places after some time 馃檪 - it's not easy.

This disability is unfortunately quite troublesome and not very practical, especially if our website will have a large number of subpages, not to mention a section with articles (Blog). Elementor Pro allows you to create a header and footer section that will automatically be displayed on all pages of your site.

To do what I am writing about, we need to use the tool Theme Builder. To create a new header, go to Templates > Theme Builder

Where to click to launch Theme Builder - Elementor PRO

We don't have any template created yet so the only option we have is to add one. This is what I do by clicking on the "Add new template" button. Next, I select the type of template from the list. I want to create a header first, so according to my intentions I choose this option:

Choice of template type

In the name field, I enter something that will identify the template in the list (don't worry, this name won't be displayed on the page) and click on the create template button.

theme builder03

As soon as you initiate the construction of a header, sample, ready-made graphic proposals of its arrangement will appear. At the moment there are 31 of them, but you can modify each of them individually, or if you prefer, you can create the whole header yourself from scratch.

elementor pro library

If this number of ready-made suggestions is not enough for you, be sure to check out this article: "2000+ free templates for Elementor". With Elementor PRO you have access to a huge number of templates 馃檪 .

Ok to use a header template that initially suits me (I can further customise it as I wish) I click on it and insert it into the template.

By default, the scheme I have chosen uses two widgets. One is the logo widget and the other is the widget responsible for displaying the menu.

Widgets in the header

As you can see, the area that is responsible for displaying the logo and also the menu does not display anything interesting. This is due to the fact that I have not defined either a logo or a menu for the page. So, if I create a menu the matter will look different 馃檪

Header with correctly displayed menu

Let's assume that we have already arranged the header properly. As I mentioned, you can change literally everything in it, from layout to colours, you can add more widgets responsible for displaying content, buttons, icons etc...

To save my work and publish the new header at the same time, all I have to do is click on the Publish button, which I find by default in the bottom left corner of the browser window, at the very bottom of the Elementor widget bar.

We start publishing

It doesn't end there though, because now it will be the most interesting 馃檪

I can decide where the header should be displayed. In other words, whether I want to override the default theme header on the whole site or maybe only in selected areas of the site.

Conditions for displaying the header

This is where I will pause for a moment, as this is an amazing feature of Elementor PRO.

Usually it is the case that the header is common, i.e. the same on every page and subpage of our website. However, there are times when we may want to introduce a little more variety to our site.

Let's assume that we have a blog on the website that covers several areas of our business. Each of these areas is characterised by something. We can come up with an idea to make the section that presents articles on a given topic stand out from the rest, for example with a distinctive graphic accent in the header, maybe a different colour scheme etc...

With Elementor PRO I can put this idea into practice and not have to touch a single line of code!

Display conditions

Note that the display conditions can be expanded. In our example above, the configuration would make this header scheme display across the site, except for entries assigned to a selected category, and on a page displaying a 404 error (page does not exist). Revelation 馃檪

Once I have the display conditions defined I save the changes and can go to the page to see if the default theme header has been replaced. It has.

I check the header

So we will do exactly the same procedure with the footer of the page. The procedure is identical. The only difference is that at the stage of defining the template type I choose the footer instead of the header.

Type of template footer

I have a few more ready-made templates for the footer and, just like in the case of the header, I can freely model the footer to my own needs.

theme builder12

I choose a template, customise it, save it and specify the display conditions - all exactly the same as for the header. Finally, I check the effect, which can look like below or completely different, because you will surely have your own idea 馃檪

Example of footer

The old header and footer are gone. What remains now is to work with the content of individual pages and subpages and here we can also use Elementor Pro. 

So, you might ask, is there any point in investing in themes in this situation? I will answer yes. A good theme well optimized for Elementor is worth investing in because it will add even more wind in the sails of your website. I recommend themes such as Astra, Kadence, Blocks i GeneratePress. You will read about them in the article: Best WordPress Themes.

These are not the only unique opportunities Elementor Pro

Other great features include form builder whether popup generatorThe templates can be used in hundreds of different ways. It also allows you to place created templates using shortcodes anywhere on the article or page. If you work with Gutenberg editor, you can easily inject blocks from Elementor PRO into it. It also offers great visual effects and many other small features that make it a powerful tool.

However, you have to learn to work with it and use its potential. Elementor is developing very dynamically. For JZS readers there is a special Elementor PRO course on the PoznajWP platform. You are welcome!

Share

See also

Bricks 1.2

Bricks Builder 1.2

In the latest version of Bricks, that young page builder for WordPress, there is finally an announced change, with the introduction of containers. I don't mean shipping containers,

Free information on JZS news

I invite you to become a subscriber! Thousands of readers already subscribe to news from JZS.

You can unsubscribe at any time. Your address is safe here.

Featured LifeTime Offers!

Virusdie - Lifetime
Virusdie

An excellent tool to protect your website from attacks, as well as a tool...

Labrika

Content optimisation based on competition in the TOP10, position monitoring,...

Play.ht lifetime
Play.ht

Turn your website publications into high quality audio recordings.

41 Comments

  1. Thank you Krzysztof. However, I am wondering how to deal with clients for whom I am making a site based on elementor pro. The license is on me then I understand that once a year I issue an invoice for renewal of elementor pro? Something like server and domain renewal? Can you explain how to deal with this?

    1. First of all, they need to be aware that this is a paid extension and you incur a cost each year for this. You can agree with them on some small fee that will allow you to keep the plugin every year, or simply say that they get the plugin from you free for a year, and after a year to use it they should buy their own license for that $49. There's no lurking here. Such tools are simply paid for and that's it.
      If you want something that will generate low cost or even zero cost if you use the Lifetime offer, take a look at this wizard: Zion Builder or Bricks. Both very cool 馃檪 .

  2. Elementor resembles an old free word processor in its handling. You can't edit or create entries comfortably, justify text etc.
    In the 21st century, it would be appropriate to refine such a basic element.

  3. And what does the information for one year mean for the price of elementor pro? As long as I maintain the site, every year I have to make this payment?

    1. There is no obligation. If you don't renew your license you won't have access to further plugin updates, manufacturer support or PRO templates, but what you have now will work. When you buy any plugin, theme etc. you buy a license for a specific time - usually a year. The exceptions are lifetime offers, which can be found with some developers, but as you can guess they are correspondingly more expensive.

      1. Hello Question. Suppose I am making a client a website on elementora pro version. Everything works for a year. The client manages the site himself. However, after a year he does not pay for the pro version. What then? Does he still have the pro version or does it automatically change into the free version? Does everything still work? Just no updates?

        1. Hi Przemek. There used to be no access to updates only, now there is no access to the template library either and pro widgets may be disabled, although the ones you already used should still work. You can easily check this. Activate the Elementor license arrange the pro widgets on the page and then remove the license from the page. You will then see what the effect is.

  4. I would like to change over 400 entries by adding a template created in Elementor to them. Is there any way to automate this?

    1. If you have Elementor PRO then you create a template for the entries, save and they all start using it.

  5. Hello Is it still worth learning to create your own templates for Wordpress ? To learn Html/Css/Php since there is Elementor ?

    1. Damian, this knowledge will allow you to go deeper into non-standard solutions or at least better understand certain mechanisms (e.g. technical SEO). However, it is not necessary or required knowledge to create an attractive website, shop or blog on your own.

  6. Very good article. I am just wondering about Elementor or WPBakery to create pages for clients. Does WPBakery also come with a license for X pages? Just like Elementor in the Pro 1000 version?

    1. I don't personally have the best experience with this builder (WPBakery is mentioned) so I don't recommend it. Regarding WPBakery licenses, one purchase (license) = one site.

  7. I am completely fresh so my question may sound a bit strange.
    To install Elementor and then Elementor Pro, do I need to get rid of Gutenberg i.e. install the classic editor plugin after installing the current WP version on the server?

    1. No Charles. You don't have to uninstall anything. You can then decide if you want to work with a particular subpage, article, etc... using Gutenberg or Elementor.

  8. I have disappeared the Edit button in Elementor in the free version.The switch in the settings is on. WP 5 and gutenberg.How to restore it? Pages have the ability to edit with a link, but the button is not there

    1. I am just beginning to try it.

      1. Yes, I also removed Elementor and reinstalled and same thing. Before that I cleaned wordpress, Firefox and Google

        1. I don't know if this is it, but I turned off gutenberg, cleared the cache and turned it on and the button appeared. I didn't know they were biting like that

          1. Krzysztof Wojteczko says:

            Elementor and Gutenberg don't bite, something somewhere must have failed to surprise.

          2. was adding a new page in wp and as usual the selection appeared, and meanwhile nothing on all the pages created so far, and it was a good pair with the free elementor..I do not know what was, I tried with plugins and it surprised, windows

  9. Elementor is great but I'm having a rather annoying problem because the comparision image plugin won't display properly at all. It's an after befor plugin and the images are of different sizes and d... Could you help?

    1. You didn't write what it means that it doesn't want to display correctly. As I understand it, it doesn't display images, or displays them in a way you don't like. I also don't know what specific plug-in you are using, and there are many of them. First of all, in case of such plug-ins, it is best if the images have the same size. It is also possible that there is a conflict with another extension or theme you are using. Try disabling plugins, switching to another theme and see if that helps. This way you will find the culprit.

  10. I have a bit of a problem with Elementor. It is great - fact. For my own site/shop - I can renew the license every year. But the problem is when you want to use Elementor Pro for client deployments. Clients don't want to pay a fixed fee every year and if someone implements something on Elementor Pro and doesn't inform them about it, it exposes the client to security problems if a bug is found in the plugin which is fixed in an update, which the client won't get because they don't have a renewed licence. That's why DIVI solved it differently - and it's better 馃檨

    1. DIVI has a Lifetime license which Elementor, at least for now, does not offer. It would be nice if such an option would appear one day 馃檪 On the other hand, developers who see the potential of Elementor and the incredible convenience in working with this tool that the end users (their clients) experience, simply renew their license year after year and there is no problem. If a client ends up with a not-so-responsible designer, even if they don't renew their licence the world doesn't collapse. The websites are still working but there is no access to new versions of Elementor PRO.

    2. Bartek Trejka says:

      You don't need to buy an Elementor Pro license, as there are plugins / extensions on the market that give you more features than Elementor Pro and come with lifetime / developer free update licenses. I myself have an Elementor Pro license and only use it on a few client sites. I use the Elementor Pro add-ons more.

      1. It all depends on your needs. Elementor PRO is, so to speak, a native solution coming from its manufacturer, so the code quality is also predictable, which is not insignificant. A lot of external extensions are widgets. Using Elementor PRO you can feed your project with theme builder or dynamic data which many others lack. Of course you can use for example Crocoblock and their JetEngine extension, but as I wrote it is always an individual choice and should be made consciously. It's not an art to stuff Elementor and WP itself with dozens of extensions, the question is why 馃檪 .

        1. Bartek Trejka says:

          The problem is that customers do not want to pay for future updates. They want to buy a 'tool' with perpetual updates. You have to pay every year for Elementor Pro, so I had to find another solution. Only the stick has two ends the customer only wants to pay once and then not update....

  11. I am wondering if you have several licenses that will expire and you want to make a new site in PRO - do you have to refresh all the licenses or can you just buy one - a new one ?

    1. Tomek Mr贸z says:

      No one will tell you. Article created only probably as a paid entry, or author from reflnk has cash for your purchase.

      1. Tom, anyone can answer the questions asked in the comments, not just me, but you too. It's a pity that given the chance you didn't give a concrete answer. But you could have 馃檪 Seriously, if someone has a question addressed directly to me, you can always send it by e-mail (contact in the footer).

        As for Archis' question, a single license allows you to install the PRO extension on one site, but licenses for more sites are available. You have the choice between a single site license, a three site license or an unlimited license. So if you have more than 3 pages, it will probably make more sense to invest in the unlimited version, especially if more pages will be added on the way. It is a matter of individual calculation.

        1. Tomek Mr贸z says:

          The information about the sponsored article is still missing. But that's a detail, isn't it ?

          1. Nothing is missing Tom. This is not a sponsored article.

  12. Janusz Kami艅ski says:

    Elementor is a very cool plugin 馃槈

  13. I've started playing with visual composer, but it probably works the same as elementor. I have a blog on the home page that I can't edit. Do you know how to replace the main page (blog) with the page created in the wizard? Or am I doing something wrong?

    1. Krzysztof Wojteczko says:

      Yes, VC is also a builder but with a longer history than Elementor. Go to Settings > Reading, select Static page and choose from the list the page you want to be the main page. Save changes and this should solve the problem.

        1. Adrian you can do pretty much whatever you want in Elementor. If you want to place buttons next to each other making a kind of menu, it's possible.

Leave a Reply

Your email address will not be published. Required fields are marked *