Thanks again for giving MemberSpace a try - let's quickly go through an example setup so you can get a good sense of how to use MemberSpace. You'll then be able to easily set everything up on your own site and get your first paying member :)
Let's pretend you want to create a membership course teaching people how to be better photographers.
You'll have two membership plan tiers - Basic and Premium. You'll be charging $35/month for the Basic plan which grants access to PDFs and images. For the Premium plan you'll be charging $50/month which grants access to the same PDFs and images but also videos.
IMPORTANT: We don't recommend you literally implement the steps below on your MemberSpace account. This is purely an example to show you how to accomplish various setup tasks in MemberSpace.
Step 1 - Watch the videos
So first things first, after signing up for your free trial you should watch the three (short) initial videos. We tried really hard to make sure they give you a good basic overview of the core MemberSpace functionality. Here they are again:
Then scroll to the bottom of that page and click the "Ready To Start?" button:
Step 2 - Enter in your website
Now you should see this screen:
When entering in your "live website URL" make sure you enter in the entire address (i.e. https://www.yoursite.com). IMPORTANT: use https not http if you've enabled SSL on your Squarespace site.
Don't worry, this will have no effect on your current website since you haven't installed MemberSpace yet.
If you don't have a live website URL yet, just enter in your Squarespace URL instead. You can find your Squarespace URL by going to https://www.squarespace.com, clicking Log In, and after logging in copying the URL that appears at the top of your browser:
Make sure you also add this URL to the "Enter your Squarespace URL" section.
Step 3 - Add your protected page(s)
So let's create one protected page where all the member content lives (images, PDFs, and videos).
In our example scenario, we'll assume you've already created this page on your Squarespace site. Protected pages are created the same way any other page in your Squarespace site is created - the only difference is we restrict access to the page via MemberSpace.
Now click on Protect Pages in the top MemberSpace navigation, then click "Add Protected Page" on the left. Enter in the URL "/member-content" just like this:
By the way, if you don't know how to find your page's URL,
for a quick tutorial video.
Also keep in mind you can add as many protected pages as you want (there's no limit and no extra charge).
Protecting a page right now won't do anything since you haven't installed MemberSpace on your site. But after you install it, any protected pages you've added will automatically become inaccessible unless someone is on a membership plan that grants access to that page - see Step 5 below for more info about membership plans.
Step 4 - Add your protected content
Protected content is the only way to fully secure content on your site with MemberSpace. Think of protected pages as light security and protected content as strong security. Click here for more details about the difference.
In general, protected content is an optional step but in our example scenario we'll be using it.
Now click on Protect Content in the top MemberSpace navigation, then click on "Add Content Container" on the left.
A content container is simply a place to add various content (PDFs, images, documents, mp3s, videos). You can have as many content containers as you want and each container can have different access rights based on the membership plan a member is on.
We'll call this content container "Basic Plan Container" and click "Add new file" to add our three images and PDFs (one at a time) so it looks like this:
Then we'll scroll down and set up the rest of the container like this:
You can change the grid to output between one and six columns (the example above is three). You can add cover images for each piece of content and you can choose to show each content item's title and description (we choose to just show the title in the example above).
When members access the page the content will output for them automatically based on which Membership plan they are on (which we'll explain in Step 5 below).
The next step would be to create another content container and call it "Premium Plan Container". We'll click the "Existing Content" button to add in the three images and PDFs that we previously uploaded to the Basic Plan Container. We'll then click "Add new video" to add the three videos (one at a time) which only Premium Plan members will have access to. We'll set up the rest of the container the same as our first container.
After you create each content container you will be given a unique code snippet so you can easily add a specific container anywhere on your website. So now you would go to the "/member-content" page on your Squarespace site and add in a Squarespace Code block and paste in the two code snippets - one for each of the content containers your just created:
Any content you've added to the Basic Plan Container will automatically show up on the /member-content page in a grid-like format which looks like this:
Any content you've added to the Premium Plan Container will automatically show up on the /member-content page like this:
Step 5 - Setup your membership plan(s)
Membership plans are how you charge for access to your various protected pages and content. You can create as many as you want and each plan can have a different payment type (subscription, one time charge, or free). Each plan can grant access to whichever protected page(s) and content container(s) you choose.
For our example scenario, let's create two membership plans - one called Basic and one called Premium. Both will be subscriptions which means the charge recurs until the member cancels (or you cancel for them).
We use the payment gateway Stripe to process all credit cards so you'll need to have a Stripe account setup (it's free) to create a subscription or one time charge plan.
Now click on Setup Memberships in the top MemberSpace navigation, then click on "Add Membership Plan" on the left.
For the plan name we'll enter Basic Plan, set a price of $35 USD with an interval of 1 month (i.e. how often the charge will recur), and we won't have a free trial period. Your form should look like this so far:
For "Which Protected Page(s) can be accessed?" we'll check off "/member-content". For "Which Protected Content can be accessed?" we'll check off "Basic Plan Container" like this:
For the "After Sign Up - send members to this URL" field we'll enter in "https://www.yoursite.com/member-content" so new members can get right to the content. However, you could also create some kind of welcome page instead which thanks them for joining and explains some more logistics about their membership. On this welcome page you could have a link to your /member-content page. Remember, you would need to create this welcome page in your Squarespace site first.
For the "After Log In - send members to this URL" field we'll also enter in "https://www.yoursite.com/member-content" but alternatively you could link to a different page such as a member navigation page which has links to your protected page(s). Remember, you would need to create this member navigation page in your Squarespace site first.
showing how to do this.
Now repeat this process by adding a new Membership Plan and naming it "Premium Plan". The only difference from the Basic Plan setup will be setting the price at $50 and for the section "Which Protected Page(s) can be accessed?" selecting just "Premium Plan Container".
You'll notice after you create your two Membership Plans that they have unique Sign Up links. You can place a Sign Up link anywhere on your site (or in an email) in order to get people to sign up for that specific plan.
Step 6 - Install on your website
Ok you're almost there - this is the last step!
Click on Install in the top MemberSpace navigation. At the top of the page under "100% REQUIRED - Add Install Code" click the "Copy" button to copy the install code:
Now log into your Squarespace site, click Settings (on the left-side menu), click Advanced, click Code Injection, and then add the copied code to the HEADER section and click Save:
Now if you open and refresh your website (https://www.yoursite.com) you'll see a black Log In / Sign Up button in the bottom right - that's how you know you successfully installed MemberSpace and are ready to start accepting members :)
Some people prefer not to have that button in the bottom right. You can easily remove it by clicking Settings in the top MemberSpace navigation and then unchecking "Display the Log In / Sign Up button on your site" and then clicking "Save Your Settings" on the left.
If you disable the Log In / Sign Up button then you will need to add the optional Popup to your main navigation and/or onto one of your page(s) so your members have a way to log in / sign up and to view their account.
To add the optional Popup click on Install in the top MemberSpace navigation again and then scroll down to "OPTIONAL - Popup" and click the Copy button to copy the link code.
Now go to your Squarespace site and click Pages on the left and then click the + icon to the right of Main Navigation:
Then click Link:
Enter in any text you want for "Link Title" (e.g. "Member's Log In"). For the "Link" section paste in the code you copied previously for the Popup link and click Save. Now if someone clicks this new link in your navigation they will be able to log in or sign up for your membership plan(s). If they are already logged in, this link will automatically turn into a Your Account link so the member can change their email, view invoices, update their credit card, cancel their subscription, etc.
There is a lot more you can customize and configure in MemberSpace but we tried to make the initial setup simple and quick by default. We encourage you to explore the Settings section in the top MemberSpace navigation to customize MemberSpace further :)
If you have questions or need help with anything at all, our phone and email is at the bottom of your screen along with live chat (the blue bubble in the bottom right).