In this lesson, we customize our membership pages and set up permissions based on Editor X paid subscriptions.
It has been the best investment I made in my design journey so far. I would consider myself a novice but I honestly feel like I've gained a genuine professional insight into the process of creating a high-level website.
I'm an early adopter of the KreativePro Masterclass, and I love how well put together it is. Neftali takes you through each step of the process from paper sketches to marketing all with fun visuals & clear instructions!
When I first tried editor X, the thing that stood out for me was the integrated memberships. Almost no other tool had this fully baked in. I mean, I get it making it advanced membership system is not easy, but relying on third party apps to handle members. Is, and always will be risky, especially if we need to collect payments today, more than ever businesses rely on e-commerce to sell services and goods, but depending on where you live, it can be very difficult to process online payments.
Thanks to editor X, you can process payments. Where are you run your business from? We can create rules, set permissions, and even manage a community of paid members. So why don't we dive in and do this with our movie streaming service? So the first thing we want to do guys is head over to our app panel and under members we want to add to site, this will install everything that we need to run a membership system in our website.
You can also find additional apps in the app market, a huge library of different apps that you can start using. For now let's focus on these popular apps that we have in our app manager. You have the booking and online store log and members area. We're going to look at pricing plan and just a little bit, once you can install the members area app, you'll notice there's like a log-in bar widget.
We'll want to move that over to our signup in the settings or the floating menu. You have show profile, pic members name. You also have log-in bar layout, which let's do this side. What side? One? This arrow to be. Mm,
you can also change the style and the colors. So I went ahead already and changed the color to match our theme, the font size as well. Make sure you choose the right side. And you'll see that you have both states for hoever and selected and even for the dropdown, what colors do you want to set from the dropdown?
honestly that if we go back to the settings, when you click any of these fields, the design. So you have a preview of what that looks like. If you click members, sign up settings, you have specific permissions. So who can be a member and which options show first we want the members to sign up for. Do we want them to go log in?
We can decide if we want a login to enable a Google or Facebook. Single sign-on and finally, the policies we can toggle these on and set a page or a URL. Pretty simple one cool thing is that it does let you create your own custom signup page, but it's actually a Lightbox. So when you toggle this on to be asked to select one of the light boxes that you would need to create for now, you're not going to go into that.
Let me go ahead and quickly update this dropdown so that it has a nice dark background. And the colors that we have established in our site site styles. One thing you'll notice is that under the pages, when we installed the app, we get an account page here. You can style it or try to match your theme under the section.
So think about it like a little widget, right? You have a popup that has additional settings to change text. You can change the labels, appear or showing the buttons. You can also change the layout so you can change it if it's centered, aligned to the right. And even the space between every element for design.
The styles, input, buttons, backgrounds, colors, and additional settings. If you want to reveal more data, maybe collect their user's address. You can also have that in here. This works well. If you're building out a community and you know, you have that option. Another cool thing is that when you click on that app menu, you have additional widgets that you can start inserting into any page.
So, for example, if I add in this profile widget, it's going to land in here, I'm going to stack them together. So that they're one on top of the other. And all we really have to do is make sure we check the inspector panel to expand it a hundred percent right now, this is probably resetting. And so just by simply giving it a hundred percent.
There we go. And again, every which it behaves the same way each one has its own settings. For example, the layout in this case is the way that the avatar appears if we want to have following and followers of people. The style and design is pretty straightforward and you can have badges. This is really cool.
You can assign badges based on activity that the user might have, but we're not going to dive into that in this lesson. If we open up our app manager, you'll see, now that it's installed correctly and these little three dots, we can access the sign up settings. Also, what I want to do is adding members page.
And here you get these tabs members and custom pages. A profile is for public profile page for them to be maybe shared with others in the community. And then you have custom, unless you create a private or public for now. Let's just go ahead and create this profile page. You'll notice that you get additional widgets.
A horizontal menu that you can add as many links as you want. You also get this about widget, it just, just basically letting the user talk about themselves. Like a little biography, you have settings to change. What kind of content? Maybe change the labels on that. And of course the design styles. So it's pretty straightforward and you get a lot of.
If I open up incognito window, this is how it looks like you have a login button and if you're not logged in, it takes you to a signup page. This has already been built out for you. And basically when you go through it, and it's just a simple as adding an email, a password to sign up. So once somebody signs up, they get this confirmed notification to check their email, which is really good for security, of course, and making sure that there's no spammy users, but if we go back to our site members under the CRM tools, we'll see that that user is now in our data.
No, he hasn't confirmed his email yet, but we have additional details when he signed up where he's from, we have member status site member, or if it's blocked, we even have labels that we can consent later lessons. We're going to look at that through automations. We also have an option to communicate directly with this member through the inbox.
It's actually really powerful and very useful to have. All right. The next thing I want to do is install the Wix pricing plan. This will really help us skate the content for the movies and games. So only paint or subscribe members can access that. The first thing that happens, it grades a page called plans and pricing.
Again, this is a widget, so you have settings, so you can customize the colors, layouts to text, and I'm going to speed through this so that you can see the power that it has.
All right, this looks good. The next thing I want to show you how I created these plants. If we click under managed plans, we've got a little dashboard here that shows you analytics based on the plans that have been purchased, you can actually see the full report right below that you have the actual plants.
I created a bundle in a popular plant. The bundle you'll notice it has a main plan title. It has a tagline of it can change to what, wherever we want. We have lists of features that's included in this plan. We have the pricing and duration. So it's a one time fee and you also set some permission. But the permissions are set directly on the pages, not from here.
From here, you have additional options like allowing the plan cancellation. And if you have additional plan policies, you can add those in there for the popular one. This is the normal 9 99 monthly. You even have the option to add a free seven day trial. If we go back to our account pages, we'll see that we have an additional page called subscription or subscriptions.
And again, subscriptions, you can add that into the widget for the navigation or SOP navigation. I think this is great that you have the ability to control all these pages and change them whenever you need. Generally speaking, creating a subscription is pretty tedious. I haven't encountered any app that allows it to do this in a simple way until I started playing with editor X.
If you want to run like a private community, where you have your members, you can install the app called spaces. This will help you manage your entire community directly from any device and the best part it's free. All right, guys, now that we have installed both apps, we can head over to our peaches and underpaid settings.
We can access the permissions. All right. So for example, this is the old movies and a select only paying customers from here. You get a couple of options. The ones that I'm interested in is the pricing plan. We want to toggle the ones that we created so popular and bundle. And that's it just be sure that you apply these settings to both the movie's title page and generous.
Then we can head over to an incognito window and try to access these pages to see if this works. One thing you want to do is change the URL of some of the pages. They provide, for example, the plants and pricings, we go to the page settings. We'll want to change it to something simple, like sign up. There we go.
This looks great. And this, this, this simple. Now when we clicked the button, we can see here, it takes us to the checkout process that will open up the login or sign up pop-up for new users. If you're running a store, a subscription service you'll want to have the wakes owner app installed on your device.
This will help you manage your site access payments, and just have a little bit more control over everything. That's. All right guys, this was pretty much it for this lesson. Let's go ahead and jump to the final module and get ready.
Access our premium community including bonus tutorials, project files & weekly resources.LIFETIME 💎 ACCESS