Implement Stripe checkout as a hosted payment page

Implementing Stripe checkout as a hosted payment page is usually needed if @CheckoutPage/views/payment/payment.twig is overwritten on the project level. To implement Stripe checkout as a hosted payment page, follow the steps:

1. Make sure that a form molecule uses the following code for the payment selection choices:

{% for name, choices in data.form.paymentSelection.vars.choices %}
    ...
    {% embed molecule('form') with {
        data: {
            form: data.form[data.form.paymentSelection[key].vars.name],
            ...
        }
    {% embed molecule('form') with {
        data: {
            form: data.form[data.form.paymentSelection[key].vars.name],
            ...
        }
    {% endembed %}
{% endfor %}
       

2. If you want to change the default payment provider or method names, do the following:

   1. Make sure the names are translated in your payment step template:

   
   {% for name, choices in data.form.paymentSelection.vars.choices %}
       ...
       <h5>{{ name | trans }}</h5>
   {% endfor %}
   
   

   2. Add translations to your glossary data import file:

   Stripe,Pay Online with Stripe,en_US
   

   3. Run the data import command for the glossary:

   console data:import glossary