Here’s an Ask SkyVerge question we’ve heard from lots of Memberships users: When a member logs in, how can I redirect them to a custom member home page instead of the WooCommerce account page?
This has been a popular request for some time, but wasn’t feasible for us to address since members can belong to multiple plans. How would Memberships know which page to send a user to when they belonged to multiple plans? It’d be a configuration nightmare!
However, once we added Gutenberg blocks that allow you to show or hide content based on member status, we realized merchants could harness the power of blocks to create a single home page that shows varied content based on the visitor’s membership plan(s). In this article, we’ll walk you through how to use member blocks to create a custom member home page.
- WordPress 5.2 +
- Memberships 1.16 +
We’ll start out with the fun part—designing your member home page!
You can use Member Content blocks to determine what members of each plan will see when they visit the page. The complexity of this step will vary based on the number of membership plans you support. For this example, I’m working with two plans, but the concept applies to membership sites of any size.
1. On your home page, add a Member Content block.
2. The content within this block will only be visible to members of the plans listed in the Memberships plans field on the Block menu. You can select as many plans as you want or leave this field blank to show this content to all plans. I’m going to create two separate member blocks, one for each of my plans.
You can adjust other settings, too, to determine when this content will be visible (with the Delay access settings) or create CSS classes for the block (under the Advanced settings). We’ll touch upon the Restricted content message settings in step two.
3. Add any content that you want to the block—you can even add other blocks! I’m using the member block to promote some member-only products.
4. Repeat steps 1-3 for as many plan-specific blocks you’d like to create.
Now that we’ve got our member content sorted out, it’s time to decide what happens when a non-member comes to this page.
We now need to decide what should happen when someone without access to a block comes to this page. There are a couple options for handling non-member access to this page.
First, you could restrict this page to your membership plans, so non-member access will be handled by your current Memberships restriction mode settings. Make sure that all plans grant access to this page, though, so the page is visible to all members! Members who aren’t authorized to visit this page won’t be redirected upon login.
Second, you could leave this page unrestricted and let the member blocks handle access. This is a great option if you want to tease member content to non-members to entice them to join your plans.
If you decide to go this route, you can use the Restricted content message field in the Blocks menu to decide what non-members will see in place of this block. You can make the block invisible to non-members (“No message”), use the default restriction message setup for Memberships, or create a custom message. This message will be visible instead of the block and its contents to anyone who isn’t a member of the plan(s) specified in step one—so members of other plans will see this, too.
You can also use a Non-member block to share a special message with folks who don’t belong to one or more membership plans. This is a great way to promote the perks of a membership while also protecting your special member content. I’m going to add a non-member block at the top of my page, to let non-members know what they are missing. I’m leaving the Membership plans field blank, so this block will only appear to folks who aren’t members of any plan on my site.
I highly recommend viewing your page as a non-member (an Incognito window works well) and as a member of each/all your site plans to ensure this page looks just right. The free User Switching plugin is a great way to quickly step into a particular member’s shoes to see what your site looks like from their perspective.
What’s great about these blocks is that they’re incredibly easy to use and no matter what type of member / non-member you are, the page always looks great—there are no awkward gaps or spaces!
Here’s what my page looks like as a non-member—as you can see, the non-member block is visible, as is the custom restriction message I set up for the first member block:
Here’s what my page looks like as a member of the Hogwarts Alumni Association plan. The non-member block is hidden, and I can now see the content in the Alumni member block:
Finally, here’s what my page looks like for members of both plans. I can see all the member blocks content:
Now that we’re happy with our page and how it appears for any user, we’ll complete one more step to make this our home page for members.
- Go to WooCommerce > Settings > Memberships.
- Find the Redirect members upon login setting and select the “Site page” option.
- Choose the page you created in step one from the Login redirect page menu.
- Click Save changes.
That’s it! You’re all setup to redirect members to your custom page upon login. We hope that creating custom home pages with Memberships blocks will make it easier to communicate with members, promote plan perks, and encourage non-members to join your plans!