Creating Mega menu using Elementor

What is Mega menu?

Mega Menu is extensive sub menu which allow you to display various of menu links or other rich information.

Creating Mega menu using Elementor

First please install and activate Elementor and Coursector Theme Elements for Elementor plugins before you proceed.

Once you get required plugins installed. Please follow below steps.

Create mega menu content posts

We are using Elementor Page Builder plugin so you can use its drag&drop user interface to create your mega menu contents.

Please navigate to WordPress Dashboard > Mega Menus > Add New Mega Menu. Then enter its title and click “Edit with Elementor” option.

Now you will open Elementor page builder editor. You can customize menu columns, contents including social icons, buttons, logo image etc.

Import Demo Mega Menu Templates

Click “Add Template” button and select “Blocks” section. Then select “Theme Mega Menu” for select box option.

You will see list of predefined templates there. Select one you want to import and click “Insert”.

Assign Mega Menu Post content to parent menu item

One you have mega menu posts with content. The next step is to assign it to parent menu item. So when user move mouse over menu item. It will open selected mega menu.

Go to Appearance > Menus and selected parent menu item you want to assign mega menu post to.

Expand selected parent menu item, you will find “Elementor Mega Menu” option. Then select mega menu you want to assign to this menu item.

Once you selected then click “Save Menu” button to save all changes.

Import Single Demo Page

First please install and activate Elementor and Coursector Theme Elements for Elementor plugins before you proceed.

Once you get required plugins installed. Please follow below steps.

Create a page or edit an existing one.

Click “Edit with Elementor” button to open Elementor Page Builder.

Click “Add Template” button and scroll through “Pages” section.

You will see popup modal window. Click “Pages” tab to see a list of all page templates. You can filter only Craft templates and select demo page you want to import and click “Insert”.

Known Issue

If you have experience Coursector template issue with Elementor library. Please make sure you update the plugin “Coursector Theme Elements for Elementor” to v1.9

How to Do A/B Testing With Elementor

If you’re building sales funnels and landing pages in WordPress, for yourself or your clients, Elementor is a bit of a dream come true.

Super easy to create conversion-focused landing pages, drag-n-drop, directly there in WordPress.

What are the Benefits of A/B Testing

A/B testing has many purposes with many benefits. It’s an all-encompassing type of analytical testing, where you can create unique tests or run something simple like how many users visit your webpage.

There is official article from Elementor website here “How to Do A/B Testing With Elementor” which has detailed steps and explanations about how to create A/B testing along with Google Analytic.

If you are looking for easier and simple solution for adding A/B testing for Elementor. You can also use this plugin “Split Test For Elementor” to create this options within Elementor without requiring Google Analytic.

Design single accommodation page using Elementor

First please check below checklist in order to use this features.

  1. Required Hoteller version 3.0 or higher
  2. Install and activate Elementor and Hoteller Theme Elements for Elementor plugins before you proceed.

Activate Elementor for accommodation type post.

Please navigate to Elementor > Settings > General > Post Types and make sure you check “Accommodation Types”

Editing single accommodation page content Elementor Page Builder

From Accommodation > Accommodation Types and select accommodation type you want to edit using Elementor.

Then edit the accommodation type with Elementor page builder.

Select “template” option in “Post Attributes” meta box on the right sidebar to “Elementor Cavas” so it’s using blank template to design all contents.

It will open Elementor page builder editor page which you can use its drag&drop interface to create footer content. You can view detailed documentation about how to use Elementor page builder here.

Import Demo Single Accommodation Templates

Click “Add Template” button and select “Pages” section. Then search for “Single Accommodation” for select box option.

You will see list of predefined templates there. Select one you want to import and click “Insert”.

How to create popup box

First you have to make sure you installed 2 required plugins “Elementor” and “PopBox For Elementor”. If you haven’t you can do that via Appearance > Install Plugins.

Next you have to create a page using Elementor.

To create a popup, look at widget panel on the left and search for “popbox”

Then drag widget to page content area on right side. It will open widget’s settings.

 

Now you can start design popup columns & layouts using all Elementor widgets and customise its settings.

How to Do A/B Testing With Elementor

If you’re building sales funnels and landing pages in WordPress, for yourself or your clients, Elementor is a bit of a dream come true.

Super easy to create conversion-focused landing pages, drag-n-drop, directly there in WordPress.

What are the Benefits of A/B Testing

A/B testing has many purposes with many benefits. It’s an all-encompassing type of analytical testing, where you can create unique tests or run something simple like how many users visit your webpage.

There is official article from Elementor website here “How to Do A/B Testing With Elementor” which has detailed steps and explanations about how to create A/B testing along with Google Analytic.

If you are looking for easier and simple solution for adding A/B testing for Elementor. You can also use this plugin “Split Test For Elementor” to create this options within Elementor without requiring Google Analytic.

Create a Page using Elementor

We are using Elementor Page Builder plugin so you can use its drag&drop user interface to create your page contents. Here are detailed documention about how to use Elementor from its official page.

You can also checkout full lists of getting started documentations from here.

An Example Steps to Create a page using Elementor

Go to WordPress Dashboard > Pages > Add New and enter page title.

Click “Edit with Elementor” button to open Elementor Page Builder.

You will open a Elementor page builder. On the left sidebar. You can drag widget you want to add to the main content area on right side.

Import Single Demo Pages

First please install and activate Elementor and DotLife Theme Elements for Elementor plugins before you proceed.

Click to here to see full documentation about how to import single demo page.