Creating a CMS collection
Summary
In this episode, we’re building our first CMS collection. We’ll be building a custom database for our Nessie NFT data, we’ll then add the content and prepare for making a collection list on our homepage to display our NFT’s.
Watch Here
Listen Here
Weekly tips
Cms = content management system
3 ways to display a cms collection
Create data fields you want populated
Instructions can be added to your cms data fields
Use dummy content before the database is filled
Media must be imported from desktop not assets panel
Transcript
Joseph: And this video, we are going to build our CMS database and then start populating it with the Nessie NFTs. So you've got the controls. So I'll try to walk you through it. It's a new thing. So we'll see how that goes. Let's jump right into it. All right. So can you do is go into the CMS tab on the left side.
Joel: I'm sure we got some little toolbar hints for me so we can get to the CMS section. All right. Let's create a new collection. I bet is where you're going to send me.
Joseph: Yes. Okay. So we want to now populate the fields in which we're going to want to fill in data for each of our collection items. So we're obviously going to have.
We might want a title. We might want a bunch of different things. So keep in mind when you're building a collection list, the information appears in three different ways. So number one, you are going to make a page for the entire collection list. So if you were making a blog, you would be able to display all of the posts in one page.
So that's the collection. And then every individual blog has a design. So each of our Nessie NFTs will have its own page that someone could go to. And then third is populating that data into like our website page. And so when we're building our collection list, we want to be as detailed as possible. Do we want meta descriptions?
Do we want specific colors? Do we want tags for it? Do we want to have a, an animated versus real life tag? So that's what we're gonna want to think of when we're building the fields. So right now in the very top panel, there are just templates that a web flows already pre-built. So we could go up there and look at them.
So we got blog posts, authors categories. I don't know if any of these are going to apply so we could just start creating our own. So let's just start making our own one. So you can hear it go in here and start populating the data. So we need to collection.
Joel: So our blog post name is going to be our we're going to have a list of Nessie sightings. Is this what we're calling or is this is going to be our list of NFT RNs, Nessie NFTs.
Joseph: Yep.
Joel: So this is what we would call this. Here is our Nessie NFT name.
Joseph: Yeah. However you want to refer to it. So probably just
Joel: Would we, okay. Okay.
Joseph: So this is just the name for the project and you probably don't want to cap it because this will be, I guess it doesn't matter, I guess the slug fixed itself. Okay. All right. So now we can start coming up with our collection fields so we can, if you want to start adding new fields.
Joel: Put Korea collection first or no, that'll
Joseph: Nope. That'll create the entire thing. So we want to add new fields for now. All right. So what do you, the first thing, and I'll let you start going through this, but the first thing we'd probably want is an image.
Joel: Yes.
Joseph: So now you can name this, that people know. So on the right side is the preview of what it will look like when you're going into build the collection.
Joel: Okay. Okay.
Joseph: And so this is where you can give instructions.
Joel: Okay.
And so we don't have any belt out specs for this yet.
Joseph: So we can leave those and just make that field required. Probably.
Joel: Yes, because we would want to make sure that this would end up being required. Okay. So we would definitely want an Ms image. So then we're going to want a description for that image.
And we probably want that plain text as opposed to rich text.
Joseph: Yes. Because the rich text is for like a blog post that would have images inside it or.
Joel: So this would be our NFT description. Okay. Ride a provide a hope, another role. The P came from.
Joseph: alright, so we'll probably want to put a max character count on this and you can do multiple lines. And then we probably can do, I don't know. I don't have any characters you'd want, I'd probably say one 50 or 300, depending on how we utilize this. And then let's see the name or the slug. I don't know if we care about those. All right. So we've got, we don't need rich text, but you've gotten image.
Each one is only gonna have one image. So we don't need a multiple image. We're not doing a video. We're not needing to link it. We're not doing an email, a phone. So the question is, do you want a number of them? Do you want a number? Which in what order you bought them?
Joel: Not that particular number. The question would be. Does this provide would there be a way to sort them in a particular number later on? If I wanted them to display in a particular sequence, would numbering them be helpful? So could I assign a number for later sort or sorting them?
Joseph: Here, so here's where you're going. Yes. As long as you pre knew which numbers cause.
Let's say you have, let's say you have 12 that you put it now, when somebody goes and adds the next one, what are they going to do? 13. They're not going to come in and do two when a tooth is already selected. So if you're pre-planning the entire thing. Yes, that works. But it doesn't work for a database for you're constantly adding on. Cause that's the same as just doing the newest.
Joel: What if I did a batch number? Maybe. So I like these could all be batch number one. And if I do a batch number two, maybe I just do a group number and then maybe I'm thinking ahead. So that group batch one is together and batch two is together.
Joseph: Yeah, if you have, yeah, if you have a way you'd want to implement that, we could try that.
Joel: So let's do let's at least think of that far ahead. batch number
Joseph: and for this field, I almost wouldn't make it required because someone might not even know what that's supposed to be. Obviously, if it's just you, it could. All right. Let's see what other fields we might want to add. All right. So you've got a date and time. So a switch is a very interesting option.
So let's add that. Okay. All right. So you could make this a featured switch, so you could call this featured and then help texts. Do we want to feature this nFT?
Joel: Okay.
Joseph: All right. Let's see what else we could add . A color. You could assign certain colors to them if you wanted. I don't know if that'll really apply, but sometimes it will an option. This could be an interesting one. You could do an option.
Joel: Okay.
Joseph: All right. So let's do, if it's so NFT type.
And I would just leave that blank for now. Let's add an option and do like cartoon real life, just some different options. Line art.
I actually have one. That's an animated.
Perfect.
Okay. All right. So then you can save that field. All right. Now let's go look at name and slug. So I dunno if we're naming them, but let's keep the name all in there. I would not make the slug that's the forward slash I guess we can make those required. That's fine. All right. All right. So let's create the collection.
All right. So this is the, an option. It let's say you were going to build a blog. Your client was going to but you still needed like content pieces to show you how it will look in real life there in the website. You can just add in these fake data things. But let's not do that. So let's add a N let's add a Nessie NFT to the top, right?
To add one. All right. So we can. Fill one out. So why don't you grab an image first?
Joel: Now we're getting into some of my fun NFT puns that I happen to love.
Joseph: Yeah, definitely. At some point after it'll be good to see them. A little bigger, cause definitely hard to tell what it is.
Joel: Yeah. Here we have the crock. We have the crock ness monster in a Crock-Pot it's a very adored. Okay. I think we have all 12 loader into our CMS open. It looks like, oh our for very first two, we're missing a meta-description so I can go back and add those. Cause we hadn't had that tab yet. Let's fill in some basic stuff here.
Joseph: Okay sweet. This will save us when we start building. We'll see how easy it is to add really cool sections to our page. Now that we have all this data important. So I think really that's it for this video. This is how you would build your CMS in the backend.
