Step 1: How to Create a Client Portal with Glide: A Step-by-Step Guide
Build a Custom Client Portal with Nocode
In this video series, I show you how to create a custom client portal from scratch using Nocode. From importing client data to enabling profile edits and managing deliverables, I’ll show you everything from adding team admins to launching the portal!
Want free access to whole series? Free Download
Take your business to the next level with my complete series on building a custom client portal with Glide.
The Ultimate Guide to Building a Client Portal in Glide
Summary & Key Takeaways
Introduction to Client Portals: I explain what a client portal is, essentially a platform for business owners to share deliverables with clients, like a photographer sharing edited photos or a coach sharing resources with group members.
Using Glide for Building the Portal: I introduce Glide as the no-code platform to be used for creating the client portal. I outline a five-part framework for building the first version of the portal, focusing on creating the client's profile in this video.
Preparing Client Data: The process begins with exporting and cleaning up client data from existing systems. I demonstrate how to trim and prepare the data, emphasizing the need for email addresses for login purposes.
Importing Data into Glide: The cleaned data is then imported into Glide, setting the stage for creating the portal. I show how to export data as a CSV file and import it into Glide, creating a project based on that data.
Configuring User Login and Profiles: The video covers setting up user authentication in Glide and configuring the user login table. I emphasize the importance of securely logging clients in and associating their profiles with their emails.
Customizing the Client Profile Page: The tutorial includes steps to customize the client profile page, like adjusting the layout, adding profile images, and displaying relevant client information.
Dynamic Content Display: I explain how to ensure the portal dynamically displays the correct client information based on who is logged in.
Preview of Next Steps: The video concludes with a preview of what will be covered in the next video, focusing on adding deliverables and interactive elements for the clients in the portal.
Full video transcript
If you want to create a portal to share something with your clients, I've got a solution for you. Glide is a no-code platform where anyone can build their own custom apps and websites without code. And if you have no idea what a client portal is, it's a way for you, as the business owner, to share deliverables with your clients. Consider a photographer sharing edited photos, an accountant managing someone's tax returns, or a coach helping members of their group achieve goals. Here's a little preview of what we're going to be creating. You can click on a client to see their profile, edit their profile. Inside of here, we have all of their deliverables. You can add deliverables straight from the portal here, and you can also add new clients just by filling out this form.
Over the next five videos, I'm going to show you how to create something exactly like this. In this video, we're going to go through creating your client's profile. Let's get started with the tutorial.
So, we're going to be using a no-code app builder called Glide to build our client portal. Now, I have a five-part framework for building out the first version of your client portal, and that's what we're going to do over the next five videos. In this video, we're going to be zeroing in on the first step, which is to create your client's profile. So, you want to be able to have your client log in, and they need to see their profile. In order to do that, we will need to have some client data. And then, once we have this data, we can import it into a new Glide project.
So, I have exported some dummy data from the interweb, and what I want to do now is just trim this down a little bit to just what we need. You can see here I have some dummy data for a list of clients and my team. We'll add in our team members in a later video. For this video, we just want to worry about our clients. And then, I'll have a link where you can copy and follow along or copy the sheet and follow along with me down in the description of all of these videos.
What I'm actually going to do is just duplicate this, and we can rename this. So, one thing you can see here is, if you're exporting data from like an existing CRM or Salesforce or something else, you likely need to do some data cleanup. You can see here I have a bunch of different types of people, and there's so there's clients, there's contractors and suppliers. And for this client portal, I only want this to be used by my clients. So, I'm just going to go ahead and delete the other company types. And then, in turn, I can actually, let's leave this here because we can use that in a later video with defining our roles.
So, for each client, we have their name, their websites, the client manager. I'm actually not going to need that for this; we're not going to do any kind of manager-type stuff in this one. We have the size of the company, the industry of the company. Those are all fine; we can keep those. And then, it looks like we have a, I'm assuming this is like a logo for the company. Yeah, nice. So that's good. So, we have a name, we have their logo, their website, a little bit about the company. So this will be helpful later on when we get into distinguishing our clients versus our team members.
One thing I am noticing is we don't have an email. We're creating the secure client portal to share information with our clients, and so we need something to distinguish them and securely log them in. And we need an email associated with them. So, what I can do here is just add in some dummy emails for each of our clients.
Alright, so I think this is a pretty good starting point for our client list. Let's go ahead and consider this our beginning data set. And so now what we'll do is let me go ahead and export this, and I'm going to import this into Glide. So this will mimic whatever you're exporting from because you might not be using Google Sheets. So, I'm going to export this single table as a CSV, and then if you don't have a Glide project, you can use my link down in the description. That's like my referral link, so I'd appreciate it if you use that if you're just starting out. If not, you can go to your Glide dashboard, and then if you already have a Glide account, you can actually use Glide now to start a brand new project from the URL.
And so, we're going to call this client portal demo. We're going to be creating a Glide page, and then we can start from a blank project. And then here, it says you can import a file from your computer. That's exactly what we want to do. So, I'll just drag in that CSV that we exported from Google Sheets, and then Glide is going to go ahead and create a project for us based off of that data.
So, you can see here I have those six clients here. Now, let's go and look at the data set as well. So, Glide gives us a users table. So, this is like me right now logging in. But actually, I actually want this table to be my users. So, the data we just imported, I'm actually just gonna delete this users' table that was generated by Glide, and we can rename this to our users.
This eventually will house, right now, it houses our clients and will eventually include our team members as well. And then, people will log in with their email. But one thing we do need to do is go ahead and hook up that authentication piece so that the login system is pointing at this table. And so, we can do that by going to the preview section here and clicking on the profile in the top of the view profile. And then, over here in the properties section of Glide, you can select where your users are located. And right now, we only have one table, so I'll select users. And then, name, his name, email, images, image. So, now you can see we have the profile image, the profile name, and the email there as well.
Cool. So, this is like the user's profile page. We'll leave this alone for now. And then we don't need this users' table anymore. Let's delete that. And then we'll just have the single table.
And remember, the goal of this video was to give your user the ability to, I guess, view their profile, have a way where you can view profiles within the client portal. So, here we'll just call this, for now, we can just call this profile, this page here. And then, we will keep it as a custom page. You can see over here the properties for this is custom.
And then on this page, we don't want a collection of all of our different clients. We just want a single client to view their information. So, I'm going to exit out of that. And at the very top, we're going to add in the profile. So, I'll just add in that little preset profile container. And then we can start to edit this.
So, for the container itself, since this is just going to be like their profile, I want it to be a little bit bigger. So, I'm going to make this a little bit larger. We'll do the full screen there. And then, I don't really like this dark color. Actually, maybe I just don't like it with a yellow. So, let me go ahead and change our color here. Let's do like a... I did blue in my other client portal, so let's keep it with that. Yeah, I think I like that color combination a little bit better.
And then we can edit right here. So, this is the title component here. This allows us to map in the user's profile. For image, let's go ahead and point that to the logo of the client or the company. And then for the name, that's correct. And then we just need to change this to be... Let's make this their email. Yeah, we'll do email there.
And then, for an action, we can do a quick little action to go to their websites. We'll just say open link and then call this website. And then, whenever they click on this, it should open their website.
And the last thing we need to do for this page, what you'll notice right here is if I zoom in here, right now, I'm viewing as this company called Open Lane. If I were to change this to Yearin or Open Tech, this screen does not update. And that's because this screen is pointing at... if we click on it, pointing at the users' table. And right now, since this is a custom screen and not a list screen, it's pointing at the top row. So, it's just pointing at the top row there. What we want to do is, whenever I'm viewing as Open Tech and not Open Lane, I want to be looking at the Open Tech row right here.
So, the way to do that is, if we come to our screen here, we go over to options, we can adjust the data that's behind the screen. And I'm going to filter this data to where the email of the company is the current user that's logged in email. So, the user profile's email. And what that does is it filters all of these rows based off the current user that's logged in. So, if I'm logged in as Gold Dex, I would see this row. If I'm logged in as Your Job, I would see this row. So on and so forth.
And so now, as I'm viewing as different people, I can see these different profiles. Now, the last thing I might want to do is display some of the additional information we had on our clients. Since this is the client's view, we don't necessarily want them to see that they are a small client. And maybe we don't even want them to see that their industry is computers. We'll consider those like internal reference points when we're searching through our clients and doing reporting and stuff like that. But maybe we do want them to be able to update and edit their description.
So, we'll get to updating this information in a later video, but for this one, let's go ahead and add in that description. And I'll do that by adding in a text component. And then I'll go ahead and put this right below the title there. And then, right now, this is just displaying this as a text, which is whatever we type over here gets added there. What we want to do is dynamically populate this from the data that's on the screen. And so, we'll click the three buttons there, click on description, and then now, this displays their description there.
So, that ends the first part of creating your own client portal. You have imported all of your clients, and now you've given them a way for whenever they log in, they can see their profile. In the next video, we'll get into adding in the things that you're actually delivering to your clients.
