JohnnyB - Link | Stripe Developers | Page 1

white swallow Aug 22, 2022, 5:00 PM

#

HI 👋
Unfortunately that level of customization is not possible currently with the Payment Element

split umbra Aug 22, 2022, 5:02 PM

#

and Card Element doesn't allow wallets nor use of Link, correct?

white swallow Aug 22, 2022, 5:02 PM

#

Correct. The Card Element is only for collecting Credit Card information

split umbra Aug 22, 2022, 5:03 PM

#

any logic/alternatives to minimize the card number, date, and cvc in a single field in payment element?

white swallow Aug 22, 2022, 5:04 PM

#

I don't think so. But all the customization options we expose can be found here: https://stripe.com/docs/elements/appearance-api

split umbra Aug 22, 2022, 5:04 PM

#

it's such an elegant solution but limited/gridlocked to multiple input fields that capture the same

#

can we float as a feature suggestion? seems natural

#

i mean, look at that!

white swallow Aug 22, 2022, 5:05 PM

#

Oh wait, have you tried adjusting the fields displayed when rendering the payment element?

#

https://stripe.com/docs/js/elements_object/create_payment_element#payment_element_create-options-fields

Stripe JS Reference

split umbra Aug 22, 2022, 5:05 PM

#

no

#

please explain

white swallow Aug 22, 2022, 5:06 PM

#

Okay so you don't want the two rows?

split umbra Aug 22, 2022, 5:06 PM

#

only the two rows

#

normally look like this:

white swallow Aug 22, 2022, 5:06 PM

#

I think the create options I linked can help get rid of the last row.

split umbra Aug 22, 2022, 5:07 PM

#

will review

#

so it would bundle exp, cvc, and zip, just like card element does?

white swallow Aug 22, 2022, 5:09 PM

#

That it won't do

#

If your device is wide enough it'll display card number, expiration, and cvc on the same line but as separate fields

split umbra Aug 22, 2022, 5:09 PM

#

hmmm

#

thank you for your helop

#

help

#

last question then, for the sake of high-traffic transactions where every secondo friction counts

#

of*

#

people will be on the phone as they pay, so bounce needs to be addressed

#

is there a way to use the payment element cc fields, and display the wallets (perhaps only as images) as well as the Link option, and if either the Link or wallets was selected, then to transfer the process to a Payment Element display or page?

white swallow Aug 22, 2022, 5:13 PM

#

You mean instead of the top row of payment method options?

split umbra Aug 22, 2022, 5:16 PM

#

I mean, use images/links of the wallets on top, then the Card Element single field, and below an image/question/link for remembering for future use.

If someone selected to use a wallet, it would transfer you away from Card element and to the Payment Element page, same if someone clicked on enabling Link

open meteor Aug 22, 2022, 5:16 PM

#

👋 stepping in here as Snufkin has to step away

split umbra Aug 22, 2022, 5:17 PM

#

no problem at all

#

thanks Snufkin

open meteor Aug 22, 2022, 5:18 PM

#

So to understand... you want to handle a redirect to a page where you would render payment element based on a user action like clicking an image in your UI?

split umbra Aug 22, 2022, 5:19 PM

#

exactly

#

and those images would be mimics of the functionality that Card Element lacks

#

we have 4M phone calls per month, we're adding a new feature with self-pay. Single fields are easier to present (time, bounce, etc). But Payment Element has 4 fields vs Card Element's single

#

Just trying to find a workaround to display single field (for cc, date, cvc, and zip) while also offering local wallets, and the ability to use link

open meteor Aug 22, 2022, 5:21 PM

#

Gotcha

#

Then yes, you could do what you are talking about

split umbra Aug 22, 2022, 5:22 PM

#

I understand PE is required for wallets and link, but not sure the single field feature from CE doesn't survive

#

Thank you

#

would you mind walking us through it?

open meteor Aug 22, 2022, 5:22 PM

#

You could also disabled wallets from PaymentElement and render PaymentRequestButton alongside card element

#

Then have a button for Link at which point you redirect to a different page with Payment Element

split umbra Aug 22, 2022, 5:24 PM

#

hmmm

#

but is Payment Request button only for Apple and GPay?

open meteor Aug 22, 2022, 5:26 PM

#

Yes

#

Are you looking for other wallets?

split umbra Aug 22, 2022, 5:26 PM

#

yes

#

globally

#

so we like that Payment Element allows for a carousel of wallets

#

and if we use images, then the carousel's intelligence gets wiped out

#

I guess we could use Apple Pay, GPay, and use a link for "Other"

#

we have callers from 100+ countries

open meteor Aug 22, 2022, 5:28 PM

#

Gotcha so you want things like WeChat Pay as well

split umbra Aug 22, 2022, 5:28 PM

#

Grab Pay, Ali, Wepay, etc

#

In a perfect world, the field looks like this:

#

#

the Link option/check box below

open meteor Aug 22, 2022, 5:30 PM

#

Yeah we do want to provide further layout customization for Payment Element in the future

#

But the above isn't possible right now

split umbra Aug 22, 2022, 5:30 PM

#

that would make sense

#

gotcha

#

Is there a way to be notified?

#

would this work for now:

Use Card Element
Enable Payment request button for apple pay and Gpay
Add a link/image for "Other" wallets
Add a link/image for Stripe Link"

Option 3 and 4 would redirect to a Payment Element page (with wallets enabled, because why not).

Any comments on feasibility and if any risks?

open meteor Aug 22, 2022, 5:35 PM

#

Yep that would work totally fine.

#

You can use the same client secret so you don't need a new PaymentIntent or anything.

#

No real risks that I can think of

split umbra Aug 22, 2022, 6:11 PM

#

ok great

#JohnnyB - Link