A user wants to modify their Shopify store’s product page to change the “Add to Cart” button appearance and display payment method icons beneath it, similar to a reference screenshot they provided.
Current Challenge:
Solution Provided:
A community member offered guidance distinguishing between two tasks:
Implementation Steps:
main-product.liquid in the Sections folderThe solution uses Liquid templating to render payment method icons directly below the Add to Cart button, making payment options more visible to customers. The helper included a reference screenshot and offered further assistance if needed.
Status: Solution provided, awaiting user confirmation of success.
Im wanting to change how my “Add to Cart” button looks and possibly have payment methods under it too. Im pretty much wanting it to look close to something like this:
This is what it currently looks like:
Is this possible to do using the Sense theme or is there an app that does this?
Thanks
Hi @CarSyncCentral ,
Changing the position of the “Add to Cart” button may require more advanced coding knowledge, but displaying the payment options under the “Add to Cart” button is simpler. Here’s how you can do it:
Go to Online Store > Themes.
Click on Actions next to your current theme and select Edit code.
In the code editor, find the main-product.liquid file, typically located under the Section folder.
Locate or search for “buy-buttons” within the main-product.liquid file.
Add the following code after the section where the buy buttons are rendered:
{%- for type in shop.enabled_payment_types -%}
- {{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
{%- endfor -%}
Refer screenshot:
This code will display the available payment options directly under the “Add to Cart” button, making it more visible and convenient for your customers.
I hope this helps! If it does, please like it and mark it as a solution!
If you need further assistance, feel free to reach out!
Regards,
Sweans
