People are currently reading this guide.
Removing the PayPal Button from Your Shopify Product Page: A Comprehensive Guide
Are you looking to streamline your Shopify product page and remove the standalone PayPal button? Perhaps you want to encourage customers to go through your standard checkout process, or maybe you have a specific payment gateway strategy in mind. Whatever your reason, this comprehensive guide will walk you through the various methods to remove the PayPal button from your Shopify product pages.
Let's start with the most common and generally recommended approach. Are you ready to dive into your Shopify theme settings?
Step 1: Exploring Theme Settings (The Recommended Method)
This is often the easiest and most straightforward way to remove the PayPal button, especially if your Shopify theme offers this functionality.
1.1 Accessing Your Shopify Theme Editor
- First, log in to your Shopify admin dashboard.
- Navigate to Online Store in the left-hand sidebar.
- Click on the "Customize" button next to your current theme. This will open the Shopify theme editor.
1.2 Navigating to Product Page Settings
- In the theme editor, look for a dropdown menu at the top center of the page. It will likely display your homepage. Click on this dropdown and select "Products" and then choose either "Default product" or a specific product template if you've created one. This will load a preview of your product page in the editor.
- Now, on the left-hand sidebar, you'll see various sections related to your product page. Look for a section named something like "Product pages", "Product details", or a similar variation. Click on this section.
1.3 Locating the PayPal Button Settings
- Within the product page settings, you'll need to carefully examine the different options available. Look for settings related to "Payment buttons", "Express checkout buttons", or specifically "PayPal button".
- The exact wording and location of this setting will vary depending on your Shopify theme. Some common places to look include:
- Under a section related to the "Buy buttons" or "Add to cart" functionality.
- As a standalone checkbox or toggle switch.
- Within a section that lists various elements displayed on the product page.
1.4 Disabling the PayPal Button
- Once you've located the relevant setting, simply uncheck the checkbox or toggle the switch off next to the PayPal button option.
- After making the change, be sure to click the "Save" button in the top right corner of the theme editor.
- Now, navigate to one of your product pages on your live store to verify that the PayPal button has been successfully removed.
Step 2: Editing Theme Code (For More Control or When Theme Settings Lack the Option)
If your theme doesn't offer a direct setting to remove the PayPal button, you'll need to delve into the theme's code. This method requires caution, as incorrect code modifications can break your website. It's highly recommended to duplicate your theme before making any code changes.
2.1 Duplicating Your Theme (Crucial Step!)
- From your Shopify admin dashboard, go to Online Store > Themes.
- Find your current live theme.
- Click on the "..." (three dots) button next to the "Customize" button.
- Select "Duplicate" from the dropdown menu. Shopify will create a backup copy of your theme.
2.2 Accessing the Theme Code Editor
- Once the duplicate theme is created, click on the "..." button next to the duplicated theme.
- Select "Edit code". This will open the theme code editor.
2.3 Identifying Relevant Code Snippets
- This is the most challenging part, as the exact code responsible for rendering the PayPal button can vary significantly between themes. You'll likely need to search for keywords related to PayPal or express checkout.
- Use the search bar within the code editor (usually Ctrl+F or Cmd+F) and try searching for terms like:
paypalexpress_checkoutshopify.payment_buttonadditional_buttons
- Look for files within the "Sections" or "Snippets" folders that seem related to product pages or buy buttons. Common filenames might include
product-template.liquid,product-form.liquid,buy-buttons.liquid, or similar.
2.4 Removing or Commenting Out the Code
-
Once you've identified the code snippet responsible for displaying the PayPal button, you have two main options:
- Remove the code entirely: Carefully select the lines of code that generate the PayPal button and delete them. Be extremely cautious not to delete any surrounding code that might be necessary for other functionalities.
- Comment out the code: This is generally a safer approach. To comment out code in Liquid (Shopify's templating language), you can wrap the code within
{% comment %}and{% endcomment %}tags. For example:
Code snippet{% comment %} <div class="shopify-payment-button" data-shopify="payment_button"> {{ product | payment_button }} </div> {% endcomment %} -
After making your changes, click the "Save" button in the top right corner.
2.5 Testing Your Changes
- Go to your live store (using the duplicated theme if you haven't published it yet) and check your product pages to ensure the PayPal button has been removed and that no other elements are broken.
- If you encounter any issues, you can revert back to your original theme or carefully review the code you modified.
2.6 Publishing Your Modified Theme (If Working on a Duplicate)
- If you made changes to a duplicated theme and are satisfied with the results, go back to Online Store > Themes.
- Find your duplicated theme and click on the "..." button.
- Select "Publish" to make this theme your live store theme.
Step 3: Utilizing Shopify Apps (An Alternative Approach)
While less common for this specific task, some Shopify apps that manage product page elements or offer advanced customization options might provide a way to hide or remove the PayPal button.
3.1 Exploring the Shopify App Store
- Navigate to the Apps section in your Shopify admin dashboard.
- Click on "Visit the Shopify App Store".
- Use keywords like "product page customizer", "hide elements", or "advanced product options" to search for relevant apps.
3.2 Reviewing App Features and Documentation
- Carefully examine the features and descriptions of any apps that appear relevant. Look for mentions of the ability to customize product page elements, including payment buttons.
- Check the app's documentation or support resources to see if they provide specific instructions on how to remove the PayPal button using their app.
3.3 Installing and Configuring the App
- If you find an app that seems suitable, install it by clicking the "Add app" button.
- Follow the app's setup instructions and navigate to its settings related to product page customization.
- Look for options to hide or disable the PayPal button.
3.4 Testing the Results
- Once you've configured the app, check your product pages on your live store to confirm that the PayPal button has been removed.
Important Considerations:
- Theme Updates: If you've edited your theme code directly, be aware that future theme updates might overwrite your changes. You might need to re-apply your code modifications after an update. Using a child theme (if your theme supports it) can help mitigate this.
- Payment Gateway Settings: Ensure that removing the standalone PayPal button doesn't unintentionally disable PayPal as a payment option during your regular checkout process. These are usually separate settings within your Shopify payment gateway configuration (Settings > Payments).
- User Experience: Consider the impact of removing the PayPal button on your customers' shopping experience. Some customers prefer the convenience of express checkout options like PayPal. Ensure your standard checkout process is smooth and user-friendly.
Frequently Asked Questions (How to...)
How to know if my theme has a built-in option to remove the PayPal button?
- Quick Answer: Go to Online Store > Customize > Products > Product pages (or similar) in your Shopify theme editor and look for settings related to "Payment buttons" or "Express checkout buttons."
How to duplicate my Shopify theme before editing code?
- Quick Answer: Go to Online Store > Themes, click the "..." button next to your current theme, and select "Duplicate".
How to access the theme code editor in Shopify?
- Quick Answer: Go to Online Store > Themes, click the "..." button next to the theme you want to edit (preferably a duplicate), and select "Edit code".
How to search for specific code in the Shopify theme editor?
- Quick Answer: Open the code editor and use the keyboard shortcut Ctrl+F (Windows) or Cmd+F (Mac) to open the search bar. Type keywords like "paypal" or "express_checkout."
How to comment out code in Shopify's Liquid language?
- Quick Answer: Enclose the code you want to disable within
{% comment %}and{% endcomment %}tags.
How to revert back to the original theme if I make a mistake in the code?
- Quick Answer: If you duplicated your theme, simply publish the original, unedited theme. If you didn't, you might need to restore a previous version of your theme if available (Shopify sometimes saves previous versions).
How to find Shopify apps that can customize product pages?
- Quick Answer: Go to the Shopify App Store and search for terms like "product page customizer," "hide elements," or "advanced product options."
How to check if PayPal is still enabled as a payment option at checkout after removing the button?
- Quick Answer: Go to Settings > Payments in your Shopify admin and ensure that PayPal is listed under your accepted payment methods.
How to ensure my checkout process is user-friendly if I remove the express PayPal button?
- Quick Answer: Streamline your checkout form, offer clear instructions, provide multiple payment options, and ensure fast loading times. Consider user testing to identify any pain points.
How to re-enable the PayPal button on my product page if I change my mind?
- Quick Answer: If you used theme settings, simply go back to the same settings and re-enable the PayPal button option. If you edited code, you'll need to either uncomment the code you previously commented out or re-add the code you deleted.
