Dear Customers,
We are publishing the recorded video of today's webinar for the benefit of all airlines who could not participate.
The code mentioned in part 1 is listed below.
Pop-up banner GTM code:
Tag 1 - Banner JavaScript:
var alerted = localStorage.getItem('alerted') || '';
if (alerted != 'yes') {
var note = '<div class="alert-note alert alert-warning alert-dismissible">';
note += '<button type="button" class="close alert-clicked" data-dismiss="alert">×</button>';
note += '<div class="alert-text"><h2>ENTER THE TITLE TEXT HERE</h2>';
note += '<p>ENTER THE SUB-TITLE TEXT HERE.</p>';
note += '<a href="ENTER THE REDIRECTION URL HERE" class="alert-link btn btn-danger alert-clicked">ENTER THE TEXT FOR THE BUTTON HERE</a>';
note += '</div></div>';
$("body").prepend(note);
}
else{
$(".alert-note").hide();
}
$('body .alert-clicked').click(function(){
localStorage.setItem('alerted','yes');
$('body .alert-note').fadeOut();
});
</script>
Tag 2 - CSS code - Banner styling:
<style>
.alert-note {
z-index: 99;
width: 100%;
margin: auto;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}
.alert-text {
display: flex;
flex-wrap: wrap;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
margin-top: 18px;
font-family: 'Lato', sans-serif;
}
.alert-text h2 {
margin: 8px;
font-weight: 400;
}
.alert-text p {
font-size: 18px;
}
.alert-warning .alert-link {
color: #ffffff;
font-weight: 300;
font-size: 18px;
}
</style>
Comments