Browse AjaxPress docs

Page builders: Elementor, Bricks, Divi and more

On this page

Pages built with Elementor, Bricks, Divi, Beaver Builder, WPBakery, Oxygen, Breakdance, Zion Builder, Spectra or the block editor navigate like any other page. There’s nothing to configure.

Editing is left alone

When you open a page in a visual builder, AjaxPress recognises the builder and steps aside completely, so the builder loads exactly as it would without AjaxPress. This covers Elementor, Divi (Divi 5 included), Bricks, Beaver Builder, Oxygen, Breakdance, WPBakery, Visual Composer, Zion Builder, Thrive Architect, Brizy and the Customizer preview. Links that lead into a builder load the normal way too.

If a builder’s editor doesn’t load or behaves oddly, first check that Settings → AjaxPress → Basic → Enable SPA for Admin Dashboard is off. It only affects wp-admin, and visitors see no difference. On WordPress 7.0 and newer, leave it off anyway.

Widgets, sliders and animations

Each page loads as a complete page, with all of its scripts, so sliders, carousels, entrance animations, tabs, popups and galleries work on every page just as they do without AjaxPress. You don’t need to re-initialise anything.

A persistent player in a builder

A player that should keep playing must be on every page, so put it in a global template, never on a single page. Page content is exactly what changes when a visitor moves on.

Elementor

  1. Go to Templates → Theme Builder → Footer and edit your footer (or create one for the entire site).
  2. Add your player: an Audio widget, an HTML widget with your player code, or a radio plugin’s widget.
  3. Select the widget, open Advanced, and set CSS ID, for example my-radio-player.
  4. Mark it. With AjaxPress Pro, enter #my-radio-player under Settings → AjaxPress → Media Players. With the free plugin, use an HTML widget and put data-ajaxpress-persist on the player’s wrapper.
  5. Give it its own positioning. Elementor styles widgets through their section, and those styles stop applying once the player has moved.

Bricks

Build a footer template set to show on the entire site, put the player in it, and give the player element a CSS ID (Style → CSS → CSS ID). Use that ID in Media Players, or add the data-ajaxpress-persist attribute under the element’s Attributes.

Divi

Use the Divi Theme Builder to create a global footer, put the player module in it, and set a CSS ID under Advanced → CSS ID & Classes. Then use that ID in Media Players.

See Keep audio or video playing across pages for identity keys, positioning and testing.

Forms built with a builder

Elementor forms, Bricks forms and the other builders’ form widgets submit their own way, over their own ajax, and AjaxPress leaves them to it. If a builder form ever submits twice or stops before its confirmation message, update AjaxPress (2.4.2 fixed the known cases), then opt the form out with data-ajaxpress-ignore-submit. See Forms.

Troubleshooting

SymptomTry first
The builder’s editor won’t loadTurn off Enable SPA for Admin Dashboard
The player disappears when you change pageMove it into a global header or footer template
The player jumps to the wrong placeGive it its own position: fixed CSS
The player loses its styling after movingRewrite styles that relied on its parent section
A builder form sends twiceUpdate AjaxPress, then add data-ajaxpress-ignore-submit to the form

When you report a builder problem, tell us the builder and its version, your theme, and whether Enable SPA for Admin Dashboard is on. Builder behaviour changes a lot between versions.