Sep 042016
 

WordPress Simple PayPal Shopping Cart Customize Checkout Buttons post will show you how to customize the checkout and shopping cart buttons.

Last Updated: March 29, 2017

There are times when you need to make changes to your shopping cart buttons because of your theme design or because you might not like the default images added by WordPress Simple Shopping Cart plugin.

The following instructions will guide and show you how simple it is to make these changes. All you have to do is add a couple of filters to your functions.php file and also upload a couple of images to your Media library.

WordPress Simple PayPal Shopping Cart Customize Checkout Buttons Steps

Step 1 ) The following images shows you a product displayed in your post or page. The image also shows the Add to Cart button.

wordpress-shopping-cart-customize-product-add-to-cart-button

Step 2 ) The following image shows you the default buttons displayed by the shopping cart. You can see the default shopping cart icon and the default shopping cart checkout image.

wordpress-shopping-cart-customize-checkout-buttons

Step 3 ) In this example I will be adding the following two images to replace the default images added by the plugin.

Note: If you want to add a different checkout button, you can check the following URL add-to-cart-button-images-for-shopping-cart. Alternatively you can design your own buttons.

Checkout button

addtocart

Shopping Cart Icon

empty-cart-icon

Step 4 ) The plugin has two different filters that allows you to change the images mentioned above. These filters need to be added to your functions.php file in your theme.

Important: It is always best to work with a child theme if you are going to customize your theme. This will prevent you from loosing your customize files when updating your theme.

What you need to do is copy and past the PHP code from the links below to your functions.php file.

Plugin Filters Code

Step 5 ) The following image shows you how to add the filters to your function through your WordPress admin panel.

Important: Make sure you copy and past the code correctly or else you will see an error message displayed when you click on Update File button. In cases depending on the error the site can crash. 

  • First go to Appearance -> Editor.
  • Second make sure you select Theme Functions file.
  • Third copy and past the code mentioned above in the two URLs.
  • Fourth click on Update File button.

Note: The following image is based on a child theme typical set up. In your case this might be different or your theme might have an area that allows you to add customize functions.

wordpress-shopping-cart-functions-filters

Step 6 ) The following image shows you the new images added to the shopping cart.

wordpress-shopping-cart-customize-checkout-buttons-changed

As you can see it is very simple to customize the images by following the steps above. However if you are not comfortable working with PHP and prefer to use a plugin then WordPress eStore is the plugin for you. This plugin has many more options for you to customize and add more functionality to your shopping cart. create a discount code for your products. You might like to read my tutorial WordPress eStore Plugin Settings.

Click on the following link Troubleshooting .

I will be updating this post from time to time. So keep coming back for more.

Enjoy.

Go Back To Main Tutorial List:

Manuel Ballesta RuizManuel Ballesta Ruiz is a web developer, Blogger and WordPress Enthusiast.

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(required)

(required)