Sample Content for Ocean Sitewide Sale in WooCommerce

Want to set up a Sitewide Sale for your ecommerce site just like the demo screenshot? This guide includes the example text and settings we used to create the “Ocean” Landing Page and Banner demo for WooCommerce.

Screenshot of the Sitewide Sales Ocean Landing Page for WooCommerce

How to Set Up the Ocean Sale for WooCommerce

Time needed: 30 minutes

Follow these steps to create a Sitewide Sale for WooCommerce that matches our demo site’s “Ocean” screenshots.

Add a new sale.
If you’d like to make a sale that looks like the demo screenshot, begin by navigating to Sitewide Sales > Add New in the WordPress admin.
Fill out your basic sale settings.
Enter your sale’s start and end dates then select the sale type “WooCommerce”. Choose an existing coupon or create a new coupon exclusively for this offer. For more help on this step, please refer to the Sitewide Sales setup guide here.
Generate a Landing Page
In the “Landing Page” section, click the button to “create a new landing page”. This will generate a new page for your sale that includes three variations of the Sale Content block for each period and sets the page template to “Sitewide Sale Page”.
Begin entering the Sale Content and Banner Content
You can now complete the setup by copying and pasting the content from the example text below into the Block Editor > Code View. Be sure to choose “Ocean” as the landing page and banner templates. The example banner text is compatible with any banner location, but for this template we really like the appearance of the “Bottom Right” banner

Screenshot of the Ocean Landing Page for WooCommerce

Screenshot of the Sitewide Sales Ocean Bottom Right Banner for WooCommerce

Example Text From the “Ocean” Demo

	/**
	* Sale Type: WooCommerce
	* Sale Template: Ocean
	*/

	<!-- wp:swsales/sale-content {"period":"pre-sale"} -->
	<div class="wp-block-swsales-sale-content"><!-- wp:heading {"textAlign":"center","level":4} -->
	<h4 class="has-text-align-center">Captain, I see it! The sale is close at hand.</h4>
	<!-- /wp:heading -->

	<!-- wp:heading {"textAlign":"center","level":1} -->
	<h1 class="has-text-align-center">Underwater Sale starting October 2055!</h1>
	<!-- /wp:heading -->

	<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center"}} -->
	<div class="wp-block-buttons"><!-- wp:button {"backgroundColor":"black","style":{"border":{"radius":"100px"}},"fontSize":"medium"} -->
	<div class="wp-block-button has-custom-font-size has-medium-font-size"><a class="wp-block-button__link has-black-background-color has-background" style="border-radius:100px"><strong>Stay Up to Date »</strong></a></div>
	<!-- /wp:button --></div>
	<!-- /wp:buttons --></div>
	<!-- /wp:swsales/sale-content -->

	<!-- wp:swsales/sale-content {"period":"sale"} -->
	<div class="wp-block-swsales-sale-content"><!-- wp:heading {"textAlign":"center","level":4} -->
	<h4 class="has-text-align-center">A pirate's saving around every corner!</h4>
	<!-- /wp:heading -->

	<!-- wp:heading {"textAlign":"center","level":1} -->
	<h1 class="has-text-align-center">Swashbuckler Sale On Now!</h1>
	<!-- /wp:heading -->

	<!-- wp:html -->
	<br>
	<!-- /wp:html -->

	<!-- wp:shortcode -->
	[featured_products]
	<!-- /wp:shortcode --></div>
	<!-- /wp:swsales/sale-content -->

	<!-- wp:swsales/sale-content {"period":"post-sale"} -->
	<div class="wp-block-swsales-sale-content"><!-- wp:heading {"textAlign":"center","level":4} -->
	<h4 class="has-text-align-center">Keep your eye on the horizon for another sale.</h4>
	<!-- /wp:heading -->

	<!-- wp:heading {"textAlign":"center","level":1} -->
	<h1 class="has-text-align-center">Ah, barnacles! The Sale has vanished.</h1>
	<!-- /wp:heading -->

	<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center"}} -->
	<div class="wp-block-buttons"><!-- wp:button {"backgroundColor":"black","style":{"border":{"radius":"100px"}},"fontSize":"medium"} -->
	<div class="wp-block-button has-custom-font-size has-medium-font-size"><a class="wp-block-button__link has-black-background-color has-background" style="border-radius:100px"><strong>Join the List »</strong></a></div>
	<!-- /wp:button --></div>
	<!-- /wp:buttons --></div>
	<!-- /wp:swsales/sale-content -->

	// Banner Title:
	Limited Time Offer

	// Banner Content:
	Use code <strong><u>OCEAN</u></strong> to save 50% throughout the store.

	// Banner Button Text:
	Start Shopping »

view raw WooCommerce-Ocean-Sitewide-Sale.html hosted with ❤ by GitHub

Get Support for Sitewide Sales

If you are having trouble with your sale setup, please open a support ticket. We will be happy to help you set up this demo or answer other questions you may have about the plugin.