How to book a delivery day but limit availability

Hi there, 

I am trying to set up my ecommerce store to take bookings on specific dates, however limit the availability on each day. I want this to connect to either the product or checkout so that it is one user journey. 

How can I do this please?

So far I have tried Acuity and customising the checkout but none of these are the right solution. 

If there is no current solution, can a Squarespace developer help with a custom solution?

Many thanks,

Elise

27 minutes ago, Elis_e said:

I am trying to set up my ecommerce store to take bookings on specific dates, however limit the availability on each day.

Can you provide some more context to help us understand the requirements? A working link to the site often helps, even if it is a work in progress.

For example, what will customers be booking and what duration are they? Do they purchase a single "booking" per order, or multiple items? And so on.

Hi Paul!

Thanks for getting back to me so quickly - very much appreciated.

Here is the link:

www.theinspiredsoulcollective.com.au

Password: Elise

The website will sell grazing boxes that are delivered locally by the business. Currently everything is done via direct communication with the customers who will select a delivery date upon booking for when grazing box delivered. However the business can only accept so many orders on one day - to support this online, I am trying to set up a seamless customer journey where the customer will select their box > select their delivery date > check-out online. 

What are your thoughts? 🙂
 

Hi @Elis_e I'm trying to do the same for a website I'm designing. I'm interested - did you find a solution for this? Many thanks

2 hours ago, sophieameliadesigns7 said:

Hi @Elis_e I'm trying to do the same for a website I'm designing. I'm interested - did you find a solution for this? Many thanks

You mean to allow a datepicker with timeframe

There are multiple solutions here. None of them are perfect – yet. But we're getting closer and closer. Currently I've found 5 different ways to do this. Each have their pros and cons. 

On 9/9/2020 at 1:30 PM, Elis_e said:

 I am trying to set up a seamless customer journey where the customer will select their box > select their delivery date > check-out online. 

Check out this video. This is the best solution I've been able to create for what you're describing.

The details will vary a LOT depending on your site but the video example was done like this:

1. Use  header code injection to check to check if the user is in the cart page 

if(window.location.pathname.startsWith("/cart")){
// code here
}

2. Create scheduling iframe as javascript variable

var acuityIframe = '<div id="spacer-before-acuity"></div><h2 class="_9Dk3d9xee cart-title">CHOOSE PICKUP TIME</h2><iframe src="https://app.squarespacescheduling.com/schedule.php?owner=' + acuityOwner + '" title="Schedule Appointment" width="100%" height="800" frameBorder="0"></iframe>';

Use a function like this to add it after the .cart-container

var insertAcuityIframeAfterElement = function(whichElement){
$( document ).ready(function() {
    $(acuityIframe).insertAfter(whichElement);
});
}

Then use integrations in scheduling, and to a custom conversion integration add this javascript

window.top.location = 'https://www.yoursite.com/checkout';

You can also add a loading spinner to the final page of scheduling – otherwise the flash of this page would be confusing. 

Other methods 

Video: Add Scheduling AFTER payment / checkout 
This we can do by adding the Scheduling Widget to the Order Confirmed –code injection -field with some jQuery

Video: Sell products via acuity - This solution would work if your customers buy only 1 product per order. Also if you have just a few products as it takes a bit effort to manage the products (and their prices and images) in both Squarespace and Scheduling. 

Also check this out as it might be helpful for your use-case

Other methods not using Acuity/Squarespace Scheduling:

Video: Add date picker to a product 
(You can also add a datepicker plugin)

Video: Add date picker to checkout

Shopify

Use Shopify Pay Button and Shopify Appointment app - However these seem to have the same limit as using Sell products via acuity approach – meaning that you order 1 product and schedule. I might be wrong. I'll look into it. 

More info etc

Checkout my  blog post about combining Scheduling with Squarespace Ecommerce Checkout (which I'll try to update). Let me know if you have more questions. Or if you need more help, get in touch with me via https://codeandtonic.com/contact

It’s been a few years since this post. Any updates? I’m building a grazing box website too with hopes to select multiple products (types of food tables boxes and cakes), add service such as set up (for a fee) or delivery (for a fee), and have them have the option to schedule pickup (for free). They need to be able to select the date that’s available and it becomes unavailable once two events land on that same day. 
 

in planning stages only. No site to see yet. Any suggestions on flow would be appreciated 
 

ideas?

Thank you. 

On 1/16/2023 at 11:41 PM, rebeccamousseau said:

It’s been a few years since this post. Any updates?

Hi Rebecca

I feel your pain because things haven't changed since this thread was opened.

The Commerce and Scheduling features are still on separate platforms with separate checkouts (and separate payment options!) so there still isn't a way to reliably integrate them to create a single "purchase products and book a time" workflow. 

As @codeandtonic pointed out above, workarounds are possible but I think we'd all agree that the user experience will be poor, which means potential customers will struggle to use it and it won't convert.

Don't let this stop the discussion though. I enjoyed @codeandtonic's post and I'd love others to post their ideas.

Did this help? Please give feedback by clicking an icon below  ⬇️