Skip Navigation

Using Toolset with Elementor Page Builder

By combining the power of Elementor page builder with the Toolset's advanced query builder you can easily build great-looking custom sites.

Some examples of what you can do with Elementor and Toolset

Create Templates

Display Custom Lists of Posts

Single post displayed using Elementor's Single template
Display Custom List of Posts

Create Custom Searches

Display Content on Google or Azure Maps

Custom search for easy content finding
Gym posts listed on a map and a pop-up listing all related trainers

Getting Started

Elementor provides a free and Pro version. Both work with Toolset.

To use Elementor with the WordPress Block Editor, you must install the free Elementor Blocks for Gutenberg plugin.

To use Elementor with Toolset, you must install:

  • Toolset Types
  • Toolset Blocks

The Toolset plugin package provides more features. Choose the additional features you need and install the corresponding plugins:

  • Toolset Maps – display your content on Google or Azure Maps
  • Toolset Forms – allow users to submit and edit content via front-end forms

Adding Custom Types, Fields, and Taxonomies

Toolset allows you to customize your site in a way not possible in WordPress by default. This includes creating custom post types (like “Gyms” or “Events”), custom fields for these post types (like “Address” or “Event Date”), and custom taxonomies (like “Trainer Specialties” or “Event Type”) to categorize your content.

If you’re new to WordPress, check out our lesson about what custom types are and how they work.

Come back here when you are done so you can continue reading how to display new custom content with Elementor.

How to use Elementor with Toolset

Toolset works within the default WordPress Block Editor while Elementor is a stand-alone page builder.

Thanks to the Elementor Library block (available after installing the Elementor Blocks for Gutenberg plugin), you can easily use Toolset and Elementor together from the Block Editor like this:

  • Create Elementor templates with your custom design.
  • Use WordPress Block Editor to insert Elementor templates into your pages.
  • Inside those same pages, use WordPress Block Editor to create and design all advanced features provided by Toolset.

Follow these steps

  1. Create or edit a regular page.
  2. Insert the Elementor Library block.
Inserting the Elementor Library block
  1. Choose a template from the list of your existing Elementor templates or create a new one.
Selecting an Elementor template

That’s it, now you can continue editing the same page and add any of the Toolset features like custom lists of posts, custom searches, maps, front-end forms, and more.

Limitations when using Elementor and Toolset templates together

If you are using Elementor to design templates for your custom post types, do not assign a Toolset Content Template and an Elementor Template to the same content.

Also, do not insert an Elementor Template into a View’s Loop Item or Content Template.

Originally written
August 8, 2018
Updated
July 10, 2020