Blackout Dates based on product or product information in your cart

Supertime can add Blackout Dates based on product information in the cart by adding some custom theme integration code. Note: this is an advanced tutorial below.

Here is the format for the code snippet that Supertime expects for reading in additional blackout dates:

<script> SupertimeProductSettings = { 
blackoutDatesGlobal: [], // array of strings, formatted "yyyy-mm-dd" 
blackoutDatesByMethod: [{ dates: [], deliveryMethod: ""}] }; // array of the following: {dates: array of strings, method: only blackout dates in schedule where method matches your Supertime Delivery Method }
</script>

Here is a sample snippet that to insert in your relevant liquid files (usually the cart-template.liquid file)

<script> SupertimeProductSettings = { 
blackoutDatesGlobal: ["2022-07-04", "2022-07-05"], 
blackoutDatesByMethod: [{dates: ["2022-07-07", "2022-07-08"], deliveryMethod: "Local Delivery"}] };
</script>

We have provided an example use case below -- this is an advanced tutorial where you may need help from a Shopify Partner that specializes in custom theme development.

Example: Add Specific Blackout Dates in Supertime when only certain products are present with a desired Product Tag

1. Copy this Snippet below - this will add Blackout Dates only when products with the tag "Seasonal" are present:

{% for item in cart.items %}
  {% for tag in item.product.tags %}
    {% if tag contains "Seasonal" %}
      <script> SupertimeProductSettings = { 
blackoutDatesGlobal: ["2022-07-04", "2022-07-05"], 
blackoutDatesByMethod: [{dates: ["2022-07-07", "2022-07-08"], deliveryMethod: "Local Delivery"}] };
</script>
     {% break %}
    {% endif %}
  {% endfor %}
{% endfor %}

2. Locate the appropriate liquid file (e.g. the cart-template.liquid file in Debut or the main-cart-footer.liquid file in Dawn or 2.0 Free themes) and edit the theme code in this file.

3. Paste the snippet above at the top of the desired liquid file.

Example: Add Blackout Dates for the next 2 weeks in Supertime when only certain products are present with a desired Product Tag

1. Copy this Snippet below - this will add Blackout Dates for the next 14 days (see the howManyDays value) when products with the tag "Seasonal" are present for dates in schedule from Supertime's delivery method that is named "Local Delivery":

{% for item in cart.items %}
  {% for tag in item.product.tags %}
    {% if tag contains "Seasonal" %}
      <script> 
        Date.prototype.addDays = function(days) {
          var date = new Date(this.valueOf());
          date.setDate(date.getDate() + days);
          return date;
        }


      function getListOfDates(startDate, stopDate) {
        var dateArray = new Array();
        var currentDate = startDate;
        while (currentDate <= stopDate) {
            var dateString = new Date(currentDate).toISOString().slice(0,10)
            dateArray.push(dateString);
            currentDate = currentDate.addDays(1)
            console.log(currentDate)
        }
        return dateArray;
      }


      var howManyDays = 14;
      var blackoutDates = getListOfDates(new Date(), new Date().addDays(howManyDays))
        
        SupertimeProductSettings = { 
        blackoutDatesByMethod: [{dates: blackoutDates, deliveryMethod: "Local Delivery"}] 
      };        
      </script>
     {% break %}
    {% endif %}
  {% endfor %}
{% endfor %}

2. Locate the appropriate liquid file (e.g. the cart-template.liquid file in Debut or the main-cart-footer.liquid file in Dawn or 2.0 Free themes) and edit the theme code in this file.

3. Paste the snippet above at the top of the desired liquid file.

Example: Add Blackout Dates for specific weekdays for the next 30 days in Supertime when only certain products are present with a desired Product Tag

1. Copy this Snippet below - this will add Blackout Dates for Mondays in the next 30 days (see the howManyDays value) when products with the tag "Seasonal" are present for dates in schedule from Supertime's delivery method that is named "Local Delivery" -- we have an if statement that checks that the weekday is Monday (e.g. getDay() === 1) before we add it to the blackout list:

{% for item in cart.items %}
  {% for tag in item.product.tags %}
    {% if tag contains "Seasonal" %}
      <script> 
        Date.prototype.addDays = function(days) {
          var date = new Date(this.valueOf());
          date.setDate(date.getDate() + days);
          return date;
        }


      function getListOfDates(startDate, stopDate) {
        var dateArray = new Array();
        var currentDate = startDate;
        while (currentDate <= stopDate) {
            var date = new Date(currentDate)
            var dateString = date.toISOString().slice(0,10)
            if (date.getDay() === 1) {
                dateArray.push(dateString);
	    }
            currentDate = currentDate.addDays(1)
            console.log(currentDate)
        }
        return dateArray;
      }


      var howManyDays = 30;
      var blackoutDates = getListOfDates(new Date(), new Date().addDays(howManyDays))
        
        SupertimeProductSettings = { 
        blackoutDatesByMethod: [{dates: blackoutDates, deliveryMethod: "Local Delivery"}] 
      };        
      </script>
     {% break %}
    {% endif %}
  {% endfor %}
{% endfor %}

2. Locate the appropriate liquid file (e.g. the cart-template.liquid file in Debut or the main-cart-footer.liquid file in Dawn or 2.0 Free themes) and edit the theme code in this file.

3. Paste the snippet above at the top of the desired liquid file.

Example: Add Blackout Dates for specific weekdays for the next 7 days in Supertime after a certain date and time

1. Copy this Snippet below - this will add a Blackout Date for the upcoming Monday in the next 7 days (see the howManyDays value) if today is Saturday, and we are past 12:00pm to the Local Delivery method schedule -- we have an if statement that checks that the weekday is Monday (e.g. getDay() === 1) before we add it to the blackout list:

  <script> 
        Date.prototype.addDays = function(days) {
          var date = new Date(this.valueOf());
          date.setDate(date.getDate() + days);
          return date;
        }


      function getListOfDates(startDate, stopDate) {
        var dateArray = new Array();
        var currentDate = startDate;
        while (currentDate <= stopDate) {
            var date = new Date(currentDate)
            var dateString = date.toISOString().slice(0,10)
            // getDay() === 1 is Monday
            if (date.getDay() === 1) {
                dateArray.push(dateString);
	    }
            currentDate = currentDate.addDays(1)
            console.log(currentDate)
        }
        return dateArray;
      }


      var howManyDays = 7;
      var blackoutDates = getListOfDates(new Date(), new Date().addDays(howManyDays))
      var today = new Date();
        // getDay() === 5 is Saturday
        if (today.getDay() === 5 && today.getHours() >= 12) {
        SupertimeProductSettings = { 
        blackoutDatesByMethod: [{dates: blackoutDates, deliveryMethod: "Local Delivery"}] 
        }
      };        
   </script>

2. Locate the appropriate liquid file (e.g. the cart-template.liquid file in Debut or the main-cart-footer.liquid file in Dawn or 2.0 Free themes) and edit the theme code in this file.

3. Paste the snippet above at the top of the desired liquid file.