How to Create a Client Portal?

Creating a client/partner portal that enables you to share your Airtable data with external users is one of the most common usages of Softr. You can do so in a secure way that enables you to restrict who has access to your Airtable information. This way you won’t need to share your Airtable base with your external users. In addition, you’re going to be able to customize your user’s experience by offering them an intuitive user interface similar to the web applications they are used to and tailored to your brand and your way of working.

​

1. Getting started with the client portal template

The Client Portal template is a powerful agency web app template that enables clients and customers to collaborate on ongoing projects: Consultants and Managers will be able to keep track of their clients, projects, tasks, and payments in one place. In addition, they will have access to a list of team members and their contact information. Clients will be able to see their own projects, tasks, and invoices. They can add new tasks to the projects and pay past-due invoices. You can find detailed instructions on creating a Softr app from a template here. Just search for “client portal” and select the template. However, before we create an app from a template and start customizing it, let’s Preview the template to explore its features. There are three user groups available by default. If we, for instance, log in with a Client Email, we’ll see that clients have access to all of their projects and tasks and can also manage and pay their invoices (using the Stripe integration). Further on, if we log in as a Consultant, we’ll have access to some additional sections such as company clients (along with all the projects assigned to them). Moreover, they can add tasks to clients’ projects. Thus, consultants can access the information of all the customers, while clients only see the info that’s specific to their projects.

​

2. Create your client portal

One of the easiest ways to start creating your client portal is to use the Client Portal template. The process is pretty straightforward, so let’s take a quick look at the steps involved.

​

3. Updating the Client Portal template to make it your own

​

Sharing your data with your clients

Softr makes it extremely easy to share data with your clients in a secure and user-friendly way. To do so, simply use one of the available blocks (for example, List or List Details), connect it to Airtable, and you will be good to go. As we discussed earlier, each user group sees only the blocks and pages that are relevant to them. This is achieved through conditional filters that can be applied to dynamic blocks (that fetch data from Airtable) to filter the list differently for each user. In the image above, you can see that the conditional filter applied on the list of projects allows the logged-in user to see only the projects that are assigned to him/her. This way, clients, for instance, will be able to view only those projects that contain their email under Client Email, where Client Email is a field in the template Airtable data source.

​

Allowing clients to add data

Allowing your clients or team to add data as part of their collaboration workflows is essential in almost all client portals. The Client Portal template allows clients to add new tasks to their running projects using a simple form. Below, you can see how the client logs in and submits a task using the form, which is then stored on Airtable. To store the form submission on Airtable, you just need to connect it to the corresponding table through form settings as well as map all the fields. Moreover, as you can see below, the task is automatically assigned to the project it was submitted for. This is done through a form hidden field, which grabs the record ID from the project URL. The ID differs depending on which project (i.e. record) is opened in the project details block at a given time.

​

Allowing clients to edit data

In some cases, you may want your clients and team to edit information. With Softr, you can enable them to do that without having to share the entire Airtable base and, if needed, be very specific about who can edit what.

​

Adding members to your client portal

Since the client portal implies a selected group of users without a public signup page, you’ll most probably be adding users through one of the ways described here. You can find more details on the other aspects of memberships in our detailed guide.

​

Restricting access to pages and data based on user roles

Each block or page in your Softr app can have its own visibility rules that specify who can access it. Our visibility settings overview will help you understand how this works.

​

Brand your portal to match your, or your client’s, website

Softr provides a variety of options for customizing the look and feel of your app. You can configure your app’s theme in general as well as apply more granular stylings for each block.

​

Personalize the app by adding the user’s name to text fields

Finally, you create a more personalized experience for your app users by adding this specific variable {LOGGED_IN_USER:NAME} in any static text field to show the logged-in user name.