Note: Some technical experience required, please reach out to hey@getservicify.com if you need support!
If you want to prevent customers from purchasing a product without a booking, you can modify your Shopify theme to disable the “Add to Cart” button based on a metafield.
Step 1: Create the “Accept Bookings” Metafield
1. Log in to your Shopify admin.
2. Go to Settings > Custom Data > Products.
3. Click Add Definition.
4. Name: Accept Bookings (Namespace & Key will automatically say custom.accept_bookings). Add a description if you wish
5. Type is True or False
6. Click Save
Step 2: Assign the Metafield to a Product
1. Go to Products in your Shopify admin.
2. Select the product that requires a booking.
3. Scroll down to the Metafields section.
4. Find Accept Bookings and set it to True (if the product requires a booking) or False (if it can be purchased normally).
5. Save the product.
Step 3: Modify Your Theme to Disable “Add to Cart”
1. Navigate to Online Store > Themes.
2. Click Customize, then select Edit Code.
3. In the Sections or Snippets folder, find and open the buy-buttons.liquid file.
Note: if you have a buy-buttons liquid file, please reach out to hey@getservicify.com if you need support we can help!
Don't have a buy-buttons liquid file? We recommend engaging your developer as we are not theme experts, but happy to provide guidance where possible!
(A) Add the Following Code to the Top of buy-buttons.liquid
assign accept_bookings = false
if product.selected_or_first_available_variant.metafields.custom.accept_bookings or product.metafields.custom.accept_bookings
assign accept_bookings = true
endif
(B) Update the Add to Cart Button
In the section where you have your button add a clause to make the button disabled if accept bookings is true
Example A)
Example B)
<button type="submit" name="add"
{% if accept_bookings %} disabled {% endif %}>
Add to Cart
</button>
Step 4: Test the Changes
1. Visit a product page that requires a booking.
2. Confirm that the “Add to Cart” button is disabled before Select a Time loads. Select a Time will be clickable.
3. Try a product without the metafield or with “Accept Bookings” set to False – the button should work normally without the temporary disablement.