How to Build a Customer Portal on Stacker

Customer portal software is a secure way to allow customers to update or send data to your business. For example, a property management company might use a customer portal to share data with the tenants who live in the properties they manage.

 

You can build a customer portal in Stacker with our 30-day trial. Stacker allows you to create beautiful customer portals, enabling you to choose exactly which data from your spreadsheets your customers can see and interact with.

Content

• How to set up a customer portal on stacker
• Setting up your users for a customer portal
• Setting up a 'My Profile' page in a customer portal
• Edit the List Layout
• Edit a Record Detail page
• Add an Action button
• Sending your app to your customers

‍

How to set up a customer portal app on Stacker

The company in this example already has a base containing information on their tenants, as well as their property maintenance requests, subscriptions, and property news.

 

We're going to configure this app so that the tenants can log in to see and update only their own information.

 

First, create an app and connect your Airtable base. Stacker will then generate a basic app, built on your data, with default layouts.

Setting up your Users for a Customer Portal

If you're creating a customer portal, you likely already have a list of the users you want to log in and their email addresses in the data source.

 

Go to  Manage users. From there you can select which table the users are in, and which field their email addresses are in.

 

Once Users are set up, your users will be able to log in to your app. You can give your users a specific role here. This is particularly useful if you'll have different types of users accessing the same app - for example, tenants and property managers.

 

Having completed this step, you can also preview your app as a particular user, to check everything is working as it should be.

Setting up a 'My Profile' Page in a Customer Portal

Go to your  App Settings and head to the 'Navigation' section. From here you can control which tables are turned on, and configure your navigation menu.

 

If you've added a table with your users' data you likely have a table called something like 'Customers' or 'Contacts'. Rename this to 'My Profile' - because when a user arrives in your app, they will only see their own information. These changes won't affect the names in Airtable, only the wording in Stacker.

To ensure that a user can only see their own data, you need to set up Permissions.

 

Head to  App Settings and find the table where you'd like to apply the permission. Click Add new permission to add a new rule, or edit the existing one by clicking the pencil icon.

 

Follow the instructions to set up your permission rule (if you get stuck we have a detailed walk-through on this element here).

 

You need to set up a permission rule for each table where you'd like the rule to apply. Don't forget to 'Preview as' a user to check that your rules are working correctly.

Edit the List layout

Stacker is built with lots of flexibility, giving you lots of control over how your app looks.

 

Stacker allows us to edit the way our data is presented on two distinct levels: the first of these is the List layout. A List layout has all of the records from a particular table from your data source.

 

You can configure the settings for your List layout by going to  Edit layout. You can choose display types including cards, list, profile or inbox (only available on some plans). Choose whichever works best for your use case - or whichever you think looks best for your customer.

 

You can also add headers and add filters for your records.

Edit a Record Detail Page

The second level on which Stacker allows you to edit your layout is a Detail layout. To take the example of a customer's My Profile page - this makes most sense to display using the 'One Record Only' option, as each user will only be able to see their own record page.

 

You can also edit the layout of this detail page to fit your needs by adding tabs, pulling in related records and adding widgets.

Add an Action Button

Action buttons can also be added to containers. While editing your Detail layout, select a section and navigate to 'Actions' in your Edit bar.

 

This will take you to the Action Button menu, where you can turn on buttons, choose where you'd like them to appear and what they'll look like.

Sending your app to your customers

You should now have a fully functional app, built in Stacker on top of your data. The next step is sending out the URL to your customers that are on the user list you added earlier.

 

You can find the URL in Workspace settings (building icon) > General. When your customers try to log in, they will get an email with a code and a magic link they can use to log into the app.