Site URL: https://www.sunday7pmchoir.com/
Hi Community,
I've tried using Tuanphan's code below in Home > Settings > Advanced > Code Injection > Header to add a First Name and Last Name to the Newsletter Popup, and while it worked, I've temporarily removed it and have a few questions:
1) How can I add (and change) a delay as to when the pop-up appears, after a person gets to the website
2) How can I have only the first name added (vs. the first name and last name)
3) How can you change the font colour?
4) Is it possible to add a photo as the background for the popup (vs a solid colour)
Thanks for your help!
Ed
_____
Code sourced from Additional Fields in Promotional Popup - BEAVER HERO, made a small tweak to background colour:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
function handlePopUp() {
var popup = $('#block-yui_3_17_2_1_1621388331590_5219');
var isHidePopup = getCookie('coookieIsHidePopup');
if('true'!==isHidePopup){
popup.css('display', 'block');
}
// Hide popup when clicking outsite
$(document).click(function (e){
if('block' == popup.css('display')) {
if (!popup.is(e.target) && popup.has(e.target).length === 0){
hidePopupAndSetCookie( popup, 1 );
}
}
});
// Hide popup when close or submit
$('#close-popup, .newsletter-form-button, header.newsletter-form-header').click(function() {
hidePopupAndSetCookie( popup, 1 );
});
}
function hidePopupAndSetCookie(popup, time) {
popup.hide();
setCookie('coookieIsHidePopup', 'true', 1);
}
function setCookie(cname, cvalue, exdays) {
var now = new Date();
//d.setTime(d.getTime() + (exdays*24*60*60*1000));
//var expires = "expires="+ d.toUTCString();
//window.document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
now.setTime(now.getTime() + 24 * 3600 * 1000);
document.cookie = "name=value; expires=" + now.toUTCString() + "; path=/";
}
function getCookie(cname) {
var name = cname + "=";
var decodedCookie = decodeURIComponent(window.document.cookie);
var ca = decodedCookie.split(';');
for(var i = 0; i <ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
handlePopUp();
});
</script>
<style>
#block-yui_3_17_2_1_1621388331590_5219 {
position: fixed;
width: 340px;
background-color: #0080FF; /* newsletter background */
top: 100px;
left: 0;
right: 0;
margin: 0 auto;
z-index: 999;
display: none;
}
/* Close icon */
#block-yui_3_17_2_1_1621388331590_5219 header.newsletter-form-header:before {
content: "\e01a";
font-family: 'squarespace-ui-font';
color: white;
border: 1px solid white;
position: absolute;
right: -30px;
top: 0;
padding: 5px;
line-height: 15px;
z-index: 20000;
cursor: pointer;
}
</style>
Beyondspace reacted to a post in a topic:
Additional questions on adding first and last name to Squarespace Newsletter Popup
Director changed their profile photo
