0:00:00
So today I’m going to walk you through one of the most important elements inside of oxygen and that is the repeater. This is something that I use on pretty much every single website that I build. If you can understand and start to use the repeater, it’ll really take your websites to the next level. But I do want to say if you are completely confused by the repeater, you don’t know where to start. You just can’t wrap your brain around it. I totally understand. And this is the tutorial for you. I’m going to keep this super simple, very straightforward. And I’m actually basing this tutorial off of a real world use case. So we’re not just going to play around with a repeater in this tutorial. I’m going to walk you start to finish. We’re going to take a custom post type. We’re going to create that. We’re going to put some data in the custom post type. And then we’re going to query that data using a repeater just like you would do for a real client website. We’re even going to start with the site map I have from a real client. So this is super practical. And like I said, very dumb down, very straightforward. You’re going to learn a lot of many lessons inside of it. I try as much as possible to embed as many little lessons and little tips and tricks as I can throughout these tutorials.
0:01:12
But I just think you’re going to find this super helpful and very valuable. Make sure you hit like, make sure you hit subscribe, drop a comment. I love the participation. I respond to every single comment that is left on the channel. And that’s that. Let’s go ahead and dive into the tutorial. Alright guys, let’s go ahead and dive right in. I’m going to show you how to build repeaters and oxygen. I’m going to keep things super basic, super simple. We’re not going to dive deep. But you will have a grasp of what repeaters are, why you would use them and how to create them by the end of this video. Now, as far as the why you would use repeaters, I published a video, my last video on the top 10 use cases for custom post types. And if you’re going to be using custom post types, then you should be using repeaters as well. Basically what a repeater is is it allows you to query something like a post or a custom post type. So whatever’s inside of that custom post type onto a page. And then you can do a bunch of cool stuff. You can do filtering and sorting. You can query children. You can do. I’m not going to again, I’m not going to get too deep into it. But I want to center this tutorial around something that’s very practical. So what you’re seeing on your screen right now is a site map and SEO site map that I created for a client.
0:02:35
I create these for pretty much every single client. This site map is actually a relatively small site map. But we’ll go ahead and talk about this. So this is a site map for a luxury performance auto shop. They only work on European vehicles, higher end, luxury performance type vehicles, BMW, Mercedes, Audi, Porsche, etc. And this is the site map that we built for them. So they had two locations. I’ve removed all the actual client data. They had two locations. And so when you see something like this, we’re talking about the planning phase of a website. You should automatically in your mind think, all right, locations, that’s going to be a custom post type. Then we have this one called repair, which is actually all of the makes that they work on. Now the reason it says repair is because that’s what the slug needs to be for SEO. Because when people are searching online for this, they’re actually searching repair by the make of their car. So they’re saying, I want to be a MW repair shop or I want to Mercedes repair shop or I’m looking for BMW repair near me, right? Very, very common. So this is going to be a custom post type. And this is actually the one that we’re going to create for this tutorial. Then they had services, which would be another custom post type and service areas, which would be another custom post type. But let’s go ahead and hone in on repair.
0:03:53
Because what I’m going to do is I’m going to show you how we would create the repair custom post type. That only takes a few seconds. And then we’re going to pop some of these into it. And then we’re going to query them inside of a repeater. So this is a real world tutorial, something that you would do for a client and something you would do over and over and over again. So let’s go ahead and hop into WordPress here. I’ve got a clean install. I’m going to throw myself in the corner for a second. And I’m going to go to plugins just to show you. If you want to create custom post types, I know I covered this in the last video. You’re going to need the plugin custom post type UI. So if you don’t have that, go download it and install it. You’ll be able to follow along with this tutorial. It’s completely free. When you install that plugin, you’re going to get this little CPT UI area over here. And we’re going to go ahead and add edit post types. And we’re going to call this makes, and it’s asking for the plural label. So makes, and then the singular label is make.
0:04:51
And then I’m going to populate additional labels based on chosen labels. You’re going to see that when I click that button, it’s actually not working. It normally works. It probably is not working because I didn’t put the slug in. So let’s talk about the slug. Remember, I wanted the slug to be repair. All right, so I’m going to make this repair. Let’s see if it’ll populate. Now it populates. Okay, I’m going to take the word my out of here. Everything else is fine. So it populated all of these fields for me. And then I’m going to come down here and I just want to make sure that hierarchical is set. To true, we don’t actually need any hierarchy. We’re not nesting any of these under other ones. But in the future, I always, almost always just put that on by default.
0:05:30
Because in the future, if we come back and want to do hierarchical stuff, we don’t have to come back and reset the settings. All right, so before I hit save on this, let’s go back to the top and talk about this. So if I made all of this repair, it would just put a repair section. Let me, let me hit add and show you. So it puts makes right there. If that actually said repair like it does here, it wouldn’t really make sense. So if somebody came in to add a new make to the website, they wouldn’t know that it’s under repair, right? So the slug, it can be different from the actual name of the custom post type. People know what a make is if they’re working in a shop, right? So we’re going to go ahead and hit all makes. And what you’re going to see is that that custom post type is empty. We haven’t put anything into it yet. Now I’m going to show you one way to do it.
0:06:12
And then I’m going to show you the really fast way to do it. So the, the, the manual way is to click add new. And then you can see what we’re going to want to do here is we’re going to want to load in BMW and Mercedes. I’m just going to do six of these. All right. So let’s you BMW. If I can type. And then I’m just going to hit publish. That’s all I’m going to do for now. And then I’m going to go back. And you’re going to see that BMW is in there. So a lot of people would make the mistake maybe of creating all of these things as pages. And then what’s going to happen is that you’re going to have a lot of people making the mistake. And then what’s going to happen is your page is going to be all cluttered up.
0:06:46
It’s going to have service areas in there. It’s going to have makes in there. It’s going to have services in there. It’s going to have locations in there. It’s going to be an absolute disaster. And then you’re not going to be able to query them well. It’s going to be difficult if you wanted to template this stuff to create templates. Again, I covered all this in my custom post types video. But you can see now that in seconds we’ve created a custom post type called makes. We’ve created a BMW make inside of that a page for BMW is effectively what we’ve created. And if I hit view, if we go to the front end, you’re going to see that it’s nested under the slug repair. So I have the shop slash repair slash BMW. That’s exactly what we wanted, exactly what we were going for. Now notice I’m on the front end. This is where we go to do the shortcut.
0:07:31
You click customize. Because if I do this back here, I’m going to have to add new go back. Add new go back. Add new go back. And it’s just a lot of loading, refreshing and all of that. So once you click customize on the front end, just go to menus. Create a new menu if you don’t already have one. And then start to hit add items. And then you’re going to go to makes. There’s your custom post type right there. And then you’re going to add them here. And this is going to add them on the back end. It’s not just adding them to a menu. It’s actually creating the pages for you inside of that custom post type on the back end. So again, if we look at what we’re doing here, I would normally like pull this up on my screen.
0:08:11
So this is our game plan for the client effectively. So I’m not going to do all, oh wow, it’s not going to keep it in front. Okay, maybe we wouldn’t do that normally. All right, Porsche. I think I can just get them off top of my head. Audi. We need Volkswagen. We need Mercedes. We’re just going to do six of these. One, two, three, four, five. What did we leave out? We got Porsche Mercedes Audi BMW. Let’s just take a quick look at it. Jaguar. Let’s do Jaguar.
0:08:44
Okay, so there they are. Now, if you don’t want to actually add into a menu, you just remove them, hit publish. And then look, we’re going to go refresh our custom post type. And there we are. Let me close all this stuff. Okay, so I now have created a custom post type. It’s got a custom URL. And I have six items inside of the custom post type. That’s it. Guess what friends? We are ready. Well, we’re almost ready to do repeaters. Now, think about this for a second. If we’re going to query these posts onto a page, and we’re going to create a, let’s just do that now.
0:09:21
Then I’ll come back because we can kind of explain this as we go. I think that’ll be helpful. So let’s create a page called makes. And that’s what we want to have our repeater on. So it shows all those makes that we just added. That makes sense, right? So I’m going to hit edit with oxygen. Sorry, my nose itches. And while that’s loading, let me explain this. If you’re using oxygen 3.7 or below, you’re going to have to use the old way of building repeaters. If you have oxygen 3.8 or newer, you’re going to be able to use the new way of building repeaters with the advanced query builder. Again, I’m not diving deep, but I am going to show you both methods. And we’re just going to stick to the basics. So I don’t want to confuse you.
0:10:05
I don’t want to throw too much information at you. So the first thing I’m going to do is hit add. And we’re going to add a section. I’m going to add a heading. And this is going to say, choose your vehicle. Right? And then I’m going to put owl spacing inside of this. Well, before I do that, just so you understand what owl spacing is doing. Let me add my repeater. I’m not going to add a class. I’m going to actually add a repeater. Okay. And that’s going to build basically a blank box. And this is where a lot of people get confused. They’re like, oh, I added a repeater.
0:10:40
Like, how do I use this thing? I don’t understand it. So now I’m going to click on the parent section. I’m going to add owl spacing to this. If you see my other tutorials on why I’m doing this, it evenly spaces everything inside of your section. Go watch that tutorial if you haven’t already. So now I have space between my heading and my repeater. So the repeater is going to, it’s like the first question you want to ask yourself is, what do I want to show inside of my repeater? Well, I want to show all the vehicle mix inside of this repeater. But I want to show them in a visual format, which means I probably want them to have an image. I probably want them to have a name.
0:11:16
Right? I wanted to look good. And so a classic thing that we use for this in web design is called cards. And I’ve created a video called how to create cards in oxygen properly. You may not know them as cards. You’ve probably built them before and just not called them cards. But I like to call them cards. It’s kind of a standard naming convention. So we build a card for every single making model. If we want to do it manually. But if we want to do it dynamically with a repeater, which is far better, which we’ll get into the benefits as we go, I create one card. I just kind of, here’s how I want my card to look. And then I inject the information into the card using the repeater.
0:11:58
And the repeater will query all instances of, so if I go to the back end here, how many makes did we put in? Six of them. So it will show all six makes. So here’s my custom post site makes. There’s all six of my items. That’s what I want to query into this repeater. So let’s just go ahead and kind of get the repeater set up here. And then I’m going to show you how to actually use it. And we’re going to do a little bit of a roundabout way because I think for teaching purposes, that’s going to be better. All right. So the repeater, when you add it, you’re going to click it. And let me see, structure. Oh, I’m actually selecting the div.
0:12:37
So when you add a repeater, it’s going to add a div inside the repeater by default. And that’s what you’re seeing here is one giant div. It’s not going to do anything until you tell it what to query. So you see this query box right here. So I’m going to click on it. And I’m going to first start out. Here’s the advanced one for 3.8 and up. 3.7 and below. You’re going to click on custom. And now we’re not going to get into how to do this on archive templates and all of that. Again, this is a really deep topic. I’m keeping it as simple as possible. We are on a single page. I just want to query my makes onto this page. So I’m going to choose custom post type.
0:13:15
And I’m going to choose the makes, custom post type. But what you’re going to notice is it doesn’t say makes anywhere in here. It’s going to have whatever you call the slug, the URL, which was repair. So I’m going to choose repair. And I’m going to hit apply. And what you’re going to see is that the one div here actually kind of turns into six empty divs. Because the repeater is getting ready to show all that information that was in the makes custom post type. Remember, we had six items. That’s why we have six empty divs. I can only edit one div, which is the parent div. And whatever I put in this parent div is going to get repeated six times. And this is where people get confused because they’re like, well, if I build a card with a Porsche image and a Porsche title, it’s just going to say Porsche six times. It’s going to repeat that. That’s what a repeater does. So I don’t understand.
0:14:08
So that’s where we get into injecting the dynamic content into the card. So normally what I would do, let’s talk about regular workflow. I would build the card right here inside the repeater. And then life would be good. But I don’t think for teaching purposes that that’s going to be the best way to show you. So I’m going to do a little bit of a scenic route here. But it’s going to help you understand the concepts a lot better. Now the first thing I’m going to do, we wouldn’t have cards typically that stretch all the way across the screen, right? So we want to show these six items in a grid. So I’m going to choose the entire repeater. And because I always advocate for things that save tremendous amounts of time, even if they’re premium tools and you have to pay for them, freaking pay for them. Like they are worth their weight and gold in the time you will save. I’m going to use Oxygeninja Utility classes. I’m going to put a columns three class on this repeater.
0:15:07
And you’re going to see instantly I have a grid of three items. I’m going to put a gap of medium. And you’re going to see I have a gap between all of my grid items. I’m going to put an L2 class on here because on the large device size, I want two columns instead of three. And then on medium device sizes, I want one column instead of two or three. So now you’ll see as I roll through this, I have a perfectly responsive grid that is just sitting there waiting for content. You see how fast I did that, okay? Always works perfect every single time. I’m going to go ahead and hit save. Now I’m going to build a card for our mix outside of the repeater. I’m not putting this in the repeater because, again, I think you’re going to learn better this way. So I’m going to create between these two things, between the heading and the repeater, I’m going to create a div.
0:16:01
This is going to be our card. I’m going to call it make-card. Oh, sorry, something just fell on my desk. Okay. I’m temporarily just so I can see what a card might look like. I’m temporarily going to put a width on this. All right, but I’m going to remove this in a little bit. And you can see I guessed properly, it’s about the width of one card. I’m going to put an item in here called an image. Okay. And we’re going to call this make-card image. And then I’m going to also add a heading. And I’m going to be jumping around a little bit here because we’re going to have to do a little bit of this as we go. Let’s do an h4 for this. Okay.
0:16:43
And I’m going to call this make-card heading. Perfect. And I’m going to actually edit this. And we’re going to say Porsche Repair. And don’t worry, like the reason I, because we want to see what our end result is going to be. And then I’m going to show you how to adapt it to use it inside a repeater. Again, I would normally build this in the repeater. But that’s like almost skipping a step. And it’s harder for you to follow along with. Like right now you see I’m just building what a card is supposed to look like. Because that makes sense. All right. For the make-card image, we actually don’t have any images attached to the post-times yet. We’re going to take care of that in a second. So I’m just going to manually choose.
0:17:22
Oh, let’s go ahead and I haven’t even uploaded them yet. So here’s our cars right here. I’m just going to select them all and upload. And we’re just going to choose the Porsche whenever it shows up here. Because that’s the card we’re creating first. Okay. Porsche, Porsche, Porsche. Where are you? That’s a Porsche. All right. So I’m going to select the image. And there’s my Porsche. All right. Cool. Now I don’t want. I don’t want the cards to be that tall. That’s that’s freaking massive. So what I’m going to do is we’re going to tame the beast here. So I’m going to grab my card. Let’s go ahead and name this. Rename. Okay. We’ll just name this card.
0:18:01
And there’s the image in the heading inside the card. So on my card, I’m going to set it to layout position relative. Because this image, I’m going to actually need to position absolute inside of here. I might even do the heading absolute as well. So in order to make sure that those stay contained inside of the card, I need to set the card to relative. Now what I’m going to do is, let’s see, so there probably needs to be a height on this card because I want to control the height of the image. Right. So we’re going to set a height of 40. All right. And then the image is actually spilling outside of the card. I don’t know why because I set that to, I didn’t set that to absolute yet, but I’ll go ahead and set that to absolute. And we will go, let’s see, size. I want to fill the whole card.
0:18:50
Okay. So we’re going to do with 100%. And we’re going to do height 100%. And because it is positioned absolute, it’s going to contain itself now inside of the parent element that is positioned. Now you’re seeing it squishing it because anytime you do this, like you set dimensions on an image that’s different from the aspect ratio, it’s going to squish. But if you go to custom CSS, you’ve seen this in a previous tutorial. Let me actually set this to Dracula. So we can see it better. We’re going to say object fit is cover. And now it’s going to behave like a background image. So we’ve effectively, we’re able to control the height and the width of the image without stretching or squishing it. And then that’s it.
0:19:32
Okay. So it’s absolutely positioned inside of its parent container, which is the card wrapper. And it’s covering the heading. You’ll see that that’s a, or actually, let’s say, let’s double check. We’re going to go look at it on the front end. I’m pretty sure it’s covering the heading. It is. You can’t see the heading. So now what we have to do is bring the heading above the image. We’re going to do that with Z index. If this is all hard for you, I can’t remember if I mentioned it or not, but I have a whole tutorial on building cards properly in oxygen. That’s why I’m not going slow and explaining every single step. I’ve already done this stuff in a previous tutorial. I’m just kind of trying to get to the end result so that we can learn how to use repeaters. Because that’s what the entire goal of this is.
0:20:14
So I’m going to set the color to white on this. And I’m going to set the layout Z index to two. And you’re going to see that it elevates to the top. I’m also going to set this to position absolute. And I’m going to attach it to the bottom of the card. Now I don’t want it to be like that. I want to have some spacing around it. So I’m actually going to say, let’s do M’s. I’m going to say 1M from the bottom. 1M from the left. And then 1M from the right. So that it can’t touch the edge over there. If this title gets really long. But that should be pretty good. Maybe we’ll try 1.5M on all these.
0:20:54
That’s much better. Okay. I’m not going to make this super fancy guys. Because this is not a card’s tutorial. This is a repeaters tutorial. But I will go to borders and set a border radius on this real quick. We’ll do like 0.5M. All right. So let’s save. And let’s view our card on the front end. Perfect. Okay. That’s all we need. That’s all we need right now. And then we will link this up and all of that. So here’s what’s going to happen now.
0:21:24
Like we take our card and we drag it into the main repeater div. And let’s just see what happens. Okay. So I’m going to drag this. Now it’s inside the main repeater div. I’m going to hit save. And I think this is where, again, people get confused. They’re like, oh my gosh. Like, great. It repeated my card six freaking times. But that doesn’t help me. That doesn’t accomplish anything. And you’re right. It doesn’t accomplish anything. So now what I’m going to do is show you how to convert the card for use inside of a repeater.
0:21:53
Now that we’ve built the card, like we did the hard part, let’s go ahead and use dynamic data. Now in order to use dynamic data, every make inside of our custom post type has to have its own image. All right. That makes sense, right? Because we have to be able to pull the image into the card. So I’m going to open all of these. Audi, BMW, Jaguar, Mercedes, Porsche, and Volkswagen. And I’m just going to go add a featured image to each of them. Let’s throw me back over here. Featured image for this make is right there. So I’m going to go ahead and not having automatically, which one am I editing? Audi?
0:22:30
I don’t know. I think this is an Audi. Okay. Yes, that’s Audi. And I’ll hit update. And then I’m going to come to BMW, featured image for the BMW. Let’s find the BMW is right there. And I’ll update that one. Let’s find a featured image for Jaguar, which is this one. Update. And let’s do Mercedes. Is that one. And let’s update. And now Porsche. Is that one.
0:23:03
Update. Volkswagen. Is that one. Update. And that’s it. Okay. So now all of my makes have their own images. And they also have their own headings because they’re all different. So that’s all done. Cool. So now all we have to do is tell the repeater, all right, pull in the title and pull in the image. So we just really have to convert what we’ve already done here. So I’m going to grab this image right here. And I’m going to go to the primary tab.
0:23:37
And I’m going to click the data button, right? Instead of browsing and finding an image, which is just going to pull a static image into the card, I’m going to do data and pull the image dynamically from the featured image, all right, of the card or of the of the post type. Then I select size. We’ll just see medium large here. And I’ll hit insert. And instantly you’re going to see, boom, there we go. We have all of our images inside the cards. And then we’re going to handle this. Now remember our post type, we look at it on the back end. It just says outy. It doesn’t say outy repair. But for SEO purposes, I actually wanted to say repair behind all of them. So no problem. So what I’m going to do is let’s go into the card here, heading, double click.
0:24:23
And I’m just going to highlight, push and take that away. And I’m going to come up here and hit the insert data button. And I’m going to go to title. And then I’m going to insert. And then I’m going to put a space between them because I don’t want them to touch each other. And then I’m going to click out. And it’s going to refresh. And there we go. Now it’s definitely looking broken on the front end. But I think that’s here. I’m just going to, let’s see if we can apply the query parameters again. If we don’t fix itself. And I don’t know what it’s doing. Okay. But I bet if we look at it on the front end, we’ll be okay.
0:25:00
There we are. We’re perfect on the front end. No problems. All right. This is release candidate two of the of oxygen 3.8. So I don’t know if this is a bug. Like it definitely feels like a bug. I’m going to go ahead and I’m going to show this to the oxygen team and see what they think about it. But let’s just hit save. We see it on the front end. I’m hoping it’s it fixes itself. Let me refresh the actual builder. Okay. So great. It fixed it when it refreshed.
0:25:32
All right. Let’s talk about how to add a card link wrapper to the card now. So one thing you’ll notice about repeaters is the primary div inside the repeater. You cannot attach a link wrapper to. So if you’re making cards and you want the entire card to be clickable, you’ll need to add a card inside of the parent div. Don’t make the parent div the card wrapper, right? Put it make a card wrapper, make it its own thing, and put it inside the parent div. And then you have the ability to add a link wrapper. So we’re going to go ahead and click the link icon. And then we’re just going to close this box that shows up. And you’re going to see it’s glowing now to show us that it’s a link. It also says this link icon in here. It retains the same class and all of its features. I do notice that sometimes it does weird things to the content inside of it.
0:26:23
Not really sure why, but you know, it’s fine. Like we can fix that kind of stuff. All right. But here’s the thing. You now get the URL box. And instead of setting a URL or typing in a URL, we have to pull that dynamically just like we pulled the image dynamically, just like we pulled the title of the card dynamically. So I’m going to click data. And I’m going to click permalink. And that is going to attach that post permalink to its card. And then I’m going to hit save. And we’ll just do one other thing to make this a little bit cooler here while we’re while we’re doing this. I’m going to go to state and I’m going to go to hover.
0:26:59
And I’m going to go to advanced effects, transform, add transform. We’re going to scale this 1.02X and 1.02Y. Again, this is on the hover. I’m going to go back to the original. And I’m going to go to effects, not opacity, transition, 0.3, and do all. Just I’m just doing this real fast. So we can just get a little effect here. And safe. Okay. So now I refresh. Now we have a dynamic grid. The little cool little hover effect. Right. And I can click these things now.
0:27:39
And it will take me to repair slash Porsche. And if I click this one, repair slash Volkswagen. So I can query this on. And now I can copy and paste this repeater onto any other pages where I wanted to show all the makes. And guess what? If you go to add a new make, why don’t we just do that? Why don’t we just do that? Like, because if you made this manually, I don’t want to go through all of the like benefits of doing it this way. And you should hopefully be able to kind of see the benefits of doing this way. Like if I had categories for each of these things, I could then filter by category. I could filter by car color. I could feel like whatever you want to do as far as taxonomies and filtering goes, is available to you.
0:28:17
But really the easiest thing now is let’s say the client wants to come add a make. You know, we wouldn’t do this because we haven’t created a template for it yet. But let’s just say that they did. So they add a make. And let’s say they’re going to add mini Cooper. Okay. We’ll just say mini. And we will add a featured image. Geez. All right. So let’s go to pixels. Maybe they have some. All right. We’re going to go to mini Cooper. All right. And then yeah, sure. Let’s just let’s just grab this one. All right. Three download. Cool.
0:28:55
Mini. Repair. All right. We’ll go to scoosh right quick. Oh, that’s me. All right. All right. We’ll resize this because I don’t need it to be gigantic. So height. We’ll just do 1920. That’s way too big. But it’s much smaller than it was. Actually, let’s do 1280. Okay. And download. Okay. Mini repair.
0:29:23
And then I just drag that into there. And I set the featured image. And I hit publish. And I publish. And then we just refresh our grid. And you’re going to see we now have many repair on there. Right. And I’m not going to go through all the like let’s let’s dim the backgrounds. We can see the text. And again, this isn’t a card. Citorial. This is a repeater’s tutorial. But you’re going to see like my repeater dynamically handles new information now.
0:29:50
And so if this was on five different pages on my website, I have to manually go add the new make to every grid that has the make senate. It’s just going to automatically do it for me. And I can do I can create pagination. I can do a lot of different stuff. In fact, let’s go ahead and take a look at that. So if we go into query, you have your filtering. So you can filter by taxonomy, which is category effectively. So in any of the following categories. And I’m not going to again, we’re not deep diving. I’m literally just showing you what is the concept of a repeater. How do we make a basic repeater work? I’m not going to deep dive on all this stuff. But you have the filtering.
0:30:28
You can set the order. You can set the number. If I set this to six, it’s going to paginate. It’s going to have pagination attached to it. So we’re going to see what that looks like on the front end. There’s your little pagination. If you don’t want the pagination, you actually have to query the exact number that’s in your or a number larger than the amount of items in your custom post type. Or you have to go to the next step of how do I remove the pagination? Which, if you’re doing oxygen 3.7 or sooner, is actually quite difficult. If you’re using the new 3.8, which we’re going to talk about right now, you can actually do that. So with 3.8 instead of going to custom, you would actually go to advanced. And there’s some presets that you can choose from.
0:31:15
But we’re going to go ahead and do an advanced query effectively. So we’re going to hit edit query and we’re going to add a parameter. And we’re just going to find post type in here. I haven’t actually memorized where all this stuff is yet. Because this is relatively new. But I’m just looking for post type. Okay. Post type. There it is. Good. And then add value. And this is a little bit harder to do because you have to kind of know, you know, kind of what’s going on on the back end. But remember, my post type is actually called repair. It’s the slug.
0:31:49
It’s actually, I think. I think it uses the slug here. We’ll check it out and see what happens. Next, what I want to do. Let’s see. I don’t want to worry about like categories or anything else. I do want post post per page. I want that to be. We’ll just do our six for now because I want to show you pagination showing up. Yeah, let’s just do that. Let’s just keep things super basic for now. I think this is going to get the job done. Save. We’ll go back. We should have effectively exactly what we have there.
0:32:22
Yes. Okay. So that’s how you use the new advanced query builder. But the benefit here is that I don’t want to show that pagination necessarily. Maybe I want to even use WP grid builder, which that’s what I always do, to input my own custom pagination or I can put in a load more J query button, which will just dynamically load more things into the grid when people click on it. Right. There’s a lot of options there. Bottom line is I want to get rid of the pagination. So what we’re going to do is we’re going to go back and edit our query. We’re going to add a parameter. And I think it’s no no found rows is what I’m looking for. Which oddly doesn’t have a lot of documentation on it inside the WordPress documentation. I must have missed it.
0:33:08
All right. So again, what am I looking for? We’re looking for it together. No found rows. Raise your hand when you see it. Where is it? Where is it? Do do do do. I need some I need some jeopardy music cue the jeopardy music. There it is. No found rows. True. And now when I save. We have no pagination. All right.
0:33:34
So that is again, I’ve given you the disclaimer. So don’t be disappointed that we’re not doing a super deep dive into repeaters. This is literally for the people who are like, what is a repeater? Why would I ever use one? And how do I use it? Once you figure out. Now again, my last video, top 10 use cases for custom postites. Literally is 10 reasons for using a repeater. You would use a repeater for every single one of those custom postites. So go watch that video. You’ll have 10 reasons to use a repeater. And now you know how to create a basic repeater. And you know how to get rid of the pesky page and age. And you’ll have to be pagination if you don’t want the pagination. So hope you found this video helpful.
0:34:16
We are going to do more stuff on this. If you want the premium training on repeaters, if that’s something that really interests you. I’m willing to create it as long as it is of interest. So drop a comment. Let me know. Hey, Kevin, I would love a premium like deep dive training on how to master repeaters. You know, I’ll be looking for those comments. Otherwise, again, hope you found this helpful. Hit like, hit subscribe, drop a comment, and more to come. Peace.
