Store Pickup feature workaround solution - Shopify Plus

[itsanolive]

If you're like me, you don't want to pay $20/month for what should be a basic functionality. I created a workaround to give customers the option of direct shipping or local store pickup in the cart. We also wanted to offer the local store pickup option to customers for free, but struggled with the option still showing/defaulting for customers who chose direct shipping, losing out on shipping revenue.

GitHub Repo with codebase

The following solution is two-fold:

• Cart: shipping/pickup option selection
• Checkout: based on shipping or pickup selection in cart, hide the irrelevant shipping method(s) (only available for Shopify Plus stores with access to checkout.liquid)

Prerequisites:

• Create 2 Shipping methods: "Standard Ground" and "Ship to Store" - you can rename this as you like, you will just have to change the script to match
• Access to your theme code and basic understanding of liquid, HTML, and Javascript/jQuery+

Hopefully one or both of these solutions is helpful to someone out there.

Basic implementation instructions are in the repo, but I can also provide further help if you get stuck! 

[kalyan_chakri]

Hi @itsanolive ,

Your module is good. Thanks for giving it for free.

I am actually trying to work on store pickup option in a plus store. I am generating the hidden fields in shipping step based on the store selected by the user and saving them to cart atttributes using update.js to make them persist. But after navigating to payment step attributes are empty, I am not able to load them again. Can you please help with this? What is the best way to save values between the steps? At this moment I see only way is to save them in my private app DB and load them from DB when in payment step. Not sure whether this is a standard way of keeping the values alive in checkout process.

[itsanolive]

@kalyan_chakri - happy to help!

In the checkout snippet, line 1 loads the attribute selected in the cart:

<span id="ShipMethod" style="display:none;">{{checkout.attributes['ShipMethod']}}</span>

Then the javascript extracts that value as a variable for you to use as needed. If you're not getting anything from that checkout.attribute, it might not be getting saved correctly in the cart. It should be saved via liquid, not javascript. This Shopify UI Elements Generator is really useful for that part.

Hope that helps! If not, could you provide some more specifics on your cart selection liquid code and what your javascript looks like?

[kalyan_chakri]

Hi @itsanolive  able to solve that using hidden checkout attribute fields. Shopify has provision for that. Our solution is already Live. Thanks for help.