Good morning everybody and welcome to Lesson 5 of Sell Your Digital Products with WP eStore. In today’s lesson we are going to look at customizing the appearance of your store and we’ll doing so both in Genesis and in Thesis 2.
This webinar is intended to be interactive so if you have questions please feel free to use the question box to post them and I will be happy to answer as we work our way through this.
Using Custom “Buy Now” and “Add to Cart” Buttons
The very first thing we’re going to start off with here today is probably the simplest level of customization that you can do with WP eStore and that is to use custom “Buy Now” and “Add to Cart” buttons.
Selection of Buttons
Tips and Tricks HQ has a nice page for this, go to Documentation and then Additional Resources, Cool Add to Cart and Buy Image Buttons. This page has a whole bunch of buttons on it that you can use.
There’s a selection of “Add to Cart” buttons and “Download” buttons and “Buy Now” buttons and “Subscribe” buttons that you can use and it also has a couple of other button packs. One called the “Vintage Style Buy Buttons” button pack and another that it calls “Quality Subscribe Buttons” and you can download both of these.
You can see this is the vintage buttons and we’ve got these kind of a flowery “Add to Cart”, “Buy Now” buttons in three different colors. It might be helpful to zoom in on that for you and these are the buttons in that vintage collection. Then the other buttons have these versions. There’s the “Subscribe” button collection and then it has various colors and various font styles for “Subscribe”.
If we zoom in a little closer on it, you see that they have what they call a glass which is essentially is the change in the color and then the bright spot in the middle so that’s the style of button that this is. Then their typical “Subscribe” buttons are just a single color and four different colors, four different font styles essentially all the same.
So these are buttons that you can download if you download their zip files. Now, if you’re not using the zip file the way you do this is just to pick one of these buttons that you like. I’m going to pick this “Add to Cart” button and just right click on it and hit “Save Image As”. Let’s call it add-to-cart-19.gif. I’m just going to save it right there.
Adding a Button Image to the Site
Then if we come over to the Genesis version of our eStore, you can see that red button looks like it’s going to be just fine with the style of the site. So we’ll come back over to our products. The downside of this is that you have to set this button image for each individual product.
Let’s come down to WP eStore and Manage Products and then let’s go to the First Example Thesis Plugin and click Edit and open up Additional Product Details. Here’s where you put that button image and you can use this to upload the file here.
We’ll select the file and it’s that one right there. Now that we’ve got it here, we’ll say Insert into Post. I’m just going to copy this so we can quickly add it to several different products. And we’ll save that product.
In fact, while we’re here at Manage Products, I’m just going to open up a handful of these and paste the button image URL in to each of those.
View the New Button on the Site
Now we’ll go to the site, go to our products and look at our plugins and then look at Thesis Plugins. You see the “Add to Cart” button has changed from that little original “Add to Cart” to this one. When we go over to our products, again the “Add to Cart” button looks just like that, right?
So that is probably the easiest customization that you can do with WP eStore besides simply choosing the display style that you’re interested in using. So without any code you can change the display style and you can change the “Add to Cart” button and you can come up with some relatively extensive stylistic changes.