Skip to main content

How do I Hide Additional Payment Buttons like PayPal on the First Checkout Page?

  • Updated

How to find these settings...

  1. Online Store
  2. Click ••• (Theme Customizer)
  3. Edit code

Caution: This is an advanced tutorial and is not supported by Shopify. Knowledge of web design languages such as HTML, CSS, Javascript and Liquid is required. We suggest hiring a Shopify Expert if you are not comfortable proceeding with the following tutorial. If you do proceed, we strongly recommend making a copy of the theme before editing.

 

ATTENTION: The following is based on a Shopify support document. This method is not 100% reliable, and Shopify Support has provided the following:

  • "This procedure is not 100% guaranteed to work all of the time. In addition, this method can be tested, but may not be successful for a variety of reasons.”
  • "This solution doesn’t work when customer accounts are required. (regardless of whether you are logged in before or after proceeding to checkout.)"
  • From the doc: "This method will only work if customers are checking out from the cart page directly (having the cart drawer or cart modal enabled, or checking out via external links will not guarantee this method to work)."

 

Merchants with a Plus account can access Checkout files, but edits are limited without the enterprise level account.

By default, if you have added accelerated payment options, such as Apple Pay or Google Pay, they will automatically display in the Avenue Cart page. If the code for these buttons is removed, the buttons will now display on the first page of Checkout. The steps below detail options on how to display the buttons.

 

Recommended reading

In this section...

 

Remove Additional Cart Buttons & Display Them in Checkout

  • From your Shopify admin, go to Online Store > Themes
  • Click Actions > Edit code next to the name of the version of Avenue you want to edit
  • Open Sections > main-cart.liquid and delete the following code: 
    {% if additional_checkout_buttons %}
    <div class="additional-checkout-buttons clearfix bottompad-quarter">
    {{ content_for_additional_checkout_buttons }}
    </div>
    {% endif %}
  • Click Save
  • Now the buttons will appear on the first page of Checkout

 

Hide Additional Buttons in the Cart and Remove from Checkout

  • From your Shopify admin, go to Online Store > Themes
  • Click Actions > Edit code next to the name of the version of Avenue you want to edit
  • Open Sections > main-cart.liquid and find: 
    {% if additional_checkout_buttons %}
    <div class="additional-checkout-buttons clearfix bottompad-quarter">
    {{ content_for_additional_checkout_buttons }}
    </div>
    {% endif %}
  • Add 'hidden' to the list of classes, so the new code looks like: 
    {% if additional_checkout_buttons %}
    <div class="additional-checkout-buttons clearfix bottompad-quarter hidden">
    {{ content_for_additional_checkout_buttons }}
    </div>
    {% endif %}
  • Click Save
  • Now the buttons will not appear in the Cart or on the first page of Checkout