Checkout / Paiements

[VincentM]

store url

Ma Vie Naturellement

store/product description

Titre : Checkout — Meilleure visibilité du lien “Plus de moyens de paiement” et de la carte de crédit

What feedback do you want?

Sur la page produit, le lien “Plus de moyens de paiement” est quasi invisible (petit texte gris) comparé aux boutons Shop Pay / PayPal / Google Pay.

Sur la page de paiement, la carte de crédit est reléguée en bas de page alors que les wallets express sont en haut.

Pour les marchands européens, c’est un frein réel à la conversion. Serait-il possible de permettre aux marchands de choisir l’ordre d’affichage des moyens de paiement, ou a minima de rendre la carte bancaire aussi visible que les wallets express ?

Merci.

Screenshot

[Moeed]

Salut @VincentM

Je suppose que votre problème principal est que vous souhaitez améliorer la visibilité de l’option « Autres modes de paiement » sur la page produit, c’est bien ça ?

Si oui, alors :

Suivez ces étapes :

1. Allez dans « Boutique en ligne »
2. Modifier le code
3. Recherchez le fichier theme.liquid
4. Ajoutez le code suivant en bas du fichier, au-dessus de la balise </body>

<style>
a#more-payment-options-link {
    font-size: 19px !important;
    font-weight: bold !important;
}
</style>

RÉSULTAT:

---

J’espère que cela vous aidera ! Si c’est le cas, un « J’aime » et le fait de marquer la réponse comme solution sont très appréciés et permettent à d’autres de trouver plus rapidement la solution.

Cordialement,
Moeed

[Ploqo]

You are on Horizon,

1. The “Plus de moyens de paiement” link on the product page

Horizon renders it as an 11px underlined link. Turn it into an actual button instead, styled from the theme’s own secondary-button settings

1. Online Store > Themes > Customize on your live theme, then open a product page.
2. In the left sidebar expand Product information > Details, and click Add block.

3. Search for Custom Liquid.

4. Add the Custom Liquid block.

5. Paste this into the Liquid code box and Save.

<style>
  #more-payment-options-link {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    margin-top: 8px;
    padding: var(--button-padding-block, 16px) var(--button-padding-inline, 24px);
    min-height: var(--minimum-touch-target, 44px);
    border: 1px solid var(--color-secondary-button-border, currentColor);
    border-radius: var(--style-border-radius-buttons-secondary, 8px);
    background: var(--color-secondary-button-background, transparent);
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
  }
  #more-payment-options-link:hover {
    background: var(--color-secondary-button-hover-background, transparent);
    border-color: var(--color-secondary-button-hover-border, currentColor);
  }
</style>

On your product page it goes from a 19px tall grey link to a 58px full-width button, the same width as the PayPal button above it.

Knobs: raise font-size to make it louder, or set background to a solid colour for a filled button.

Or drop the wallet buttons from the product page entirely

In the editor go to Product information > Details > Buy buttons > Accelerated checkout and click the eye icon to hide the block.

2. The order of payment methods at checkout

• The Express checkout block at the top of checkout is fixed. There is no setting on any plan that moves it below the card form. Shopify’s own guidance is that you can remove wallets from that block but you cannot reorder them.
• To remove them: Settings > Payments, click Manage on your card provider, then uncheck the wallets in the Wallets section. PayPal is switched off separately under its own provider.
• Reordering the methods inside the Payment section is a real feature, at Settings > Payments > Payment method customizations > Add a customization > Reorder.

• Shopify’s built-in one is Plus only though.

• On a non-Plus plan a payment customization app does the same job. Free options: ETP Sort & Hide Payment Methods, HidePay, Kip.

Regards,
Ploqo

[Icey.Lane]

One CRO nuance here: making the “more payment options” link easier to see is worth testing, but visibility alone does not tell us whether the card option is the blocker. I’d measure product-page payment-option interaction → checkout entry → payment method selected → purchase, split by device and market. For the live test, compare the current Horizon treatment with a clearly labeled secondary button and keep accelerated-wallet presentation as a separate variant; otherwise two changes get mixed together. At checkout, record where shoppers stop (shipping, card form, wallet redirect, validation error) rather than assuming the order of methods caused the drop. Facts from this thread: the card option appears lower and the link is visually weak. Whether that is reducing completed purchases is still a hypothesis until the funnel or checkout data confirms it.