This is the second in a short series on looking at the new features in WP eStore 5.3. WP eStore has added quite a bit new functionality in the last year. In this lesson we’ll look at some of the new ways of displaying product categories in a catalog and displaying individual products.
Take that and come over to my site. And I’m going to create a new page actually. Add new and we’re just going to show, let’s see, sample codes. And I’m going to make it a parent of our products, give it a display order of 3 so that’s at the bottom. Now, first off something that is new here is this little button for WP eStore short codes. So you could click on that and it will give you an opportunity to put you know, some of the codes but not all of the codes in here.
And so, for example, we’re just going to use this to mark it up but you could say Insert and then let’s say we want to look at category 1. So here is sort of the traditional, the default code system. It’ll only show you all of them in the fancy 1 style in category 1. So if we view the page…oh no, that only shows… I’m sorry, my mistake. That’s showing the category. That is not showing the products. Let’s see, okay this is an example, insert and category 1. So here’s… it’s going to show all the products in category 1. If we hit update and we refresh it, they’re all in the category 1 style and it’s all those products in that category.
However, we can do the same thing with that code from the WP eStore category and we can choose category 1 but now we can choose style 3. This would only give us style 1, this will give us style 3. If we update it again and we refresh it and there’s our style 1 as an example. We’ve forgotten that I’d added styling to style 1. Actually, I think I need to maybe add a… I think I need to add a body class to this. Did I just go right past it? Yeah, simple product display. That’s what I needed to add to that.
Okay let’s see, simple product display and with that in there. Oh, isn’t that interesting. I haven’t added this page to the menu. So that’s why we can’t see it. But if I put that on there, I think I’m going to get a better picture. There we go, now the picture’s going to work right. Oh it didn’t work there.
Anyway so… but you can see what happens here. We have a choice of you know, changing the category display. And then we also added an option where we can sort the products within a category so that is this next one down here, WP eStore category products. So you can set the category, you can set the style and you can set the order. And the order number 1 is store or sort by product id ascending or product id descending or product name ascending or product name descending. So it’s still not perfect, right? What you’d really like to do is to be able to say, to give it its own sort order but if either of these 4 are okay with you then you can sort now. The default is at its sorts by descending order. Maybe at some point, they’ll have a place where you can add a sort priority so we can sort by your own custom order.
And then it added those fancy options which I showed you, 6, 7, and 8. And it also added an option to hide the price. And so if we come down here and look at… let’s see, show price okay so you have this choice of you know, displaying an individual product without displaying its price. So we’re just going to go ahead and grab this one for a second, come back over to here, edit the page, we’ll paste this in, fancy display id so the… actually, I missed that. The other thing it does is it gives you a chance to choose which button to use and something that eStore has done recently is sort of consolidated around this…instead of types of button transactions, style 1 or type 1 is add to cart, type 2 is buy now, type 3 is…oh my gosh, what was type 3? Shoot. I’ve now forgotten and then type 4 is download. Let’s see, subscription. That’s right. Type 3 is use subscription and then type 4 is download now.
And so what we have here is fancy display id equals that this is the product id, type equals what kind of button we want to use, style is what kind of fancy style to display and show price equals whether or not we want to show the price. So if we come here and go to that page and we’re going to say we’re going to keep style 1 as our style, type 1 is on display, product 1 is our id. Let’s just update that and see what it looks like. So this is sort of the default view. Oh product id and a short code that doesn’t exist. Okay there you go, let’s look at our products for a second. Manage products, open link in a new tab, okay I see. I don’t have product 1. I have a product 2 so then that is id equals 2. Hit update, refresh. Okay so this is the plain old ordinary example, right? Style 1 with the price, with the Add to Cart style button and then let’s say that we… if we want to change the type so give it a type 2 and select update. Now this is just going to be an Add to Cart button… I mean, a Buy Now button. Actually what we should do, I’m sorry… let’s just show all 4 different examples.
So let’s do it like that and we’ll do it like this with a type 2 and then copy and we’ll do it like this with the type 1 and a type 3. And then we’ll do one like that and the price equals 0, update. Okay, refresh it.
So there’s our standard as we’re familiar with it. Here’s one with the Buy Now button, here’s the standard and here’s one without the price. You know what? It almost seems like if it’s not going to show the price, it ought to show the…it also shouldn’t show Add to Cart. What happens if we do 0 here? Type 0. Well, that was an O isn’t it? Zero, update… I don’t think that’s going to do the job but I was thinking this was brilliant because we could hide the price as I have somebody who wants to hide the price. Oh perfect, actually that did work. If I put… if you put the button type 0 and you hide the price then all you get is this thing that links off to its page which was exactly what somebody was asking for a couple of weeks ago and we did this using CSS by actually hiding it. But now, we don’t have to do it that way. We can just use this system.