In this tutorial, we will show you how to create an exit intent popup that offers a content upgrade that is triggered when a visitor is intending to exit the page, using Elementor’s Popup Builder. You will also learn how to set a button to download an eBook, use entrance animations, and more.
hey there guess who Cassie from
Elementor in this video you’ll learn how
to download a free ebook from a pop-up
capturing your users attention keeping
them on your site why use it it’s an
easy way to keep users engaged just when
they’re exiting your site and who
doesn’t love freebies let’s see how the
magic is done first off press command e
to get the finder and enter add new
pop-up name your template and click
create template in settings to make the
pop-up more noticeable let’s open it up
by adjusting the width and height and
shift the content position to the center
in style change the background to
transparent cancel the box shadow and
change the overlay background to white
add a section and drag in an
intersection and let’s design them
choose a color and round the borders
drag in an image widget and choose an
image from your library this will be
your ebook in advanced set the margin so
your book looks like it’s popping out of
your section let’s add a divider use a
color from your site’s palette and
adjust the width drag in a heading add
text and choose your font weight
duplicate it with a right-click set the
margin to place the two lines closer to
each other drag in a text editor widget
and add your text adjust the color line
height and other settings to make it
more readable add a button and you know
what to do change the text and Link it
to your ebook make the size larger in
style change the text color use the
border radius to round the edges to
match the rest of your design click the
handle of the intersection to enter its
settings change the content to the
middle click the column handle here to
enter its setting in advanced set the
margins to make room for a surprise set
the z-index and adjust the book
accordingly add a new set
set the z-index to one add some fun
entrance animation say zoom in and drag
an image into the new section and change
the margin to a negative number to place
it underneath your pop-up hit publish
and let’s set our conditions and
triggers so in conditions set it to
entire site under triggers turn on on
page exit intent this way your pop-up is
displayed just when a user is about to
leave the page in this example we’re not
going to set any advanced rules so hit
save and close now let’s see it in
action so open the live page scroll down
a bit and let’s intend to exit the page
whoo-hoo here’s our surprise you get a
free gift design a downloadable freebie
on a pop-up today and put your users in
a good mood see you in the next video
and don’t forget subscribe to our You
Tube channel
