What's up Wix Nation, MPS here from Wix Training Academy. And today I'm coming to you with part two of our mini series on How to Build an Online Course Website in Wix.
As mentioned, let's keep banding together during this time and expanding our business and find opportunity in these wild times with the whole Corona virus pandemic. And doing that, we're building an online course website in Wix because everyone is going to be spending their time on the internet as they're working remotely at home and have more time on their hands due to the whole quarantine. So let's do this.
The Wix Corvid Development
And today I'm going to show you how to build kind of the backend infrastructure of our online course website for Wix. So in the last video I showed you how to go ahead and create the whole payment process, how to build your paid plans, and I showed you how the process would flow, how the user would come in, select their plan, their purchase option, go through, they'll create their account, and then they will then be prompted to purchase the course. Now what we're going to do is kind of build that process of where they go after that in the back end.
Adding Member's Area
So first and foremost, what we have to do is we have to go to to Add and we have to go down to Members and we're going to go ahead and add a Member's area to the site. The reason we're doing this is because they have log in capability. So we want them to be able to access their member account here. This is where there'll be able to access that. Now this is where their account details lie. So when they come up here and they log in and we set up that login bar, it'll allow them to come down to this page. But what it'll also allow them to do is we're going to create an additional page where they can actually access the course. So, now that we've got our page here in our Members area, what you now see is a log in bar at the top.
So when they're redirected, after they purchase, they'll be able to log in or already have been logged in because they created an account. And they'll be able to now access their account details. What we have to do is we actually have to build the back end structure this now. So what does your course look like? You have to define in your mind what that looks like. What I will tell you is there's various options that you can choose as far as how you plan out the back end look and feel your course.
Now I'm not going for design in this video, I'm not showing you how to design each element, how to make it look pretty. What I'm showing you is how to actually do it, the functionality behind it. And with that there's a couple of routes you can take. You can take the Wix video route and what Wix video is, is Wix video is an app and it'll allow you to post your videos on that app and just place the app on the back end, Wix membership page, where they access the online course.
That is one option here. And with that, that'll work, but that'll only really work if you just have video. And that's all you really want to show. You can also add other pages and add navigation. If you want to use Wix video, plus add like a transcript section or different portions of your course, audio sessions, whatever you may want that to look like.
The other option which I'm going to show you is you can actually create a back end function using Corvid databases. So what you'll do is you'll actually upload your online course material to the databases and you'll display it dynamically on that course page. So what we have to do first is create the course page.
Managing Member's Menu
So we can see here we've got a menu. We're going to go ahead and manage our menu. Now this is different than your regular menu. This is your members menu. And to show you the difference, if we click menus and pages here, you'll see site menu up at the top and then you'll see member pages. Member pages is where your member pages are. So this is a separate menu and we're going to go ahead and we are going to add a new page.
So now we've added a new page here and we will name this, course. And we'll go ahead and put it there. And this will be our course page. Now I'm just going to say this right off the bat. You can choose to keep your membership card here, all that kind of stuff, or you can delete it off of this page. If you did choose, that is totally your call. I'm just going to go ahead and move ours over for the sake of this. But you can see an additional tab was added to the menu so that way when people access their account, they can jump straight to the course.
The Corvid Developer Tools
Now what you have to do is you have to set up a backend database that will allow you to display your course content. So what we're going to do is we're going to go up here to Dev mode. We're going to turn on Dev mode, and this is going to activate your Corvid developer tools.
Once you get in here, I know it looks complex. You've got your properties panel, your code, page code and then your site structure. We're going to make this easier. We're going to close that. We're going to close that and we're going to close that and what we're going to do is we're going to go down here to our Content Manager. We're going to click this and then you'll see access to stuff that already exists. You already have your plans app, you've already got badges and private members' data because we've got a members page. All of these apps are now open to Wix API which means you can manipulate them through Wix code or Corvid tools. But now we have to create a new collection and we are going to start creating and we are going to start from scratch and we are going to name this database ‘Course Content’ and then we are going to choose custom use and we are going to set up custom permissions.
Now who can read content from this collection? Essentially this means who can actually access the content from this database and we want that to be the site member, someone that's already registered and went through the payment process. Who can create content for this collection? Admin, who can update content? Admin, who can delete content? Admin, you’re the course owner, you're the person updating the content in this so only you have the ability to add content to the database and then we are going to set and create collection.
Once it does that, it's going to spin its wheels, work its magic, and then the collection, our collection is going to pop up. Now that we're in here, what you have to determine is you have to determine what type of content you're going to be posting. Are you going to be posting videos? Are you going to be posting texts? Are you going to be posting documents? What are you going to be posting? And you have to determine what that is because that'll determine what type of fields you have to add here in your database. Will you have to recognize is that each field will represent data, it'll represent a piece of data.
Now I'm going to go under the impression and just pretend that we are building an online course that displays videos. So if that's the case, we're going to go ahead and pretend we're building videos. Now what you have to recognize is right now with Wix databases, you can't add native video in there quite yet. However, what you can do, and I actually made a video on this, is creating a video sharing website is you can upload your videos right now to either Vimeo or YouTube, keep them on private or unlisted, and then you can add a native video experience to your end user. It just won't be uploaded into the database. So let me show you how to do that.
So for creating course content, we probably want a video title and that'll be text. And then what we want, because we want just the title, then we'll want the actual video itself. And then we want this to be video. We want this to be URL and we want that to be URL. The reason is because you're going to take that private or unlisted URL from YouTube or Vimeo and you're going to put that in here. And then that's going to display an output video. And I'll show you how that works.
So we're going to go ahead and add that. So now we've got video title, we've got video. So now we've got two pieces of content. You've got your well really one piece of content. You've got the title of your video and then the video. And we're going to utilize repeaters to actually build that page out. And we're just going to pretend this course is just video like I said.
Now if you want to start getting into modules stuff like that, different sections of the course you can do. So I'm not showing that in this particular video showing you the bare bones, how to actually get your online course off the ground without getting super sophisticated and fancy with it. But it is possible utilizing databases.
So now we've got our video title and our video. We're going to go ahead and x out of this. What we now have to do is we have to get our course page prepared. We're going to utilize repeaters and what the repeater is is it's going to go ahead and take the next database item so that way if we have multiple pieces of content, it'll display each piece of content. What we need to do, to do that is we're going to go to add and then we are going to go to lists and grids and once we are in lists and grids, we're going to select one of these as our form of repeater.
So for the purpose of this video, I'm just going to choose this repeater here. Once again, it doesn't really matter which one you choose and now that we have it added, we can actually manipulate the repeater and I'll show you how that works. And we're just going to add our, so we're going to go ahead and just design it a little bit. I'm going to get rid of the picture. There, I'm going to get rid of this text not needed and I'm going to get rid of this text right here and now you can see what happens in that first repeater happens across all of them.
So you can see I removed the pictures, the text and now we see it happened across each repeater. So we'll keep this text up here for our title and then I'm going to make our repeaters a little bit bigger here because now what we're going to do is we're going to go back to add and we are going to go down to video and then we are going to choose this video upload and it's a video player. And then we will go ahead and put our video here and now you can see as I added the video up on this one, it also added it across each of our other repeaters because it takes each database line item and it will display it.
So now we've got our video title and we've got our video. What we have to do is we have to connect the data, the pieces of elements in here, these elements to the data in our database. To do that we have to go back to content manager, add content elements and we're going to go ahead and add a dataset. We're going to just drag this off. This data set is invisible so wherever it is in the editor, it won't show publicly. You'll press settings and we have to connect it to a collection. We want to connect it to course content, we want it to be read only. They're only going to be able to access like view the videos or not email to edit them, modify it, stuff like that. And then you choose how many items you want to display.
So if you've got 10 pieces of content, you'll want to display 10 pieces of content or really you can display 50 and you can choose that number 50 and it just means if you add more content, it'll display up to 50 you can change this data set number as far as number of items to display at any time. Once you do that, we now have to connect the items in our repeater to the items in the database.
So first and foremost we have to go ahead and press this, connect to data. And this will connect to our course content dataset. And the text will connect to video title because that's our video title. So we connect that and now here's where that video works. So what that link will actually do is it'll output as a video here. So now what we're going to do is we're going to connect this video to video. It's connected to the course content dataset and then video source. Make sure it's video source connects to video URL.
And now what you have is you've got your video title and video source, the actual video itself connected to the data in the database and you'll know it's connected when it's a green and this icon is green. So now that we've got it connected, what we need to do is we actually have to add the data and then view the finished product.
And that's how you build the back end infrastructure of your online course.
Now, as I mentioned, I showed you bare bones. If you're just adding videos, you can get much more sophisticated. You can build out several pages with several modules and have different course content on each of those. You can create different databases if you want for each different type of course content, whether it's PDFs, videos, text, audio, and you can go that route. But I wanted to show you video because traditionally a lot of people upload video as online course content. That's kind of the modern move and that's how it's moving.
So I wanted to show that because that's the most common and most popular form. So now in our following part of our series, the final part, I'm going to show you how to add the data and then how to actually display it and how it'll look, how the process works.
If this video helped you out, I would kindly ask that you drop a like down below, comment in the comment section if you've got any questions whatsoever and make sure to hit that subscribe button and turn those bell notifications on. So you never miss a single upload, especially as we're all banding together to expand in this time of wildness during the Covid-19 Corona virus pandemic and grow together in our websites and our online businesses utilizing online courses.
Thank you guys so much for watching stay healthy. And I'll catch you on our final part here on Monday.