{"id":14057,"date":"2024-03-20T20:53:40","date_gmt":"2024-03-20T19:53:40","guid":{"rendered":"https:\/\/helpcenter.blendee.com\/article\/setting-up-a-popup-on-exit\/"},"modified":"2024-04-24T09:17:23","modified_gmt":"2024-04-24T07:17:23","slug":"setting-up-a-popup-on-exit","status":"publish","type":"article","link":"https:\/\/helpcenter.streamwise.it\/en\/article\/setting-up-a-popup-on-exit\/","title":{"rendered":"Setting Up a Popup On Exit"},"content":{"rendered":"\n<figure class=\"wp-block-embed is-type-video is-provider-vimeo wp-block-embed-vimeo wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" src=\"https:\/\/player.vimeo.com\/video\/932487405?dnt=1&amp;app_id=122963\" width=\"699\" height=\"393\" frameborder=\"0\" allow=\"autoplay; fullscreen; picture-in-picture; clipboard-write\"><\/iframe>\n<\/div><\/figure>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>N.B.: There is a new version available for this template, it&#8217;s called &#8220;Next on Exit&#8221;, which you can find the <a href=\"https:\/\/helpcenter.streamwise.it\/en\/article\/next-on-exit-and-next-on-exit-recommendations-templates\/\" data-type=\"article\" data-id=\"8525\">guide for here<\/a>.  <\/p>\n<\/blockquote>\n\n\n\n<p>Thanks to the pop-up on exit, you can intervene before the user leaves the site. It appears when the user is about to exit the navigation window.<\/p>\n\n\n\n<p>Let&#8217;s move on to the practical part, which is how to configure a pop-up on exit.<\/p>\n\n\n\n<p>From the left menu, go to Website -&gt; Behavioral Messages.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-medium\"><img data-original=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2024\/01\/Schermata-2024-01-18-alle-11.27.47-142x300.png\" alt=\"\" class=\"wp-image-10302\"\/><\/figure><\/div>\n\n\n<p>From the control panel, click on the &#8220;New Behavioral Message&#8221; button at the top right.<\/p>\n\n\n\n<p>This will take you to the <em>configuration <\/em>window (to learn more about the steps, read the following article <a href=\"https:\/\/helpcenter.streamwise.it\/en\/article\/how-to-set-up-a-behavioural-message\/\">&#8220;How to configure a behavioural message&#8221;),<\/a> from which you can continue with the settings until you choose the <em>\n  <strong>\n    <a href=\"https:\/\/helpcenter.streamwise.it\/en\/template\/\" data-type=\"page\" data-id=\"9175\">Template<\/a>\n  <\/strong>\n<\/em>.<\/p>\n\n\n\n<p>You can check the progress of the configuration through the wizard bar at the top of the page.<br>At this point you can click on the &#8220;Select&#8221; button corresponding to the <strong>On Exit Message<\/strong> template and continue with the <em>Customization<\/em> by clicking on the &#8220;Next&#8221; button at the bottom right of the page.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"153\" src=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2017\/11\/Schermata-2022-06-28-alle-16.55.15-300x153.png\" alt=\"\" class=\"wp-image-8147\" srcset=\"https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2017\/11\/Schermata-2022-06-28-alle-16.55.15-300x153.png 300w, https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2017\/11\/Schermata-2022-06-28-alle-16.55.15.png 330w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/figure><\/div>\n\n\n<p>Before creating the layout of the recommendation, it is necessary to enter the complete URL of the site in the appropriate bar to view the preview and click on the arrow <a href=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.30.42.png\" rel=\"lightbox[3270]\" data-lbwps-width=\"46\" data-lbwps-height=\"54\" data-lbwps-srcsmall=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.30.42.png\">\n  <img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-7262\" src=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.30.42.png\" alt=\"\" width=\"20\" height=\"23\">\n<\/a>icon.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter is-resized\"><a href=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.22.22.png\" rel=\"lightbox[3270]\" data-lbwps-width=\"1882\" data-lbwps-height=\"112\" data-lbwps-srcsmall=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.22.22.png\"><img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"18\" src=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.22.22-300x18.png\" alt=\"\" class=\"wp-image-7261\" style=\"width:333px;height:auto\" srcset=\"https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.22.22-300x18.png 300w, https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.22.22-768x46.png 768w, https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.22.22-1024x61.png 1024w, https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.22.22.png 1882w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><\/figure><\/div>\n\n\n<p>If the URL entered is correct, the site will be loaded in preview. At this point it will be necessary to select where to insert our REC by clicking on the select element icon  <a href=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.33.26.png\" rel=\"lightbox[3270]\" data-lbwps-width=\"60\" data-lbwps-height=\"78\" data-lbwps-srcsmall=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.33.26.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-7263\" src=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.33.26.png\" alt=\"\" width=\"20\" height=\"26\"><\/a>. You will be given the option to choose between automatic selection and manual configuration.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.34.15.png\" rel=\"lightbox[3270]\" data-lbwps-width=\"470\" data-lbwps-height=\"178\" data-lbwps-srcsmall=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.34.15.png\"><img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"114\" src=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.34.15-300x114.png\" alt=\"\" class=\"wp-image-7264\" srcset=\"https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.34.15-300x114.png 300w, https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.34.15.png 470w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><\/figure><\/div>\n\n\n<p>With the automatic selection we could move around the screen and we will see the element on which we position ourselves highlighted with an orange border. By clicking on it, we will select the element and a further configuration will appear relating to the choice of the position of the REC with respect to the selected element.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"118\" src=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.35.14-300x118.png\" alt=\"\" class=\"wp-image-7265\" srcset=\"https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.35.14-300x118.png 300w, https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.35.14-768x303.png 768w, https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.35.14-1024x404.png 1024w, https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-14.35.14.png 1628w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/figure><\/div>\n\n\n<p>The choices are:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Before the item<\/li>\n\n\n\n<li>After the<\/li>\n\n\n\n<li>In place of the element<\/li>\n<\/ul>\n\n\n\n<p>Once you have set the position of the Message, you will be able to use the editor that will appear in the left column.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"125\" height=\"300\" src=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2017\/11\/Schermata-2022-06-15-alle-10.11.53-125x300.png\" alt=\"\" class=\"wp-image-8059\" srcset=\"https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2017\/11\/Schermata-2022-06-15-alle-10.11.53-125x300.png 125w, https:\/\/helpcenter.streamwise.it\/wp-content\/uploads\/2017\/11\/Schermata-2022-06-15-alle-10.11.53.png 245w\" sizes=\"(max-width: 125px) 100vw, 125px\" \/><\/figure><\/div>\n\n\n<p><br>In the left column, by clicking on the respective buttons, you can:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Enter the text of the message: a small additional editor will open<\/li>\n\n\n\n<li>Enter the title of the message: a small additional editor will open<\/li>\n\n\n\n<li>Insert the border and background of the box:\n<ul class=\"wp-block-list\">\n<li>Edge thickness<\/li>\n\n\n\n<li>Edge Rounding<\/li>\n\n\n\n<li>Border color<\/li>\n\n\n\n<li>Background color<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Determine the location and size of the box\n<ul class=\"wp-block-list\">\n<li>Message size (small-medium-large)<\/li>\n\n\n\n<li>Display Wait (seconds)<\/li>\n\n\n\n<li>Distance from top margin (px)<\/li>\n\n\n\n<li>Placement level (Z-Index)<\/li>\n\n\n\n<li>Wait for display once closed (days-hours-minutes)<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>other\n<ul class=\"wp-block-list\">\n<li>Display on Load (or not)<\/li>\n\n\n\n<li>Scroll Offset<\/li>\n\n\n\n<li>seconds of visibility<\/li>\n\n\n\n<li>Close the other warnings (or not)<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Layout\n<ul class=\"wp-block-list\">\n<li>Message Location\n<ul class=\"wp-block-list\">\n<li>rounded corners<\/li>\n\n\n\n<li>Content padding<\/li>\n\n\n\n<li>Close Icon Position<\/li>\n\n\n\n<li>Background color<\/li>\n\n\n\n<li>Border width<\/li>\n\n\n\n<li>Closure Icon Color<\/li>\n\n\n\n<li>Show Drop Shadow<\/li>\n\n\n\n<li>Animated Overlay<\/li>\n\n\n\n<li>Box Position<\/li>\n\n\n\n<li>Maximum box width<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Message Texts and Images\n<ul class=\"wp-block-list\">\n<li>Side Image Width<\/li>\n\n\n\n<li>Side Image Position<\/li>\n\n\n\n<li>Side image<\/li>\n\n\n\n<li>Text content<\/li>\n\n\n\n<li>Title Color<\/li>\n\n\n\n<li>Text color<\/li>\n\n\n\n<li>Title size<\/li>\n\n\n\n<li>Text size<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Close the other warnings (or not)<\/li>\n\n\n\n<li>Additional CSS code<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Form\n<ul class=\"wp-block-list\">\n<li>Show forms (or not)<\/li>\n\n\n\n<li>Link Color<\/li>\n\n\n\n<li>General Padding Form<\/li>\n\n\n\n<li>Input Color<\/li>\n\n\n\n<li>Checkbox color<\/li>\n\n\n\n<li>Input Border Color<\/li>\n\n\n\n<li>Rounded corners<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Buttons\n<ul class=\"wp-block-list\">\n<li>Button Text Color<\/li>\n\n\n\n<li>Button Background Color<\/li>\n\n\n\n<li>Button Text Size<\/li>\n\n\n\n<li>Rounded corners<\/li>\n\n\n\n<li>Border color<\/li>\n\n\n\n<li>Border size<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n\n\n<p>Click on &#8220;Update Preview&#8221; to get a preview of the recommendation. From the device icon  <a href=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-15.32.14.png\" rel=\"lightbox[3270]\" data-lbwps-width=\"248\" data-lbwps-height=\"100\" data-lbwps-srcsmall=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-15.32.14.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-7268\" src=\"https:\/\/helpcenter.blendee.com\/wp-content\/uploads\/2020\/07\/Schermata-2020-09-10-alle-15.32.14.png\" alt=\"\" width=\"50\" height=\"20\"><\/a>You can choose whether to preview the mobile, desktop, or tablet format.<br>To check the result, click on &#8220;update preview&#8221; at the bottom of the left column.<\/p>\n<div class=\"wrap-post-useful post_useful_14057\">\n<p><div style=\"color: black; margin-bottom: 15px;\"><strong>Was this content useful?<\/strong><\/div><\/p>\n<p class=\"post_useful_success post_useful_success_14057\">Thanks for contributing!<\/p>\n<div class=\"post-useful-buttons post_useful_buttons_14057\">\n<a href=\"javascript:;\" style=\"border:0px;\" title=\"Yes\" class=\"post-useful-vote post-useful-vote-yes\" data-id=\"14057\" data-rate=\"1\">Yes<\/a>\n<a href=\"javascript:;\" style=\"border:0px;\" title=\"No\" class=\"post-useful-vote post-useful-vote-no\" data-id=\"14057\" data-rate=\"0\">No<\/a>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>N.B.: There is a new version available for this template, it&#8217;s called &#8220;Next on Exit&#8221;, which you can find the guide for here. Thanks to the pop-up on exit, you can intervene before the user leaves the site. It appears when the user is about to exit the navigation window. Let&#8217;s move on to the [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"menu_order":0,"template":"","format":"standard","article-category":[204],"article-tag":[590],"class_list":["post-14057","article","type-article","status-publish","format-standard","hentry","article-category-web-site-behavioral-messages","article-tag-behavioural-messages-en"],"_links":{"self":[{"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/article\/14057"}],"collection":[{"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/users\/1"}],"version-history":[{"count":3,"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/article\/14057\/revisions"}],"predecessor-version":[{"id":15074,"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/article\/14057\/revisions\/15074"}],"wp:attachment":[{"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/media?parent=14057"}],"wp:term":[{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/article-category?post=14057"},{"taxonomy":"article-tag","embeddable":true,"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/article-tag?post=14057"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}