PHP
function ss_notice_bar() {
if ( !isset($_COOKIE['ss_notice_dismissed']) || $_COOKIE['ss_notice_dismissed'] !== 'true' ) {
echo '
<div id="ss-notice-bar">
<p>Your custom notice bar using a snippet.</p>
<span id="ss-notice-dismiss" aria-label="Dismiss">X</span>
</div>';
}
}
add_action('wp_body_open', 'ss_notice_bar');PHP
function ss_notice_body_class($classes) {
if ( !isset($_COOKIE['ss_notice_dismissed']) || $_COOKIE['ss_notice_dismissed'] !== 'true' ) {
$classes[] = 'has-notice-bar';
}
return $classes;
}
add_filter('body_class', 'ss_notice_body_class');PHP
function ss_notice_bar_styles() {
echo '
<style type="text/css">
/* Besure to update your header Class or ID */
.has-notice-bar, .has-notice-bar header {
margin-top: 50px; /* Adjust this value according to the height of your notice bar */
}
.admin-bar #ss-notice-bar{
margin-top: 32px;
}
/* Besure to update your header Class or ID */
.admin-bar.has-notice-bar header#my-header{
top: 82px;
}
#ss-notice-bar {
background-color: #0047ff;
color: #fff;
padding: 15px;
text-align: center;
position: fixed;
top: 0;
width: 100%;
z-index: 1000;
}
#ss-notice-dismiss {
background: none;
border: none;
color: #fff;
font-weight: bold;
margin-left: 15px;
cursor: pointer;
position: absolute;
right: 15px;
top: 15px;
}
</style>';
}
add_action('wp_head', 'ss_notice_bar_styles');PHP
function ss_notice_bar_scripts() {
echo '
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function() {
const dismissButton = document.getElementById("ss-notice-dismiss");
const noticeBar = document.getElementById("ss-notice-bar");
const body = document.body;
if (dismissButton && noticeBar) {
dismissButton.addEventListener("click", function() {
noticeBar.style.display = "none";
body.classList.remove("has-notice-bar");
// Set a cookie to remember the dismissal
document.cookie = "ss_notice_dismissed=true; path=/; max-age=" + (60*60*24*30); // 30 days
});
}
});
</script>';
}
add_action('wp_footer', 'ss_notice_bar_scripts', 20);