How to use the Stripe Shipping Options shipping rate ID in Embedded Checkout

The Wappler community is always helpful when I need help, so I love when I can give back. @TheBotfather and I were trying to figure out how to use the shipping rate ID in the Stripe Embedded Checkout shipping options. It's actually quite simple once you know which array key to use. The instinct is to use 'id' however, the correct key is 'shipping_rate'.
In this tutorial we'll be using 3 Data Management Actions. 'Create Array List', 'Add in Array List' and 'Get Array List Value'.

The shipping options parameter expects an array so we'll first add an action to create an array using 'Create Array List'. Give the list a name and click on 'Define Schema' and add a text variable called 'shipping_rate'

Now add the 'Add in Array List' action and choose the list you created with the 'shipping_rate' variable from the dropdown and put the shipping rate id as the value for the 'shipping_rate' variable.

You can find the shipping rate id in your Stripe dashboard-->Product Catalog-->Shipping Rates

Next add the 'Get Array List Value' action and give it a name then choose the shipping rate list from the dropdown. No need to output it.

Finally, set the value of the shipping options to the name of the 'Get Array List Value' action using the data picker and you're done!

The shipping rate should appear in the embedded checkout on the front end now.

If you'd like to have more than one shipping option, just add another 'Add in Array List' action with another shipping rate id

Hope this helps someone. :slightly_smiling_face:

-Twitch

2 Likes

Twitch fantastic explanation-Thank you! Before I try it I have a quick question:
This explanation you are giving is more for a static type setup on the shipping rates, correct? Because If I am doing my products dynamically and I have an additional table setup in my database for shipping rates I could just use that instead. correct?

1 Like

Thanks @jpena. I actually have several different Add In Array List actions to add in shipping rates based on different conditions. One being that if the total of the purchase is $30 or more, then it puts a free shipping option, or if they purchase 10 items or more, they get a bulk discount of 20%. All the shipping rates are saved in my database and I have one of my Add In Array List actions inside a repeat. I have a query that gets all the rates that are marked as "Add at checkout" and it will add those extra shipping options. These are ones that give the customer the option to choose a more expensive priority shipping etc.

-Twitch

thanks again, but having a prob getting my head around this since this is not what I had in mind to program. Here is what my current SA look like. I'm still trying to figure out the different array lists, etc - let alone the order needed as you explained of the create array list, get array list and add in array.

I think you forgot to post what your SA looks like. :upside_down_face:

my bad:

So does that query return shipping rates?

No it doesn't but confused on how and when to call a query I made separately. This is the main checkout sale process built using all the docs and Teodores help as well. Site works great, but want to get shipping done and also the success page showing the product and sale and a way for them to make an account.
http://estateliquidationsa.com/index3.html

Getting this when clicking your link.