Project prerequisites for implementing Stripe checkout as a hosted payment page

Edit on GitHub

If your shop is live or @CheckoutPage/views/payment/payment.twig is overwritten on the project level, follow the steps to prepare your project to implement Stripe checkout as a hosted payment page:

  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 %}
       
  1. 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 %}
    
    
    1. Add translations to your glossary data import file:
    Stripe,Pay Online with Stripe,en_US
    
    1. Run the data import command for the glossary:
    console data:import glossary