How to add a shopping cart to WordPress
October 25, 2007
Here’s a great way to add a shopping cart to your WordPress blog so you can sell products directly from your site without the user having to go to an external site. If you offer products for sale on your blog, it’s much nicer for your customers to stay on the same site that they see the products on.
This plugin is simple and powerful, it uses AJAX for some parts of it and it seems to work just dandily on the blog I have installed it on. Here’s how you do it…
Download plugin, upload to plugins directory, activate it.
Visit the ecommerce tab and set options for country and currency, edit categories, edit checkout options, edit gateway options, add products.
[/ expert instructions]
[Hand hold instructions]
First, get yourself a copy of the WP Shopping Cart plugin and upload it to your plugins directory, go to you plugins page and activate it :
You should see a new tab at the top of the dashboard labeled ‘ecommerce’ . Click that and we can set up the options for our country and tax rate. Just select your country from the pull down box and it should set the tax rate for you.
You can also require someone to be registered before they can purchase products. This is up to you, for now, you can leave it as ‘no’. The only problem with requiring a user to register first is the non-immediate way in which WordPress allocates a password to a user by emailing it to them. Also, once someone logs in to your site, they get presented with the dashboard and not the site but there’s a great plugin to use to beat that here.
Leave the URL settins for now, they’ll work just find and dandy as they are (they may look different on your setup if you have a different permalink structure)
Choose your language and keep the theme as default:
Next, you need to choose your cart location. I use the setting as a widget because this blog is widget enabled. You can choose to add it manually yourself by inserting the code to anywhere on your sidebar if widgets aren’t your thing.
Choose which options you want and be sure to choose the correct currency setting for your country:
The next section asks you if you want to charge shipping, if you are selling physical products then you need to choose ‘yes’ and set the base shipping charges. (base charges are standard and only added once regardless of how many products are added to the cart, you can add additional delivery charges on the product settings) :
Click ‘submit’ and that’s one page done!
Now to edit category and products…Click on the ‘categories’ tab for ecommerce and then on ‘edit’ next to the example category and put in your own options and click ‘edit category’ when you are done:
Now, add your products!
Click on the ‘products’ tab and choose the category you want to add products to from the pull down box. Just add the options you want..Product Name:
Choose the categories for the product by ticking the boxes for each category:
Choose a brand if you are using one:
Enter the price of the product you are selling:
The next option is stock control, if you are selling physical products then you can tick the box for ‘limited items’ and it will give you a field for putting how many items of this you have, once you run out the software wont show this product any more until you get more stock and edit the amount here.
Variation control is a way to add options to a product, like size for a t-shirt or a colour choice which will be selectable on the product description page before a customer adds the product to the shopping cart.
Additional shipping costs can be added so that each item that is added to the cart will also add that amount to the shipping (good for heavy items)
Product images are self explanatory and always a good idea to use a decent picture for your product, the plugin does a good job of creating a thumbnail and uses AJAX to display the full size image when a customer clicks it. (choose your thumbnail size or upload a seperate thumbnail if you want)
Product download is for digital items.
Click ‘add product’ to save your product settings:
If you don’t want tax added to each item or it is already included in the price then select the option to ‘do not include tax’.
Payment options. You need some way to allow payments right? this shopping cart only gives you the option to receive money by Paypal, the customer can use their paypal balance or a credit card to purchase your products and the money will be received into your paypal account.First, go to the ‘payment gateway’ tab and select ‘paypal’ from the pull down box, you’ll presented with a screen to add your details.Enter your paypal email address:
Paypal IPN is the paypal instant payment notification, if you’re selling physical products then you probably wont need this.
Paypal accepted currency is what your paypal account is set up for.
Forms: just use the pull down boxes to select the correct fields for each title (use the top set of options on the pull down boxes):
Checkout options: This is the last screen you have to edit, the default is set to ask the customer to input their cardholder address and shipping address but I think it’s better to just use the cardholder address (for anti-fraud purposes).To remove the shipping details fields, just click the trash can icon on the side of each field to remove it, you can add other fields too like a text area for added delivery instructions etc. I make sure that the ‘mandatory’ option is selected for the postal code too.Choose the option for ‘paypal/credit card only’ if you don’t plan on letting your customers pay manually by check or other option:
That’s the settings done, now we have to add the widget and perhaps don’t display certain pages that were added by the plugin to your tabs or ‘pages’ list..You can add the shopping cart by visiting ‘presentation/widgets’ and dragging the cart button to wherever you want:
If you have noticed the extra pages being displayed on your blog and you don’t want them, simply change the template code for the page list display options. You will need to know the post id of each of these pages so click on ‘manage/pages’ to see a list and note down their respective id’s and use an ‘exclude’ option in your template wherever there is a ‘wp_list_pages’ function. eg:
That’s it! you should now have a products page showing your products and when someone clicks ‘add to cart’ , it will AJAX it over to the shopping cart ready to be checked out:
Once ‘checkout’ is pressed, the customer is presented with the screen to add their address details:
Once that is filled in, they click ‘make purchase’ and will be sent to the paypal login page where they can use their paypal account or pay by credit card if they don’t have an account already:
You will be able to see a record of what purchases have been made on the first tab of the ‘ecommerce’ section:
There you go! This is just a quick and dirty way to get a shopping cart on your blog, you can play around with lots of options to your hearts content if you have many products or want to offer digital downloads. There’s even a widget to add a donation button to your blog and have that go in the shopping cart.Personally, I like this way of selling on your blog and have used this (edited) plugin on a commissioned site using a very simple (and very edited) WordPress 2.3 theme, the customer loved it!