Clicky

  1. Home
  2. Extension & Themes
  3. AMP Page Builder Compatibility
  4. How to Enable AMP on Elementor (One Click Solution)

How to Enable AMP on Elementor (One Click Solution)

Elementor is a page builder plugin that replaces the basic WordPress editor with a live frontend editor, so you can create complex layouts visually, and design your website live, without having to switch between the editor and the preview mode.

The elementor page builder will work perfecting on Non-AMP website (Normal website) BUT not on AMP pages and if you want the same design in the AMP pages also then you need to download our extension called Page Builder Compatibility for AMP, which will work out of the box which means all your AMP and NON-AMP pages will be same.

It’s pretty easy for you to set up because it works out of the box.

How to Setup AMP Page builder.

  1. You can purchase the Extension from this URL Page Builder Compatibility for AMP
  2. Click on Buy Now button this page redirects to download this extension. Which type of package you want just select that package.
  3. Once you Purchase the plugin goto Account area and download the zip file.

How To Install / Upload Zip File

  • Login to WordPress Admin Option Panel –> Plugins –> Add New –> Upload Plugin –> Choose file (Navigate to your Downloads folder then Select Downloaded zip file) –> Install Now –> Activate.
  • From the dashboard we go to the left-hand side in Menu bar go to AMP option panel -> Settings -> Page Builder.

Scroll down a little to see this option

  • AMP Elementor Compatibility: Once you enable this option AMP Elementor Compatibility it looks similar in Non-AMP(normal website) and AMP website.
  • Enter CSS URL: In this textarea, Add your custom plugin CSS links(URL) to get similar output like non-AMP and you can separate CSS URL by a comma.
  • Enter Custom CSS: In this textarea, you can enter your custom CSS code. If you want some CSS specific changes on your side, so add your CSS code here.
  • Enter reCAPTCHA (v3) site key: In this field enter the Recaptcha site key.
  • Enter reCAPTCHA (v3) secret key: In this field enter the Recaptcha secret key.
  • Remove Header Footer: Tick if you want to remove the default header & footer.
  • Done! The Page Builder will be visible on the AMP version of your site.

Demo Of Non-AMP

To view of Non-AMP on Elementor click here


Demo Of AMP

To view of AMP on Elementor click here

To watch more demo of Elementor click here

To make it easy, we have created a video tutorial also

That’s it for this tutorial!

We hope it helped you. If you have any feedback or questions, then please share them in the comments section below.

Ask your Questions Directly!
If you can't find the solutions in this article, then just ask us in the comments and we will answer it for you!
Updated on November 27, 2019

    Are you still looking for a solution?

    Then fill out the below form and we will reach out to you within a few hours.

    Was this article helpful?

    Related Articles

    Comments

    1. Hello purchased the elementor plugin. I hit clear css and now everything is no good?
      Any suggestions, maybe I need custom css. I love the demo. How do I get that exact look?

      1. Hi Dotan Meirov,

        Will you please provide us the URL of your website and if you have any issues/problems then contact our support team – https://ampforwp.com/support/ they will fix the issue as soon as possible.

          1. Hi azeem,

            You will still get the basic design of the elementor on your AMP pages and if you know CSS then you can design it.

    2. Im interested of elementor to amp do you have a list of features that can you do like hiding some section on mobile part

      1. Hi Adam Smith,

        There is no list of features and whatever you add in the elementor will automatically be added in the AMP as well.

        1. Hello I just purchased the AMP Page Builder Compatibility plugin I followed the instruction step by step and activate the license
          but i encounter error my amp page isn’t working now (HTTP ERROR 500) . my site is http://www.allstarsolar.com.au

    3. Hello I just purchased the AMP Page Builder Compatibility plugin I followed the instruction step by step and activate the license
      but i encounter error my amp page isn’t working now (HTTP ERROR 500) . my site is http://www.allstarsolar.com.au

    4. I use woocommerce on my site. I want to use elementor and amp. I realize I would need the amp extension for elementor (page builder) BUT do I also need to buy AMP woocommerce extension also?

    5. Hi guys,

      Most of my site will be custom post types made with Crocoblock x JetEngine x Elementor, is AMP still possible with these factors?

      1. Hi Amon,

        Your custom post types will render in amp whereas we have the compatibility of Elementor builder in amp pagebuilder compatibility plugin whereas regarding your other builders we have not tested it. Please let us know if there’s anything else we can do.

    6. Hi there,

      I installed this plugin but did not yet activate it. I wish to buy it however I need to be sure that my posts will look exactly the same. Is it normal that this plugin only works when given the acces key?
      If it doesn’t work do you offer a money back guarentee?

      Also what’s up with duplicate content ? Is there an automatic cannonical installed or…?

      1. Hi Michel,

        In amp, we will provide you with 4 free designs from which you can use anyone for the AMP pages but if you need more designs then you can buy our AMP layout plugin in which we give additions designs for you to choose from and we will be giving you a money-back guarantee if our team couldn’t fix your issue then we are happier to provide a complete refund within 30 days of your purchase and as far as duplicate content is a concern, it will not create such error as the amp and non-amp pages content will be same and once you install our plugin then we will automatically create the canonical tags and you no need to add them manually

    7. Hi, do you offer some sort of free trial for this elementor AMP converter?

    8. I did exactly the same thing as in the video and the result was nothing like…

    Leave a Comment