I mentioned the sliding pop-up that my client wanted on her page here. I fixed it where it would pop-up – or slide in – every time someone visited the home page.
After the first couple of visits, I was irritated by the pop-up and didn’t want to see it again. I assume that other visitors get just as tired of the pop-up, if not more so.
My solution was to add a checkbox to allow the visitor to hide the pop-up so they didn’t see it again. When they click the checkbox, the pop-up disappears and doesn’t show up again. At least not for a very long time. Or until the visitor deletes her cookies.
I added a jQuery function to set a cookie for 365 days when the checkbox is clicked and then close the pop-up. I used the javascript setCookie function I found at W3.
//
jQuery('#dontshow').click(function() {
setCookie('hide_newsletter', 1, 365); //set the cookie for one year
jQuery('#element_to_pop_up').bPopup().close();
});
function setCookie(c_name,value,exdays) {
var exdate=new Date();
exdate.setDate(exdate.getDate() + exdays);
var c_value=escape(value) + ((exdays==null) ? '' : '; expires='+exdate.toUTCString());
document.cookie=c_name + '=' + c_value;
}
//
Each time someone comes to the page, it checks to see if the cookie has been set. If it hasn’t been set, then the pop-up appears. If the visitor has been there before and set the cookie by clicking the checkbox, the pop-up doesn’t show. No more irritating modal window to get in my way. Especially nice when you are editing and debugging the site.
//
if (!isset($_COOKIE['hide_newsletter'])) {
if (is_front_page()) {
// php and javascript code for popup
}
}
//
I used php to check if the cookie has been set. You can find the code for the popup here. Since this is a WordPress site, I added all this code to the footer credits hook function in my functons.php file of my child theme.