How To Make Any WordPress Theme Compatible With Elementor

Updated: January 2, 2018
Filed Under:

Share on facebook
Facebook
Share on twitter
Twitter
Share on reddit
Reddit
Share on linkedin
LinkedIn
Share on email
Email
elementor_logo
Cost

Free to $199

Over 400k people love and use Elementor on their website because it's the best page builder for WordPress. Also the fact that it is free might have something to do with it 🙂

The problem is not all themes are able to give you those beautiful full-width rows and remove the page title by default.

This need prompted me to contact Brainstorm Force, my favorite WordPress developer, and ask them to solve this problem.

The accepted and created this amazing free plugin.

Elementor


How To Make Any WordPress Theme Compatible With Elementor

Welcome back to another video my name is Adam
from WPCrafter.com where I make videos about

WordPress for non-techies just like me and
in this video on the show you how you can

get Elementor a very popular page builder
to work with anything pretty much so what

happens typically when you want to use a page
builder on a theme if there isn’t some direct

integration or some specific integration you
don’t get that beautiful fullwidth row and

you there’s extra things added to pages like
a title and margins and padding’s and it could

be a bit annoying but there is a new solution
that just came out to that works with virtually

any page builder and virtually any theme and
there is direct Elementor integration with

it and it’s pretty amazing so this is the
problem that you run into so I’ve got a page

right here created and I want to use Elementor
with it so you just create your page and then

you click on edit with Elementor and this
is what happens were going to be contained

into this area so if I click on add a new
template just to make this quick and simple

and here let me choose not that template because
that’s a pro template I’m just go ahead include

choose this one click on insert this is what
happens when you want to use Elementor with

a theme that doesn’t have specific support
for Elementor there’s going to be this frame

around your neck to get the full with aspect
of Elementor see right here I’m stuck with

my page title I’ve got all this space here
in this space off to the left into the right

and this is not at all leveraging the beauty
of what you can create with Elementor so looks

fine when the edges of the container of the
same color as a content right here but these

pictures it just doesn’t look right that’s
not how it’s supposed to look well the good

news is is there is a solution for this so
let me get out of this him to go ahead and

click on save and then I’m in a go back into
the dashboard and show you how you can get

Elementor to work with virtually any theme
that you wanted to work with so I’m to go

to plug-ins and there’s a new plug-in that
just came out it’s called a full with page

templates and actually I had a part to play
in this plug-in I wanted a plug-in that I

can use any page builder with any theme and
I got together with someone that is an amazing

developer they have several very successful
plug-ins they sold hundreds of thousands of

copies of their plug-ins and they said you
know what Adam will make this plug-in will

give it away for free and it’s right here
it’s called full with page templates for any

theme and page builder so just go ahead and
download install and activate this plug-in

so now what happens is when you go to create
a page you can have this new option available

right here so where it’s going to say templates
and when you go on the drop-down there’s these

three new options goal with full with no header
footer and no sidebar so full with is going

to make it look how I intended on that page
the title is going to be removed it’s going

to be stretched full with their skin to be
no margins or anything like that the next

one will also do that but it will remove the
header and the footer so it’s ideal for landing

pages now you can create beautiful landing
pages for any theme using Elementor and last

is you there’s going to be no sidebar so this
will give you great integration now there

are other ways of doing this by the way but
there’s nothing as simple as this it’s three

clicks and you’ve got the perfect integration
so for example on my website I use a page

builder but I had to have some custom CSS
written that I have to add to each and every

page it was complicated getting that to work
and there’s just so many lines of code and

there are some other solutions to that require
40 different options in your clicking around

the find the right combo to get it to work
this is the perfect three click solution to

integrate Elementor with essentially any theme
so let me show your miniatures this fullwidth

template I want to click on updates and then
I’m in to go to that page I created so actually

let me refresh as you can see the perfect
integration so now you see my title is gone

you see that margin appear is gone now the
image stretch perk stretches perfectly from

left to right and it’s from top to bottom
and then you could see at the bottom here

the end of my Elementor page meets perfectly
with the footer of the theme so if I didn’t

want the header and the footer I would’ve
chosen no header footer like that let me do

an update and I’ll do a refresh to show you
that so right now you see I have this header

I just refresh the page and that header is
gone so this is ideal for any kind of landing

page that you want and I scrolled all the
way down to my footer is gone as well so this

is the perfect solution to anyone that wants
to integrate Elementor with any theme or use

Elementor on an existing website to create
some landing pages and is also a better solution

because it’s in a plug-in so if you were using
save the generate press theme fantastic theme

it works perfectly with just about any page
builder but you have all these checkboxes

that you have to check in order to get it
to look like this but what happens if you

wanted to stop using that theme and use a
different theme it it’s not been a kind of

calm go with you unless you’re using a plug-in
like this so right now if you using generate

press in order to get the beautiful full width
and then you want to change it you lose it

all so this is really the one plug-in that
you want to install on every website that

you’re using Elementor on so that down the
road if you want to try a different theme

you can easily do that and not lose these
beautiful pages that you’re designing in Elementor

not lose the perfect look of it without the
margins of the padding’s in the titles and

all of that kinda stuff to just be one click
to switch themes so essentially now when people

asked me hey what are themes that work with
Elementor it’s an easy answer if you use this

plug-in it’s essentially going to be anything
because you made it to the end of the video

I have a free gift for you but before I talk
about that I want to ask you to do something

for me if you can give this video a thumbs
up down below that would really help me out

if you’re not subscribed to the channel go
ahead and click on the unsubscribe button

and become a subscriber and support this channel
and if you’d like you to to notify you when

I upload new videos there’s a little bell
next to that subscribe button you can click

on that and set that up as well if you have
any questions or a comment about this video

I’d love to answer it there’s a comments section
down below all you have to do is put in your

question or comment I respond to every single
one I made a course just for you and it’s

called the three steps to WordPress success
and I want to give this to you if you’d like

to enroll in this course there’s a button
right here off to the right you go ahead and

click on that role as a student and that’s
just my way of saying thank you for supporting

me and making it to the end of this video
I make them just for you

Adam @ WPCrafter

My passion is making the best quality video tutorial online, for non-techies. When I am not behind the camera, I am usually helping out one of my YouTube subscribers.
how-to-make-website

How To Make A Website 2019

best-WordPress-webhost

Best WordPress Hosts 2019

website-hosting-discount

InMotion Hosting

50% Discount Offer

free-course-offer

Free Course Offer

WordPress Starter Course

55 thoughts on “How To Make Any WordPress Theme Compatible With Elementor”

  1. “Sorry, the content area was not found in your page. You must call ‘the_content’ function in the current template, in order for Elementor to work on this page.” When I checked out their “learn more” page, it was full of code stuff I didn’t understand. plz give me solution.

  2. Hi. Need help please. I am currently having a website built in WordPress using a bridge theme in native backend. i don’t know how to use naive wordpress n would like to make changes to the website with an easier tool like elementor when it gets handed to me. can it be done? if i install elementor can i then make changes to my website using it or do i need to custom build it again?

      1. Hi Adam, I watched the video to the end and expected you to mention Parallax.

        My problem is I need to have some pages with sidebars and so checking fullpage does not prevent me from getting whitespace above and below those pages.

  3. Hi, Adam. I have a problem on ny site I really don’t understand. http://rolvsing.no is running on Edge Plus theme – and the pages are built with Elementor. On desktop and Ipad, everything looks great. But if you go in on this site with a phone, your are often hit by a almost blank site. BUT: At the bottom you will find a text-link that says “Vis hele nettstedet”. That’s Norwegian for “Show the entire website”. If you click on this link, THEN the correct front page is shown. What’s wrong?

    1. Sorry to hear about this problem. What I would suggest is activating a different theme and see if you still have the issue. If that fixes it then you know there is an issue with your theme.

  4. Hello Adam, been watching your videos and learning a lot from them as a beginner. So about a week ago I started building my wocommerce store and used a free theme called ”online shop” to build the desktop version for it and didn’t care much about the mobile version. Now that Im editing some stuff on the mobile view, I found that it changes the stuff on the desktop view too. There is no way around with this theme to let me edit two views separately and this really is troubling me a lot. Also I can’t get my theme to work with elementor too as it shows some template.php error. I need some serious help.

  5. Bracknell Churchill

    Hello, i have been using elementor all of a sudden it start saying i can’t edit with elementor suggestions was that i should change my permerlinks to plain and i did it start working again but i need to no hope its not gonna be a Problem using it as plan bcos i av done all most all my site, and now i might have to strt looking for the linked files to rename the links and all, pls what should i do, to allow it work all over again in when the permerlink is on post?

  6. Valentin MariusSlave

    Hello Adam, i need your help in one problem regarding elementor… I just bought a theme from templatemonster.com and i bought elementor pro as well. But big surprise…on this theme elementor doesn’t work. I spoke to templatemonster and they told me that i have to pay an extra 69$ to make it work. Is there something i can do myself without paying this money? They said that elementor is not compatible ….”Your theme was build on Cherry Framework 3.1.5 version. It’s not compatible with Elementor”

  7. Even subscribed to premium plan with WordPress – but no Elementor plugin allowed to be installed – any suggestions? Not willing to subscribe to business just to get the ability to use Elementor.

    Thanks.

  8. Thank you for this! However, my Hestia site still says “Sorry, the content area was not found in your page. You must call ‘the_content’ fuction in the current template, in order for Elementor to work on this page.” When I checked out their “learn more” page, it was full of code stuff I didn’t understand. Any solution for this?

  9. Hi Adam,
    Thanks for this tutorial. I am just starting with WP and am still in ‘research mode’ in terms of what tools and what themes to use. I am pretty much set on Elementor as page builder, but I am completely overwhelmed on the theme front …
    I am currently looking into Shapely, which does not directly support Elementor, and that’s how I bumped into your video tutorial. Unfortunately the ‘solution’ offered here, does not work with Shapely, as Shapely’s front/home page relies on picking Shapely’s ‘Home Page’ template. Any ideas/solutions for that?
    Thanks,
    alex
    p.s.: I am also looking into Astra, which – afaik – is fully Elementor compatible …

      1. Gregory Constant

        Hi Adam, I have a website that I would love you to work one something for me and ask you some idea and I’m ready to pay?

  10. Hello Adam i have seen al lot of video’s you make. And i would say you did do a great job\work.
    I am from the Netherlands,so sorry for my bad english.
    I have a problem with the core settings\ core codes of elementor plugin. First of all i have deactivate all unnecessary plugins accept Elementor. And keep getting java script error’s like these :


    Warning: The type attribute is unnecessary for JavaScript resources.
    30 times this error. And i get this one Error: Bad value for attribute href on element link: Illegal character in query: | is not allowed.
    And these ones: Warning: Section lacks heading. Consider using h2-h6 elements to add identifying headings to all sections.

    I hope you got an answer, because i can not edit elementor’s core code, witch i think is cousing these error’s

    Please help me out… Thanks

  11. Hi there Adam
    I watch a lot of movie’s from you. But i have a problem and don’t no where i put my proble.
    Sorry for bad english , i am from Netherlands.
    I got a lot of errors in w3.org from elementor. How can i solve them easy?
    I got no experiance with css html?
    Hope you can help me a little..

    Thanks

  12. Hello,

    Any updates on this? I was using Canvas mode too but just read your notes about Google so will need to change that. I don’t like having to keep adding plugin after plugin.

    Thanks in advance,

    Rick

  13. I use genesis magazine pro theme and suddenly i get this error message from elementor: The Content Area Was Not Found in Your Page.
    “Sorry, the content area was not found in your page. You must call the_content function in the current template, in order for Elementor to work on this page.”

  14. Hey there,
    I came across your page because my theme that was previously working with Elementor suddenly does not and I think I messed something up in the code to make it that way. You see I’m using the Underscores starter theme and I’ve done quite some editing to it as I’m using it for my header and footer rather than Elementor. Are you aware of anything that would disqualify a theme from being compatible with Elementor? It’s a little off topic but I’ve been searching for the solution for quite a while now so I figure I’d give it a shot. I already tried uninstalling Elementor, all other plugins, deleting cache, restarting, etc etc. It’s definitely something in the code.

  15. Thanks for this. I was having this issue when inserting templates and couldn’t work out what the problem was.

    A couple of things. Am I missing something or…

    1. It’s a shame to have to install ANOTHER plugin to solve this problem that surely should be part of Elementor‘s design/settings given that templates are one of its main features.

    2. Even when using one of Elementor‘s recommended themes (GeneratePress) it still inserts the template content inside the existing page content, which raises the question, when CAN a template be used properly to create the appearance without the plugin you talk about in the video?

    Still learning my way around Elementor but this was a frustrating start….

    1. Haha actually i just realised I was doing it wrong. All the settings are in the page editor – switched the template to Elementor Canvas and full width content etc, not it all looks as it should without having to use the full width template plugin.

  16. Hi,

    Yesterday I purchased a Weight Loss theme.

    and installed in my subdomain …

    After installing this theme, I installed and activated Elementor builder plugin however when I try to edit page it gives me error message:

    “Sorry, the content area was not found in your page. You must call the_content function in the current template, in order for Elementor to work on this page.”

    and I am advised to Learn More by going to this link: https://docs.elementor.com/article/56-content-area-not-found

    Could you please advise if there is any plugin or manual way to fix this issue. I also have the Divi builder, however I believe there is common reason why Divi builder is also not working properly with above theme.

    Thanks
    Angad

    1. Certain pages that your theme creates are solely controlled by your theme, there is nothing you can do about that. Now if it is a fresh new page and you get that message, it is usually caused by another plugin you have installed.

Leave a Comment

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