The Render Pop-Up action displays a pop-up window on the website. Pop-ups can be used for notifications, promotions, or to capture user information



Details of the action

The HTML content will be hosted in the supplied HTML content field


Example:


Below is an image of a cookie pop-up. 

 

 

The HTML used to create the above pop-up


<div class="cookie-consent-banner" style="position: fixed; bottom: 0; left: 0; z-index: 2147483645; box-sizing: border-box; width: 100%; background-color: #800080;">

 

<div class="cookie-consent-banner__inner" style="max-width: 960px; margin: 0 auto; padding: 32px 0;">

<div class="cookie-consent-banner__copy" style="margin-bottom: 16px;">

 

<div class="cookie-consent-banner__description" style="font-family: sans-serif, arial; font-weight: normal; color: #fff; font-size: 16px; line-height: 24px;">This website uses cookies to track your information. By clicking "Accept" you agree to the updated Privacy Policy.

 

</div>

 

</div> 

 

<div class="cookie-consent-banner__actions">

 

<a href="#" class="cookie-consent-banner__cta" onclick="acceptCookiePopUp()" style="box-sizing: border-box; display: inline-block; min-width: 164px; padding: 11px 13px; border-radius: 2px; background-color: #929292; color: #FFF; text-decoration: none; text-align: center; font-family: sans-serif, arial; font-weight: normal; font-size: 16px; line-height: 20px;">ACCEPT</a>

 

</div>

 

</div>

 

</div>

 

<script type="text/javascript">

 

function cookiePopup() { if(document.cookie.indexOf('autocure_cookiepopup=accepted') > 0){ $('.cookie-consent-banner').empty();}}

 

function acceptCookiePopUp(){

 

MyLib.CEPTriggerEvent('[[popupRender]]',{ 'cookiePolicy': 'Accepted' });

 

document.cookie = "autocure_cookiepopup=accepted"; 

 

$('.cookie-consent-banner').empty();

 

}

 

cookiePopup();

 

</script>


The HTML can be used to create the foundation of a cookie pop-up for another workflow. Adjustments can be made to wording, colours, fonts, text size and the functions