Is it possible to exclude products from free shipping rule

Support
,
#1

Is it possible to exclude products (perhaps with boolean property from free shipping or if they are included in a cart then at checkout free shipping rule gets overridden?

#2

@daveharrisonnet
You’ll be able to override the shipping-rates-list component to either sort or filter any of the shipping methods and if you combine a window function to check for if a certain product is added to the cart to exclude the free shipping.

For instance, here’s how to filter the shipping methods combined with window function that would check for certain items.

<div hidden id="snipcart" data-api-key="<API_KEY>">
<shipping-rates-list>
      <component
          class="snipcart-shipping-rates-list"
          :is="tag"
          v-if="!loading"
      >
          <shipping-rates-list-item
              v-for="rate in rates.filter(window.filterShipping)"
              :key="rate.slug"
              :rate="rate"
              :class="{'snipcart-shipping-rates-list-item--highlight': selectedRate == rate.slug}"
          >
          </shipping-rates-list-item>
      </component>
  </shipping-rates-list>
</div>

<script>
window.filterShipping = function(rate) {
  const cartHasItem = Snipcart.store.getState().cart.items.items.some(e => e.id === 'Productid');
  if (rate.cost === 0 && cartHasItem) {
    return false // Filters out the rate
  }
console.log('not the item')
  return true // Keeps the rate in the cart
}

</script>
#3

@ppanth
Awesome
Thanks
How would this look for multiple items? would it be an array of productIds or just a series of ‘or’ operators
Basically we want to say if cartHasAnyOfTheseItems = and then a bunch of ids

Also it is complicated a little in that we have a free collection option THAT we DO want to show for all products! lol and that shipping option has a cost of 0
Perhaps I can identify the free shipping rate other than by its cost being £0, maybe by its id? or another identifier? Name includes ‘Free Shipping’?? which differentiates it from Free Collection

Almost there but not quite
Appreciate any help you can offer to get me over the line :wink:

Dave

#4

If you would like to check for multiple items then you would create an array and use some function to check if the item in the cart matches the item in the array. Something like this:

<script>
  const materials = [
  'Tavira Skyline-ultraHD Photo Print',
  'test',
  'painting_lessons'
];
window.filterShipping = function(rate) {
  const cartHasItem = Snipcart.store.getState().cart.items.items.some(e => materials.includes(e.id));
  console.log(rate.description)
  console.log(rate.slug)
  if (rate.cost === 0 && cartHasItem) {
    return false // Filters out the rate
  }
console.log('not the item')
  return true // Keeps the rate in the cart
}


window.sortMethod = function(a,b) {
  console.log('window.sortMethod', {a, b})
  return a - b
}


</script>

And as for the properties of rates, you could check it by

  • description (the name of the shipping)

  • cost and

  • slug (name of the shipping in lowercase and spaces replaced by ‘-’)

and mentioned here

1 Like