Stripe
Financial infrastructure for the internet
Start new thread
Edwin Arbus

Stripe Elements - Beautiful, smart checkout flows 💳💸

by
OpenAI
•

Stripe Elements are rich, pre-built UI components that help you create your own pixel-perfect checkout flows across desktop and mobile.

Add a comment

Replies

Best
Edwin Arbus
OpenAI
Hunter
Ever wish you could put Stripe’s front-end, design, and analytics teams to work for you? With Elements, we work to optimize your payment flow! Stripe Elements are rich, pre-built UI components that help you create your own pixel-perfect checkout flows across desktop and mobile. Check out some examples: https://stripe.com/elements/exam...
Mike Coutermarsh
PlanetScale Boost
@edwinwee Wow - useful. Are there versions of these components available in React?
Edwin Arbus
OpenAI
Hunter
Mike Coutermarsh
PlanetScale Boost
@edwinwee Was not expecting that. 😻
Stéphane Giron
@edwinwee If I'm not wrong with elements, email is no longer mandatory for creating the token ? ?
Edwin Arbus
OpenAI
Hunter
@st3ph No email required. Try it out yourself in our docs, where you can create test tokens with just card details: https://stripe.com/docs/elements
Veasna Onn
Hi Edwin. Can this be embedded in an email newsletter so that customers can checkout seamlessly without being redirected to a storefront?
Edwin Arbus
OpenAI
Hunter
@veasnaonn No, it can't be embedded in emails right now, but that's a really neat idea!
Veasna Onn
@edwinwee Yes! I’ve been exchanging emails with your team about this. I hope itcan come to fruition soon. It will remove such a big barrier to e-commerce and digital marketing. I would love to be a guinea pig for your team if you can make this happen 😬
Jijo Sunny
Voicenotes

Stripe checkout designs were not bad, but this is taking it to another level. Classic Stripe.

Pros:

Straightforward and killer-looking, as always.

Cons:

All good

Ryan Born
Is there a way to reflect trials from the payment screen? We offer a free 1-month trial which is defined in our Stripe subscription, but the Stripe checkout just says pay $x, when in reality it's free for the first month.
Edwin Arbus
OpenAI
Hunter
@b0rno It looks like you're using Stripe Checkout—are you setting a `data-amount` attribute? That's what's displayed, and it's for display purposes only. For trials, don't set it! This JS Fiddle might help: https://jsfiddle.net/ayx6vgh0/
Ryan Born
@edwinwee Thanks so much! That did indeed fix it.
Edwin Arbus
OpenAI
Hunter
@b0rno 👍
Nick O'Neill
The Nifty
This is super cool. It would be awesome if the next step was for Stripe to offer a hosted version of this page! Setting up payment pages can be cumbersome in that I need to develop server-side logic for a payment to complete. If Stripe could take on that aspect of things it would be killer. The existing mobile checkout flow feels like hosted payment pages are something Stripe could turn on with a flick of a switch. Just wondering what has been preventing them from doing so aside from the fact that it will knock a lot of people out of business who are built on their platform :) One other suggestion: have a place where developers and designers can share CSS styles/templates using Stripe Elements.
Ben King
Worklight
Nick O'Neill
The Nifty
@benkingntu Stripe Checkout is not a hosted payment form. You embed it on your website...
Ben King
Worklight
@allnick Ah I get you. Stripe as a business has been focused on targeting developers thus far, so I imagine providing a full hosted service is quite unlikely, but you never know.
Jijo Sunny
Voicenotes
@benkingntu Not really. They built Atlas for entrepreneurs everywhere. Stripe is a startup-focused company more than a developer-focused one.
Dan Rowden
ilo
@allnick Have you checked out plasso.com? Stripe-powered, hosted checkouts (and more).
Bilal Karim

Bonus: Landing pages are always a joy to browse.

Pros:

Quick and easy integration with excellent documentation. Very helpful for someone who has never worked with online payments before.

Cons:

None

Stan Podolski
Look very good. We definitely will try to implement it
Edwin Arbus
OpenAI
Hunter
@ipstas Let us know if you have any questions while you're integrating! Docs: https://stripe.com/docs/elements
Nino
Read2Me
I wish I could use Stripe, but my company is registered in Croatia, so I am stuck with Braintree.
Edwin Arbus
OpenAI
Hunter
@ninoskopac If you're interested in setting up a US-based business, you might want to check out Stripe Atlas: https://www.producthunt.com/post...
Nino
Read2Me
@edwinwee I'm aware of it, thanks, but I already have a company in Croatia.
Ciocanel Razvan
EpicPxls

I've been integrating stripe with client products for a long time now and this is a nice addition.

Pros:

Easy to integrate

Cons:

Not much really

Masoud Ardestani
Rapha
This is clean!
123
Next
Last