How To Sell Things Using WordPress and Paypal And Still Look Like A Pro
E-Commerce on your own website is a pain in the ass. There. I said it.
WordPress and other CMS’s and frameworks are great tools for speeding up website development, but when it comes to integrating shops into websites, the options stink. You can go with plugins like WP-Ecommerce, but it’s such a pain in the ass there are professionals who do nothing but get that plugin running for civilians. You can pick e-commerce framework CMS thingies like OSCommerce or ZenCart, but they’re a bear to get working and a bitch to make look nice. I’m a developer, which means I’m kind of lazy and want to do things the easy way whenever I can, and make the computer or website I’m working with do as much of the work for me as possible.
Most self-hosted e-commerce solutions are overkill for most people, but the other end of the spectrum, the humble Paypal Buy It Now button, isn’t quite enough. It works, but it’s not especially professional looking. Here’s a good compromise that I love: using custom fields, you can integrate a Paypal shopping cart into your WordPress theme.
The first thing you do is go to Paypal, log in, and go to Merchant Services. There, you generate an Add To Cart button. The button type should be “shopping cart”, and then you fill out the item name, the price, shipping, and whatnot. Paypal also provides a feature for inventory tracking that I won’t go into here, but you should check out some time. Don’t worry about customizing your paypal button, because we won’t be using it.
Finish filling out your item details, and click the “generate button” button, and you should end up with something that looks like this (click images to embiggen):
THIS IS NOT THE CODE YOU’RE LOOKING FOR. See that little Email tab? Click that.
This is the code we need to use. Snag that URL and save it. This is your item code.
Next, scroll down and click Create A View Cart Button. Don’t worry about the details, just click Create Button. Just like last time, you’ll get a two-tabbed output, so select Email and save that code as well. This is your cart code.
Now we have the information we need in a format we can easily use. For the sake of this tutorial I’ll be using pages, but if you are so inclined you can use the same technique in posts as well.
Open up WordPress, and add a new Page. Give it a title and some content, then scroll down to Custom Fields. If you’ve never used Custom Fields before, they’re not as scary as you think. All Custom Fields do is provide free-form values you can use in your themes as key/value pairs.
Now, I know I said it wasn’t scary. It’s not. Honest. Here’s my review of custom fields. Go read it. I’ll wait.
Feel better? Ok, great. Now, in your new page, go down to the Custom Fields area and create a new custom field with your add-to-cart code. Lets call the new field “addtocart”. Click Enter New, and make it look like this:
Click the “Add Custom Field” button, and you get this.
You did it! Make sure you save your page.
So, now that we have the information in our page, we need to display it. Everything I know about conditional custom fields I learned from Jeff at Perishable Press, so we’re pretty much exactly using his code.
Displaying the content of a custom field is pretty simple, but I find it much more useful to display custom field information only if the custom field is filled out, so that’s what we’re gunna do. First, lets start with the code:
<?php $addtocart = get_post_meta($post->ID, 'addtocart', true); if($addtocart) : ?>
<a href="<?php echo $addtocart; ?>">Add This Item To Cart!</a>
<?php endif; ?>
Here’s what’s going on. First, where WordPress has a key called “addtocart”, PHP should make a variable called $addtocart. Then, if $addtocart has a value (meaning, if the custom field is filled out and there’s a value associated with the key), then display a hyperlink pointed to the URL in the custom field, and make the link say “Add This Item To The Cart!”. Otherwise, if $addtocart is null (there’s no custom field filled out), do nothing.
You can obviously customize this to say anything you want, or to show a little image, or do anything else you like, but that’s the whole thing. Now all you need to do is take that code and put it in the page.php file in your theme, probably right after “the_content”.
All that’s left is the View Cart button, which is as simple as putting the link that Paypal gave you in a sidebar widget.
And that’s it, folks. I’m not going to go into the details of tweaking your theme, if only because this post is already long enough. Now, when you make a page, and you fill out the custom field with a Paypal button URL, you’ll get a link to add the item to your cart.
It doesn’t get much more simple than that, does it?
Question me in the comments!
Mer made this mess on August 26th, 2010 and filed it under WordPress
I don’t get email as an option when I create an add to cart button. Only HTML.
Deb, that probably means you’ve filled out too many fields in paypal, and asked the button to do something special that kills the email option. All I can suggest is to try again, and follow the directions in the article and see if that doesn’t give you an email link option. From there, you can try customizing your paypal item further.
The only email tab I’ve seen is when using a Donate button. The button I really need is the Buy or Shopping Cart button, but when I get to the end I only see the HTML button. I even tried to find a contact number for wordpress to try to figure this out. This makes me not want to use wordpress if I cannot use a paypal account. What do I do?
Christina, like Deb, you’re probably trying to get the button to do too many things at once. Any interactive or dynamic options you select will kill the email option. I suggest giving it another try, and make sure you closely follow the instructions in the article.
Beyond that, wordpress isn’t always the right tool for everything. This is just one example of extending the functionality of one popular piece of software in a relatively simple way. There are lots of CMSs and ecommerce tools out there for you to try.