Developed a fully customized pickup scheduling system for a Shopify bakery store using JavaScript and Shopify cart attributes, eliminating the need for expensive third-party scheduling apps. The solution improves the customer experience by ensuring customers can only schedule pickups during available business hours and on approved pickup dates

The bakery required a pickup system that could:

Collect the customer's phone number before checkout.

Require customers to select a pickup date and time.

Prevent pickups on Sundays and Mondays. Temporarily block specific closure dates.

Restrict pickup times to business operating hours.

Prevent customers from completing checkout if invalid pickup information was selected.

Built a custom JavaScript validation system integrated into the Shopify cart page. Features Implemented

Custom Phone Number field

Pickup Date selector

Pickup Time selector

Required field validation before checkout

Business hour validation (1:00 PM – 8:00 PM)

Permanent weekly closures (Sunday & Monday)

Temporary holiday/maintenance closures for selected dates

Instant validation when customers select unavailable dates

Checkout validation to prevent invalid orders from being submitted

Shopify Liquid

HTML

CSS

JavaScript (Vanilla JS)

Shopify Cart Attributes

Dawn Theme

Eliminated the need for a paid scheduling app.

Reduced the likelihood of invalid pickup bookings.

Improved customer experience with immediate feedback.

Allowed the bakery owner to temporarily block special closure dates while keeping regular weekly availability rules.

Created a flexible system that can easily be updated by modifying only a few lines of code.