Creating Dual Popups In Elementor 2.4

A World Webscapes Tutorial

February 9, 2019

Creating Dual Popups In Elementor 2.4

Table of Contents

Tools Used

Elementor

Difficulty

Difficulty 89%

Get Started Now

The Demo

Try Me Now. Click the big purple “LEARN MORE” button

E-BERRY ENERGY DRINK FOR ELEMENTOR*

$2.49

POP OPEN YOUR EYES WITH THIS NEW DRINK!

THIS BOLD NEW FLAVOR STYLE FROM WORLD WEBSCAPES WILL GET YOU ON YOUR FEET.

* THIS IS NOT A REAL PRODUCT OR ENDORSED BY ELEMENTOR IT IS JUST ME NAILING JELLO TO THE WALL

Create The Cans In Photoshop

Create The Base Template

Create a basic two column section. Set the background of the right side as the soda can and place a spacer widget inside to give it some height. Create your right column using headings, text blocks, and a button to call the final popup.

Create The Ingredients Popup

We need to work backwards create a small popup using Elementor popup section. We need to keep this pretty simple. You could put a random coupon code, or an additional form, be creative. Save this popup with the conditions set to show entire site but do not set any triggers or advanced settings.

Create The Main Popup

Now we create the main popup section with Elementor popups. We again call the basic style of our original but give our users more information. By positioning a button between two spacers, I could make the check ingredients button sit where I need it to be. We now need to link it to the ingredients using the anchor link of the ingredients popup “#elementor-action-id”. We have gone over how to find this in other tutorials. Please refer to another if you missed out. Save this popup with the conditions set to show entire site but do not set any triggers or advanced settings.

Link The Final Button

We now go back to our first section and link the main popup to our learn more button using the dynamic link feature anchor link again. Save the page and view it.

The Final Result

You should now get a dual popup for your section.

Tada

We hope you like this tutorial and can think of many uses and ideas of your own. Please smash the like button on the way out the door.

ELEMENTOR ENERGY WHEN YOU NEED IT!

WHEN YOUR POPUP IS JUST NOT ENOUGH TRY NEW E-BERRY  FLAVOR

CUSTOMER RATINGS

5/5
Share on facebook
Share on google
Share on twitter
Share on linkedin

E- Berry Ingredients

  • Base Template
  • Ingredient Template
  • Dynamic Buttons

THIS PRODUCT IS NOT ENDORSED BY ELEMENTOR PAGEBUILDER AND ONLY A POPUP DEMO