This is part 6 in our case study demonstrating the use of Thesis as a CMS with a Community News Site. We are using custom post types for each community and now are creating a community “posts” page where those custom post types will be displayed. We demonstrate in this video:
- Creating the pages that will serve as the community “posts” pages
- Creating the functions that will add the custom loops to our pages
- Creating the custom loops that display the custom post types for each community
- Adding the custom loops to the appropriate hook
If we refresh that, I think it’s… yeah, okay. The little warning has gone away, we’re ready to customize. And so what we want to do is we want to open up that custom php file… custom functions php and that’s going to be under websites, byobwebsite, tutorial sites, community, content, themes, thesis_18, custom, and custom functions php. Okay, so now what we’re going to do is we are going to, let’s see… I think what I’m going to do is on the site here, if we go to Demo 1, I think I’m going to rename this to Seattle. And what I want is a little bit of introductory content about Seattle and then after that introductory content, I want a list of the posts.
And so in order to do that, what I’m going to… is to go to pages and Demo 1, we’re going to edit. We’re going to call it Seattle and we’re going to change that to Seattle. And actually, we’re going to call it Seattle News. And we’ll… some introductory text, we’ll update that and then we’ll do the same thing with Demo 2, that’s going to be called Edmonds News and we’ll call that…okay and that… some introductory text, update that.
So now if we come over here, let’s just go home for second. So now Demo 1 takes us to Seattle News, Demo 2 takes us to Edmonds News. Okay and so now below this introductory content, we want to list the post that should show up here and in the time that we have remaining, what I’m going to do is the simplest way of listing the Edmonds only post here. You know, I think maybe in continuing sessions, what I’d like you to do is tell me you know, what else or how else you want to display that. And what we’ll do is we’ll continue on the case study with the code for doing that specific thing you want to accomplish, if that works for you rather than me making it up.
And so what we’ll do here now is… this is… the Edmonds News is post id 68 and actually you can see this better just under pages. If we hover over Seattle News, you can see that it was post 65 down here and if we hover over Edmonds News, wherever that went, you can see down at the bottom down in this area here it’s 68. So those are 2 post id numbers, 65 and 68. And so what we’re going to do is create a function and we’re going to attach it to that page.
And so function display Seattle post and opening and closing brackets… and what we’re going to do is, we’re going to do an add action and add action and it’s going to be a Thesis hook after content and then Thesis… no, no, not Thesis. I’m sorry. It’s going to be the name of this function display Seattle post and then what we’re going to do here is our first line of this is going to be if is_page and this is a question I was just answering earlier. So we put our single quotation marks in here and Seattle was 65. If this is page 65, then we are going to display these posts.
And so now what we have to do is create a query and I’m just going to steal some code from my site and… it’s not going to be that code though. Okay, it’s going this right here. So this is our new custom functions so first, we’re going to create an array of our arguments and that array is going to have… we’re going to do posts per page. We’ll show, at most, 50 posts. This is adjustable, obviously. Let’s just make it 10. And then post type is not going to be answers but it’s going to be Seattle. Okay and then… so that’s our array. And then my query = new wp query args which is this argument here, that variable with this data in it. And then while my query have posts, my query got posts, do not duplicate and then we need an end while. Alright and so I we go back here and steal… actually, I think what I’m going to do at the easiest level is going to be this code right here – Thesis Teaser. Yeah, okay. So what’s going to happen here is this is going to display a teaser or it’ll display up to 10 teasers of the post type Seattle. So if we have… oh, yeah. So it’s going to display all of those and that should work just as it is right there. So we have created this little loop that will add a list of teasers to below the content and we’ve added that to the page. So let’s just save it and upload it and see what happens.
And so custom functions php, upload… it’s always overwrite that and then we’ll come back to our page and let’s go to Demo 1 Seattle News and it’s added these 2 little… both of our posts that we’ve created that were Seattle posts. It has added them to this. If we go to Demo 2 Edmonds, nothing happens yet because we don’t have… because we haven’t written the same code for the Seattle. Now in fact, what we ought to do here real quickly is just dump that comment stuff. So we go to Thesis… I think it’s Site Options, maybe Design Options. Yeah, it is Design Options. And comments, disable comments on all pages and if comments are closed, we’ll remove that. Save that, refresh this. So now you have your introductory text and then you have your… you have a couple of teasers.
Now obviously, there’s some CSS work that has to be done in order to make this look the way you want it to look but nevertheless, it’s displaying that.
So then let’s just do the same thing for Edmonds and what we’ll do is just copy this whole thing. Copy it, paste it and now it’s display Edmonds post and that was 68 instead of 65. The post type is going to be Edmonds and then it’s display Edmonds post. If we save that and we upload it and then we come back over to Demo 2. And now you can see it’s displaying 3 of them, right? It’s got the weekend event, it’s got the Rainier Sweet Cherry 2 and the Van Black Cherries too. And so these are the 3 posts that we have indicated that are Edmonds post type.