I am trying to enhance the Shipping Selection page of our checkout process so that it will allow customers to request delivery or pickup via three basic options:
-
Pay for shipping (ex. FedEx Ground, UPS, Next Day Air, etc.) (existing feature, no enhancement needed)
-
Opt to have us apply shipping charges separately to their own shipper account, during the pack/shipping stage of the order., whereby the shipping selection page needs to have a couple of text boxes displayed so customers can type in their shipper account information.
-
Local pick-up the order from our warehouse address (existing feature no enhancement needed)
If customer selects the second option, “Use my collect shipper account”, then a text box appears for the
customer to type in their Shipper account number, and select which level of service to use. If the text box is displayed, then it is required to have information typed into it. It cannot be blank if option 2 is picked
I created an app using the Checkout UI extension in my Shopify development store to implement this option in my shopify store.
-
If the customer selects the checkbox ‘Collect Option: Apply shipping to my shipper account,’ three text boxes will appear for them to type in their Shipper Account Number, Courier Name, and Service Level. If the checkbox is not selected, the text boxes will not appear. This has been already implemented.
-
The customer can select the ‘Collect Option: Apply shipping to my shipper account’ checkbox, filled out the three text boxes, and moved to the next page.
-
The Shipper Account Number, Courier Name, and Service Level details are shown below the shipping method.
-
When the customer select second option, “Use my collect shipper account”, then it should hide the shipping method in the checkout page, check screenshot for what I am trying to achieve and share your suggestions on how this can be implemented.