Remove More Payment Options Link

[SibCo]

Hi there,

I’m trying to remove the “More Payment Options” link which appears below the ATC and Accelerated Checkout buttons.

From what I can tell, this button simply takes customers straight to checkout, where they can see our payment options. This disrupts the customers buying intention flow, and means they have to return to the product page to continue reading. Am I mistaken in thinking there’s literally no purpose/point to this button?

Any help would be appreciated. I have tried the following (added to base.css):

#more-payment-options-link {
display: none !important;
}

Store: ForeverFrame™ Art Gallery

[solverStaff]

Hey @SibCo

Please add this css in base.css

#more-payment-options-link {
display: none !important;
}

Regards

Titu

[SibCo]

Already tried. Did not work.

[solverStaff]

Go to theme.liquid

• Shopify Admin → Online Store → Themes

• Click … → Edit code

• Open Layout → theme.liquid

• Add <style> BEFORE </body>

<style>
.shop-product-info a.shopify-payment-button__more-options {
  display: none !important;
}
</style>

[solverStaff]

let me know if it works

[SibCo]

Here?

[solverStaff]

If you’re still stuck after trying the steps above, you may need to have someone review the theme files directly using collaborator access.

[suyash1]

@SibCo please add this css to the very end of your base.css file and check

shopify admin->online store->themes->edit theme code->assets->base.css

a#more-payment-options-link {display: none !important;}

[ecom-experts]

Hey,

Usually the Payment options data comes dynamically. Means it doesn’t belong to the theme code. Or we cannot style it with the code that we will paste into the theme file.

So, the better solution is that you’ve to paste the code provided by @solverStaff into the custom Css in the Theme Editor.

Here below I show you visually on how to find the custom CSS option.
Go to Shopify Admin >> Online Store >> Edit theme >> Settings >> Custom Code >> Paste your CSS there.

See ScreenShots below for more reference.

Screenshot

Screenshot

[devcoders]

Hi @SibCo

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the TOP of the file:

#more-payment-options-link {
display: none !important;
}

[tim_tairli]

The codes suggested above should work.

It may be that you’re placing the code in the wrong place.

Have you tried to use “Theme settings”(cog icon)-> “Custom CSS” for this?

The screenshot you’ve shared suggests that you’re placing the code inside
{% if settings... %} conditional so it may not be rendered at all if condition is not met.

Your base.css reports a bunch of warnings, so pasting at the bottom of base.css may not work either because of some nesting issues for example:

[devcoders]

Hi @SibCo

Thank you for your response. It’s good to know that it’s worked for you. Kindly feel free to get back to me if you need any further assistance. If helpful, please like all posts.

Best regards,
Devcoder