Using Stripe Checkout for card payment

Chiefsub68 · September 7, 2019, 11:54pm

Could anyone spare a few moments to provide a point by point walk-through of embedding Stripe checkout card payment into a site, please?

Also see Integrate stripe into blocs - SOLVED

Thanks,

Will

PeteSharp · September 8, 2019, 6:57am

Umm. Looks like you answered your own question.

Chiefsub68 · September 8, 2019, 7:11am

Sorry, I’ve read that piece. What I’m actually wondering is if the entire code goes into the HTML block or whether any goes into the page header.

PeteSharp · September 8, 2019, 9:19am

Oh right. I am planning on implementing Stripe in the next several weeks. But haven’t done it before myself.

Depends how you plan to use it. But going off the other thread it looks to me like you would just post the whole snippet code into a code block.

eagle · September 8, 2019, 1:00pm

I have stripe working using checkout. It is for a Home Owners website so I have just a single product.

What I did was setup the product on the stripe dashboard (be sure you add the domains you are going to use checkout as well in the dashboard), copied the code snippet into a HTML bric and that is all there is to it…

Also, I would use SSL for the website…

Chiefsub68 · September 8, 2019, 3:57pm

Thanks – that makes sense. I could see how to set up Dashboard but I couldn’t find out how to dovetail it with Blocs. I believe Stripe now demands you use https:// to access its system.

Chiefsub68 · September 8, 2019, 3:58pm

… also do you have a URL so I can take a look, please?

eagle · September 8, 2019, 4:57pm

Contained it the document above it has the following:

To use Checkout on your website, you must add a snippet of code that includes the desired SKU or plan ID. You can use the Dashboard to generate the necessary code, or you can write it yourself.
Generate in Dashboard Write it yourself
In the Products section of the Dashboard, select the product that you want to sell. In the product detail view, click the Use with Checkout button next to a SKU or plan to generate a code snippet that you can add to your website.

When you click the “Use with Checkout” you will see the code to add to the Blocs HTML bric, the only other thing I did was to create a success page and cancel page on the website to handle those two actions…

I am not sure of what URL are asking about, but all the code you need you can get from the product page. Again my use was for just one product so it was simple to plug in the code snippet to blocs.

One more thing…I ran into a problem with the check button that was generated lost the pointer setting, so I had to add the following while customizing the “Checkout Button”

<button class="button" style="background-color:#797979;cursor: pointer;color:#FFF;padding:8px 12px;border:0;border-radius:4px;font-size:1em" id="checkout-button-sku_XXXXXXXXXXX" role="link">
  Credit Card Payment
</button>