Generate: Page Builders Integration: Elementor

Prerequisites

• Elementor 2.9.6 or higher, or
• Elementor Pro 2.9.1 or higher

Setup

Before using Elementor in your Content Group, you’ll need to:

• Navigate to Elementor > Settings
• Under the General tab > Post Types, tick / select Groups or Content Groups
  
• Click the Save Changes button
• Navigate to Settings > Permalinks
• Click Save Changes

Add a Content Group

To add a new Content Group to Page Generator Pro, click the Add New button below the Content Groups title, which can be found towards the top of the screen:

You will then be presented with a screen similar to the one used to edit your WordPress Posts and Pages:

It’s recommended that you first:

• Define the Title,
• Setup the Content Group settings, by referring to the Generate: Content Documentation.
• Click Save

Once saved, click the Edit with Elementor button:

Edit a Content Group

To edit an existing Content Group in Page Generator Pro, click the Title of the Group that you want to edit:

Click the Edit with Elementor button:

Using Elementor Templates

If you have already designed your Page as an Elementor Template, it is strongly recommended to import the Elementor Template into a Content Group, to ensure that Page Generator Pro functionality (Keywords, Spintax, Dynamic Elements) can be used in all sections of your Page.

• Edit the Content Group, clicking the Edit with Elementor button to be taken to Elementor’s editor
  
• Click the folder icon in the Editor
  
• Either select the template from the Pages or My Templates section
  
• Click Insert beside the Template you want to use
  
• If you want to also import the Template’s settings, click Yes
  

Add new widgets and edit existing widgets as necessary to include your Keywords, Dynamic Elements, Spintax etc.

Using a Page Layout

To use an Elementor Page Layout, such as Elementor Full Width or Elementor Canvas, it must be set in both the Content Group and Elementor.

• Set the Page Layout at Page Generator Pro > Content Groups > Edit > Attributes > Template
  
• Save the Content Group
• Click the Edit with Elementor button to be taken to Elementor’s editor
  
• Click on the Settings icon (bottom left corner)
  
• Set the Page Layout
  
• Click the green Update button
  

Global Widgets

An Elementor Global Widget gives you full control over a specific widget that is displayed in multiple places on your site. Editing it in one place (whether that be a Page, Content Group or other) will update that specific widget anywhere it is used on your WordPress web site.

Keywords

To use Keywords in a Global Widget:

• Ensure that you are using Page Generator Pro 4.3.2 or higher,
• Confirm that the Content Group’s Store Keywords option is enabled
  • If this was disabled, you will need to enable it and then (re)generate all Pages

Spintax

Whilst spintax is supported, its result is not cached.  Therefore, spintax will run every time a Global Widget is viewed (i.e. every time a generated Page is viewed), resulting in performance issues and different content displayed every time.  It’s therefore not recommended.

Dynamic Elements

The Related Links Dynamic Element is supported in a Global Widget.

Other Dynamic Elements will not function.

4.3.1 and lower

An Elementor Global Widget gives you full control over a specific widget that is displayed in multiple places on your site. Editing it in one place will instantly update the rest.

With this in mind, you can’t edit Global Widgets in a Content Group, without those edits affecting other places that use the Global Widget.  Therefore, Global Widgets don’t support Keywords, Spintax, Dynamic Elements etc.

If you need to edit the Content Group’s Global Widget instance only:

• Insert the Global Widget into your Content Group’s Elementor editor
  
• Click the Unlink button
  
• The widget can then be edited to include Keywords, Spintax etc. Edits will only affect the widget in this Content Group, and not the original Global Widget.
  

Dynamic Elements

Page Generator Pro registers each of its Dynamic Elements as a Widget in Elementor within the Page Generator Pro section:

Alternatively, you can use Elementor’s Text Editor Widget:

How to do this can be found in the Adding: Classic Editor / TinyMCE section of each of the Documentation links below:

• Google Map
• Media Library Image
• OpenStreetMap
• OpenWeatherMap
• Pexels
• Pixabay
• Related Links
• Wikipedia
• Yelp
• YouTube

For other Elementor widgets, you’ll need to manually build each Dynamic Element’s shortcode using the documented parameters.  These can be found in the Adding: Page Builders section of each of the Documentation links below:

• Google Map
• Media Library Image
• OpenStreetMap
• OpenWeatherMap
• Pexels
• Pixabay
• Related Links
• Wikipedia
• Yelp
• YouTube

Common Issues

Edit with Elementor button missing

Follow the Setup section of this document.

The Content Area Was Not Found in Your Page

In the WordPress Administration interface:

1. Navigate to Elementor > Settings
2. Under the General tab > Post Types, tick / select Groups or Content Groups
   
3. Click the Save Changes button
4. Navigate to Settings > Permalinks
5. Click Save Changes

Keywords not replaced on Generation

Keywords specified in an Elementor Template or Global Widgets will not be processed.  This is because there is one instance of an Elementor Template or Global Widget, and replacing a Keyword in either would incorrectly apply to all Pages using said Template.

Either:

• Import the Elementor Template into the Content Group,
• Unlink the Global widget

The Post Content Widget was not found in your Template

You incorrectly assigned an Elementor Template instance to Content Group(s).  Either:

• Edit the Elementor Template in question, adding a Post Content Widget, or
• Import the template into a Content Group

The preview could not be loaded

404 Error

In the WordPress Administration interface:

1. Ensure the Prerequisites section is met
2. Follow the Setup section of this document

Editor infinitely loads

1. Ensure the Prerequisites section is met
2. Follow the Setup section of this document
3. Disable third party Plugins
4. Clear any browser and server caches
5. Attempt to load Elementor on a standard WordPress Page
6. Follow Elementor’s Documentation

CSS / Styles missing

1. Navigate to Elementor > Tools, and click Regenerate Files & Data
   
   
2. If the issue persists after following (1), clear all caches of any optimization and minification Plugins (for example but not limited to Autoptimize, WP Minify)
3. If the issue persists after following (1) and (2), and the Performance Addon is enabled, either:
   1. Elementor must also be selected under Performance Addon: Load Plugins, or
   2. Use Performance Addon must be disabled.
4. If generating a Page in Test mode, you may need to instead generate a draft Page using Generate via Browser or CLI, making sure to follow steps 1 & 2 above, to get an accurate test result.