This is the 61st in a series of live lessons on using WordPress and Thesis as a Content Management System (CMS) for a Community Library Website. In this lesson we get the post image of the Catalog Item and display it on the Review. This way we don’t need to duplicate data by having 2 images, one for each.
So then we want to grab this image and we may as well place it in the same place as it is here, on top of the heading or the yeah, on top of the title? Where do you want it placed? Where are you placing it? I’ve forgotten.
Well, I think it looks… let me just check here. I think I have it kind of like the teasers down below the heading. Let me just quickly check one here and see. Yes, I did it the same way the teaser is done but it doesn’t really matter. Either way is fine.
Okay, it’s done here below all this stuff.
Yeah, down and to the right. I have it…
So if I turn my pen on for a second, it’s like right here?
But over to the right.
Oh, over to the right? Oh, here.
Yeah, I had that right-aligned. Yes, over there.
Right there but it’s still below this line here?
Okay so then what we’re going to do for that is this function as a title, subtitle, and author name to the review heading. This function adds the post image to the review…. Review post image and if review = get post type and then catalog item id = get post meta catalog item link id, okay. We still want to get this and then we need to grab the Thesis post image. So I’m going to look at the Thesis file just to refresh my memory about how all this stuff comes together. Well, we know this one has an image and if we scroll down to the very bottom, Thesis post image, that’s correct. Okay so we do have a Thesis post image and so post image = get post meta for that post, the Thesis post image and true… and then we are going to say echo and then this is going to be img source equals and then we’re going to stop it and put a concatenation symbol in and then we’re going to put post image. And then the concatenation symbol and then resume and then actually you know, we may as well grab that alt text while we’re at it really. Does it have any alt text? It does not have any alt text. Okay well, it doesn’t have any alt text. We’re not going to grab it.
So then post image, image src so we can just close that out and then class equals and I think it’s a line right. If I remember correctly… let’s see. Not add image to feed, not image attributes but okay, this is it. It’s a line right and so we’ve got our class and a space. We close that image out and then we can just… I think, kill this and all we’re going to do is put this image in there. And so, we have to pick the right hook for this. So first off, let’s put the right name in here. Thesis hook after headline.Sure, why not? Yeah, let’s just try it and see what it looks like.
So I just want to show you what we did here. We used the same structure that if it’s a post type review then we get the catalog item id from the review. And then the post image is going to equal to the get post meta of that catalog item id with the meta being the Thesis post image and we’re going to take it as a string. And then we’re going to take that variable and we’re going to echo an image screen or image source equals that information. And then we’re going to use this typical Thesis class name.
Okay so that’s what we’re doing. We’re uploading it. We are… error on line 211. I must have misnamed something. Error on line 211… well, sorry about that. I guess I’m going to have to work on this. What I need to do is extract the image out of the array. Well actually, no nono. I’m back, I can get this done right now.
Okay catalog post image = get post meta… that. So I’m getting my array and for the moment, what I’m going to do is print_r and then we’re going to print_r post image. We’re going to see what the result of that is and I’ll bet what I need is post image URL here. But let’s just try it and see. Save the document, upload the document. Just having a little mental problem there for a second but I bet you that array… yeah, that’s it right there. So all I really need to do is… because… right.
Okay so then what we could do here is instead of that, we would just say… I don’t know. I think actually post image 0 will do the job there because it’s a 0 element inside the array. And let’s go look at it.
There it is, it did work. Okay, perfect. So we’ll just clean that code up a bit. If you were wondering what was going on there you know, most often, post meta is in the form of a string and it’s a single element. But in this case and at this time, the Thesis post meta was an array and it was not just a string. And so, I was having problems with this because I wasn’t treating it like an array. The way we treat it like an array is by, in this case, telling it the index of the value that we want. And the index of the value we want is 0. Now, there is only one value in this array but theoretically, this array can hold a number of values like height and width and alignment and all kinds of things like that.
So what we’re doing here is we are… this is an associative array with the index value of 0 so we’re taking post image index 0 which is the URL and that’s how we got to this.
So we just save this and we refresh it and then we view it. And there we have it. We’ve got the book there and we can easily go to the full item description and go back and forth. And it’s really only a couple of minor things we have left to do and this whole thing is working.