Make the Store Notice dismissible.

* Adds new-style css classes to store notice
* Adds a ‘dismiss’ link to the store notice
* Hide the notice when the ‘dismiss’ link is clicked and set a cookie
to keep it hidden

assets/css/woocommerce.scss

@@ -16,8 +16,9 @@
 /**
  * Global styles
  */
-p.demo_store {
+p.demo_store,
-	position: fixed;
+.woocommerce-store-notice {
+	position: absolute;
 	top: 0;
 	left: 0;
 	right: 0;
@@ -30,8 +31,11 @@ p.demo_store {
 	color: $primarytext;
 	z-index: 99998;
 	box-shadow: 0 1px 1em rgba(0, 0, 0, 0.2);
+	display: none;
+
 	a {
 		color: $primarytext;
+		text-decoration: underline;
 	}
 }
 

assets/js/frontend/woocommerce.js

@@ -12,4 +12,17 @@ jQuery( function( $ ) {
 			$( this ).val( min );
 		}
 	});
+
+	// Set a cookie and hide the store notice when the dismiss button is clicked
+	jQuery( '.woocommerce-store-notice__dismiss-link' ).click( function() {
+		jQuery.cookie( 'store_notice', 'hidden', { path: '/' } );
+		jQuery( '.woocommerce-store-notice' ).hide();
+	});
+
+	// Check the value of that cookie and show/hide the notice accordingly
+	if ( 'hidden' == jQuery.cookie( 'store_notice' ) ) {
+		jQuery( '.woocommerce-store-notice' ).hide();
+	} else {
+		jQuery( '.woocommerce-store-notice' ).show();
+	}
 });

assets/js/frontend/woocommerce.min.js

@@ -1 +1 @@
-jQuery(function(a){a(".woocommerce-ordering").on("change","select.orderby",function(){a(this).closest("form").submit()}),a("input.qty:not(.product-quantity input.qty)").each(function(){var b=parseFloat(a(this).attr("min"));b>=0&&parseFloat(a(this).val())<b&&a(this).val(b)})});
+jQuery(function(a){a(".woocommerce-ordering").on("change","select.orderby",function(){a(this).closest("form").submit()}),a("input.qty:not(.product-quantity input.qty)").each(function(){var b=parseFloat(a(this).attr("min"));b>=0&&parseFloat(a(this).val())<b&&a(this).val(b)}),jQuery(".woocommerce-store-notice__dismiss-link").click(function(){jQuery.cookie("store_notice","hidden",{path:"/"}),jQuery(".woocommerce-store-notice").hide()}),"hidden"==jQuery.cookie("store_notice")?jQuery(".woocommerce-store-notice").hide():jQuery(".woocommerce-store-notice").show()});

includes/wc-template-functions.php

@@ -494,7 +494,7 @@ if ( ! function_exists( 'woocommerce_demo_store' ) ) {
 			$notice = __( 'This is a demo store for testing purposes — no orders shall be fulfilled.', 'woocommerce' );
 		}
 
-		echo apply_filters( 'woocommerce_demo_store', '<p class="demo_store">' . wp_kses_post( $notice ) . '</p>', $notice );
+		echo apply_filters( 'woocommerce_demo_store', '<p class="woocommerce-store-notice demo_store">' . wp_kses_post( $notice ) . ' <a href="#" class="woocommerce-store-notice__dismiss-link">' . __( 'Dismiss', 'woocommerce' ) . '</a></p>', $notice );
 	}
 }