With the memberships feature you can allow your users to create and manage their profiles as well as define what part of the application is going to be accessible to which users. Using this functionality, you can build online communities with membership, client portals, create gated directories, paid courses, and so on.
In this guide, we'll go through the process of setting up user accounts on the E-Learning Website template for online courses, making the courses available for registered users only. Moreover, in the subsections to this article, we'll examine each User Accounts building block in greater detail. So, let's start.
In the Startup Academy template, the online courses are made available on the Home page. We are going to create a separate "Courses" page for them in order to make the page available for logged in users only.
Separate page for courses created
The Courses page with the list of courses
The list of courses is created using the List block. You can get familiar with the block and how it;s configured here.
To start with the user registration process, we first need to set up a signup page. The Signup block is available under Add Block => Dynamic => User Accounts => Sign up form. So, let's create a new page and add the Signup block there, and let's also create another page for the Signin block, which is available under Add Block => Dynamic =>User Accounts => Sign in Form.
Signup form
Signin form
Each block's configuration options are discussed in detail in their respective articles (links provided above), so we won't go into that here. For our purpose, we have just changed the logo on the forms, as shown in the screenshots above, and we also need to check the Sign In and Sign Up button configurations.
On the Signup form, the Sign up button has a predefined action, as shown below. So, we don't need to do anything here. The same is true for the Sign In button on the Signin form.
Signup button action on Signup form
However, as you saw, there's also a Sign In button on the Signup form, which we need to link to the Signin Page we have created.
Linking Signin button to Signin page
Similarly, on the Signin form, we should link the Sign Up button to the Signup Page. Thus, we've set up all the pages we need. Now let's configure the Header and what different users see and have access to on the web app.