Building a membership site with WordPress – a challenge or a piece of cake? A case study

March 13, 2015

A membership site is a site where some content is available only to members who have logged in. To gain access to this content, visitors usually have to pay to join as a member. Membership sites often include user-submitted content.

Thus, by definition, building a membership site doesn’t appear to be a trivial thing. Today, we aim to test this with Jacob McDaniel from &Pixel, the author of popupsters.com. This is the first membership site in our series of case studies that involve Toolset plugins.

About the project

popupsters.com
popupsters.com

www.popupsters.com

PopUpsters is a small startup in San Francisco, which focuses on connecting Vendors and Event Organizers. PopUpsters want Vendors and Event Organizers to come to their site, register, and create their profile. Vendors (such as food providers) can book space in events submitted by the Organizers. Organizers can search for the best Vendors to attend the event that they are hosting.

An e-commerce solution is needed to charge Vendors for booking various popups.

Project requirements

  • enabling registration with a specific role
  • adding and editing information via a front-end
  • access to certain data and activities for privileged users only (after logging in)
  • integration with e-commerce to access some paid services

About the author

Jacob McDaniel, the author of popupsters.com
Jacob McDaniel, the author of popupsters.com

Jacob McDaniel is a designer and web developer. He is also a self-confessed beer nerd.

Jacob (jacobmcdaniel.com) has been designing and building websites since 2008, and he has clients all over the world. His shop &Pixels (andpixels.com) is located in Kansas City. It is focused on exceptional user experiences and user interfaces built within WordPress. &Pixels can build everything from a new branding identity and a responsive website to full-fledged ecommerce and web/mobile applications.

Understand the business workflow first

Unlike typical brochure sites, membership sites are more dynamic.

When you starting work on projects, you first need to understand the basic business workflow that your site will support.

In practice, this means that you will need to:

  • identify different user roles;
  • define their capabilities by specifying who can do what and under what conditions.

In other words: which action follows which, who triggers it, and in what way.

The following is a simplified workflow from Jacob’s site for a user who has the role of a Vendor.

A workflow for Vendors
A workflow for Vendors

A simple scenario from the Vendor’s perspective.
A simple scenario from the Vendor’s perspective.

A simple scenario from the Vendor’s perspective.

A food Vendor visits the site, registers, logs in, and browses the event calendar. After finding an event, he/she wants to book space (such as having a food booth at the event), so he/she applies. If attending the event requires a fee, he/she will need to check out.

Using the basic workflows, you can design your basic structures and create designs or mock-ups. Finally, you decide the tools that you want to use in the implementation.

Why the Toolset was used

Jacob’s customer needed the so-called minimum viable product (MVP) solution for their startup. The aim is to build something quickly that works with the minimum investment. This product only has the core features that allow the product to be deployed.

CRED plugin logo
The CRED plugin

Types plugin logo
The Types plugin

Jacob was already familiar with the Toolset. &Pixels had used it in another project to build a search engine for finding beer based on a nearby map and list.

He recalls the availability of “lots of custom post types and forms on the front-end,” so he already knew the power of Types and that CRED performs well in front-end forms.

The Access plugin
The Access plugin

The Views plugin
The Views plugin

www.popupsters.com aimed to be a membership site so the Access plugin appeared to be a perfect solution for restricting access depending on the user’s role.

The Views plugin also integrates well with the WooCommerce solutions that Jacob planned to use.

What other plugins were used?

Jacob’s site is a fairly complex and challenging membership site, which includes the management of events and e-commerce. The Events Calendar plugin was used to handle events in a calendar form. Jacob is a fan of WooCommerce solutions so you can see some other plugins from the famous WooCommerce family in his tool kit.

The following is the full set of plugins used to handle e-commerce, roles, membership, and events.

Purpose Plugin used
Handling events Events Calendar, Events Calendar Pro, and

Events Calendar Tickets

Registering and login forms Formidable Pro
Additional custom types and fields Types (Toolset component)
Displaying custom contents in different pages Views (Toolset component)
Creating and editing Vendors information via the front-end. Event registration from the front-end. CRED (Toolset component)
Controlling access to specific pages based on roles Access (Toolset component) – to define custom roles.

Nav Menu Roles (free WP plugin) – to hide some menu items based on user roles.

Handling payments for paid access WooCommerce plugin and its extensions:

WooCommerce Bookings – to support the sale of date-based bookings (for example, a booth for a food Vendor at an event)

WooCommerce Freshbooks – to facilitate the invoicing of customers using FreshBooks

Building a membership site – plugins in action

popupsters.com is a membership site so you can’t see much when browsing it as a regular visitor.

In the following, we share some screenshots to show how the different plugins were combined to transform a WordPress site into a membership site.

Custom forms for registration and login

What is offered by WordPress?

How to enable Membership in WordPress Settings
How to enable Membership in WordPress Settings

To become a site member, a user must first register. WordPress supports user registrations via the front-end but you first need to enable the membership option (as shown above).

WordPress default registaration form
WordPress default registaration form

WordPress default login form
WordPress default login form

The standard WordPress forms for login and registration are rarely used by professional membership sites. You will need the forms to look like part of your site and custom fields will often be needed.

How the registration and login forms were implemented at popupsters.com

The following are the login and registration forms used by PopUpsters:

login and registration forms used by PopUpsters:
Login and registration forms used by PopUpsters:

Login forms used by PopUpsters
Login forms used by PopUpsters

Registration forms used by PopUpsters
Registration forms used by PopUpsters

The forms are an integral part of the site and they are accessible from the top navigation line as regular pages.

Jacob used the Formidable Pro plugin to create custom login and registration forms. Next, he created two dedicated pages (shown above) for registration and logging in, where he embedded the forms using relevant shortcodes.

Types and Views

Types allow the definition of custom post types and their extension with additional custom fields. A few taxonomies are also defined to categorize custom posts. Some examples are shown below.

Custom Post Types and Taxonomies of popupsters.com
Custom Post Types and Taxonomies of popupsters.com

Over 20 Views were used in Jacob’s site. Some of the pages combine elements from other plugins, such as CRED or WooCommerce.

Views of popupsters.com
Views of popupsters.com

CRED

Jacob used CRED to quickly create a working prototype for creating Vendors profiles, which looked like the following.

Front-end form for creating a Vendor Profile, which was created with the CRED plugin
Front-end form for creating a Vendor Profile, which was created with the CRED plugin

How the CRED plugin was used to quickly create various front-end forms
How the CRED plugin was used to quickly create various front-end forms

Access

The Access plugin is an essential part of the popupsters.com site.

Access was used:

  • to create different User Roles (see the first screenshot below),
  • managing pages by roles (see the next screenshots below).

Some custom roles defined with the Access plugin, e.g., Artisan, Space, Venue, Vendor, Event Organizer
Some custom roles defined with the Access plugin, e.g., Artisan, Space, Venue, Vendor, Event Organizer

Pages managed by Access roles
Pages managed by Access roles

An interesting feature when using Access is combining it with the Nav Menu Roles plugin. This plugin allows you to control what your users can see during navigation according to their roles. Thus, you can hide some items from your menu and make them visible only to users with specific roles.

Controlling access to menu items based on roles using the <a href=
Controlling access to menu items based on roles using the Nav Menu Roles plugin combined with the roles defined via the Access plugin.

For example, the image above shows a menu displayed on a Vendor’s Landing Page. You can see that there is an additional item, Partners and Clients, which is normally invisible when you look at the main navigation page on popupsters.com.

Handling e-commerce

WooCommerce Booking Extension - watch the video
WooCommerce Booking Extension – watch the video

Attending some events requires that Vendors pay a fee. Jacob used the WooCommerce Booking plugin, a WooCommerce extension that supports a new product type, as a bookable product for date-based bookings.

You can define the days when your service is available. People then request your appointments and you can approve the request.

toolset tip

If you want to see more details of how the WooCommerce Booking extension works, please refer to this post. You will find another video, which has been recorded by another of the plugin’s happy users.

Example

Settings for a Bookable product (wooCommerce Booking plugin)
Settings for a Bookable product (WooCommerce Booking plugin)

Jacob defined a new WooCommerce bookable product for each chargeable event and set the schedule for when the event is available to attend.

One of these products is Hatch today lunch popups. If you are a food Vendor, you can apply to be a lunch provider in a coworking space in San Francisco.

Next, we can see how booking a space for an event looks from the perspective of a visitor to the site (a Vendor in this case).

Step Description Screenshot
Step 1 Search the event calendar. Search the event calendar
Step 2 Pick an event that you want to join as a Vendor.

Pick an event that you want to join as a Vendor.
Pick an event that you want to join as a Vendor.
Step 3 Book to apply for the event (you must be logged in to book an event)

Book to apply for the event (you must be logged in to book an event)
Book to apply for the event (you must be logged in to book an event)
Step 4 Proceed with checkout (you’ll see the event as a bookable product in your cart)

Proceed with checkout (you’ll see the event as a bookable product in your cart)
Proceed with checkout (you’ll see the event as a bookable product in your cart)

Thus, the WooComerce bookings extension allows you to create a Bookable Product. However, the Vendors are actually booking (from their perspective) a space at an event (which is defined as a Custom Post Type called Event).

A single Event page (popupsters.com) with a form that allows the Vendor to Book space at the event
A single Event page (popupsters.com) with a form that allows the Vendor to Book space at the event

The Vendor enters an Event single page, such as that in the screenshot shown below, and they can view a form to submit.

The question is: how did Jacob and his team connect a WooCommerce product with a single Event? In other words, how did they make a Bookable Product form appear on the single Event page?

The answer is that they simply used a shortcode for the Bookable Product placed in the Event page created from the Modern Tribe WooCommerce Tickets plugin.

Again, we can see the power of using shortcodes. They allow you to combine information derived from different plugins.

Summing up

Finally, in this case study, we introduced popupsters.com, a real membership site based on WordPress. It might appear to be fairly complex, but not necessarily, and certainly not for Jacob. Here is how Jacob answered the question posed in the title.

Jacob McDaniel, the author of popupsters.com

Building a membership site is a piece of cake in its simplest form, provided that you know what you want to build initially. However, it can be a HUGE challenge if you are building something similar to what we produced with multiple user types, various forms to complete, and profile creation, as well as connecting an ecommerce solution to charge for various products or services.

Looking back, we could have planned to simplify everything now that we know a lot more about the customers and their feedback.

The following is Jacob’s concise guide to building a membership site:

  • Create custom users via Access.
  • Build all the registration and login forms with Formidable or GravityForms.
  • Build all of the CPT with Types.
  • Build all of the pages and layouts with Views.
  • Use CRED on the admin side to create all of the admin forms, and for all of the user-facing forms on the front-end, if needed.
  • Use WooCommerce for anything related to processing transactions with a shopping cart.
  • Use a custom theme from scratch, assuming that you have produced the complete design or used a theme that is already built and has significant capabilities. For PopUpsters, we used a WooTheme. This will change in the near future with updates.

We hope that we have inspired you by describing Jacob’s case study so building a membership site with WordPress will also be a piece of cake for you.

If you have already built a membership site with Toolset, please let us know. We will contact you regarding a future case study.

 

Comments 33 Responses

  1. Excellent article. Thanks for sharing. Membership is great in WordPress but extending substantially in BuddyPress. I didn’t see any mention of that so I’d be curious to hear from Jacob if BuddyPress was explored for additional functionality and if so why it was not added in the end.

    Thanks,
    Ben

    • Hey Ben, we looked at BuddyPress initially, but when it came down to it, BuddyPress had way too much going on to use in this site. It would have been overkill.

  2. Awesome!! This helps me better understand how Access and CRED can be used in a site. Any chances a membership site style demo will be added to the Demo Learning section?

    • Hi Sasha-Shae,
      we are currently working on a new series of demo sites. We started from the Classsifeds site which was built with the Layouts plugin and is already available online and we will publish an e-commerce site soon. Membership site is the most challenging so it be added later, once we are done with the most common ones.

      • Thanks for the reply Agnes! I look forward to all the new demos coming. I loved the new Classifieds demo, it was really helpful for me – so I am really looking forward to seeing new ecommerce demos and then the membership site style demo.

        Shae

  3. Awesome, did something very similar recently with membership and user profiles. One glaring omission from the Toolset is User registration. Its a shame that the dev had to use Formidable Pro just to get that feature. Its a no-brainer for CRED. On my project, I used CRED for this and a custom function that hooked into the WP user API.

    User profile creating has been mentioned many times in the forums and something that ‘is being worked on’ for quite a while.

    Now that my rant is ended, great job with the site!

    • Hi Armonado,
      glad to hear that you did something similar. Would you like to share your case with other people in a case study? If so, I would be happy to contact you (but currently there are 4-5 other people waiting in the queue). Yes, you are right: we do miss this piece in our CRED form and there are plans to bridge the gap.

      • Armando, we tested CRED a lot before switching to Formidable Pro. It was just much easier to build and connect the dots with a Formidable form than to go through with CRED.

        We have used CRED on other sites and it does work very well.

      • Hi, I did look into Formidable Pro and it seems like a solid plugin. Im glad you got it to work. The site we built is for a Union for the TV and Film Industry, this one specifically for the Animators Union. I used Toolset for a good portion of the site as well as ACF for things that are missing from toolset or toolset just doesn’t handle well.

        The URL is: http://animationguild.org

        Ironically, today I am doing a talk at a Los Angeles WordPress group on how we built the site and I am going to be talking about Toolset. We got invited over after a quick show and tell early this year and they wanted us to come by and do a more extensive talk.

        I really like Toolset and wish the shortcomings would one day be addressed.

        Thank you!

        • I should mention that Toolset came into play primary for the members section of the site. Its a online member directory so studios can reach out to members directly to hire.

          http://animationguild.org/member-search/

          The initial form and functionality is bare on purpose, select ‘available’ and dig in from there.

  4. Hello Jacob

    How about protecting content.

    If you have a site with thousands of posts, how can you leave the 1st paragraph or 2 public and the rest for members?

    Some plugins like S2 members redirect so you miss out on the indexing of the URL’s which means you lose all your traffic if you start a membership site!

    • Hi Brad,

      There are plugins that do this really well such as Paid Memberships Pro (http://www.paidmembershipspro.com/) and others that you pretty much drop in a shortcode and it does all the work for you.

      We didn’t need this capability. You also have to think about what you want to be SEO driven or not. Most membership content won’t be SEO driven because it is private, thus SEO doesn’t matter for that usage.

  5. Hi Jacob,

    I am so excited about this post as it could not have come at a more timely point for me. I am in the process of building a membership type site where sponsors can pay to be a sponsor (gold, silver, etc) and then they can submit events for a week long beer festival. The events will need to be reviewed and approved and available for updating by the sponsor and admins. I was getting a little discouraged and your post shed some crucial light on making it all work together.

    With the tools you outlined, do you think it would be possible to have a sponsor register, then purchase a level of sponsorship (with WooCommerce) and then be able to enter events to be shown on the website? they would also need to be able to update and add more events as time goes on.

    Any recommendations or guidance would be greatly appreciated.

    • Hi Kristin,

      Technically, yes you could. Not sure that the Toolset is essential to this, it would require a bit more customization than you would need.

      You could also use WooCommerces’ Subscription plugin (http://www.woothemes.com/products/woocommerce-subscriptions/), create the various subscription levels, they register and pay.

      Then you would want to probably use BuddyPress (https://buddypress.org/) to have the content and users managed.

      A secondary solution would be to use WooCommerce Subscriptions tied to Community Events by Modern Tribe (https://theeventscalendar.com/product/wordpress-community-events/); these guys have built some really great events plugins. This plugin in particular will allow you to have community events where other users post events.

      I’d love to learn more about your project as I am the co-founder of Pourmeabeer.com a data related startup.

      Cheers!

  6. This is super helpful, thanks for sharing your tools and process! I’m revamping our membership site right now and have been overwhelmed by all the possible solutions and plugins – I just started using Toolset a few weeks ago and these examples are really relevant for us.

    Question for you: what made you decide to use a CPT for user profiles instead of WP’s built-in profiles?

    • Hi Alyse,

      Great question. Simply, the basic profile capability of WordPress only had about 10% of what we needed for the particular account types that we were creating. Thus we created the custom fields for the various post types.

  7. A nice overview, and thanks to the author. Unfortunately there is no documentation or tutorials available on the Toolset website that providing the instructions I need to setup the elements in Toolset, and despite submitting several support requests for over two weeks, no-one in the company seems able to tell me how I can create a simple membership website like this, with a single, updateable profile for each member.

    If you could provide some information on how you set up the custom types, CRED forms etc. that’d be really helpful, because it seems no-one in the company knows how to do this.

    • Hi Mikes-12,
      You are right and we are not hiding that Toolset is not fully ready to handle membership sites. This is also why we are not mentioning the membership site here
      https://toolset.com/how-to/

      We are going to extend our CRED plugin to support custom user registrations and when this is ready, we will create a demo site and release an accompanying tutorial.

      • So why have you posted this article, telling me that ‘Building a membership site is a piece of cake’ if it can’t actually be done?

        I’ve just spent three weeks trying to create a membership site using Toolset, similar to the blog post only to find that it can’t be done.

        I would suggest that you take this post down until Toolset is ready to actually do the job, and not waste anyone else’s time on this.

        • Hi Mikes-12,
          thanks for your feedback. Where exactly did you fail or get stuck? Did you try our support forum?

          You said: “Telling me that ‘Building a membership site is a piece of cake’” I’m sorry you understood it this way. There was a question mark in the title and Jacob explained (see the last section) that this can be a huge challenge if you are trying to build something similar to what they built.

          Toolset can help you to build a membership site and in this case study we explained where some help of additional plugins might be needed.

          This article is a case study not a tutorial.

          • Yes, I missed the question mark, I foolishly didn’t think you’d put something up that came to the conclusion it couldn’t be done easily with your software. I think you at least need to change the title to alert potential customers that building a membership site using your Toolset is NOT an easy thing to do, or maybe not even possible. Very misleading.

            I’ve spend the last three weeks on your support forum, during which time several members of staff appeared to have given up trying to solve the problems I have, and appeared to have drifted off to find easier queries to answer. I’m now being helped by another customer who’s also been through the mill trying to get this to work.

            After going through the same issues setting up a directory website a year ago, and finding that a lot of the suggested functionality, or documentation didn’t exist at that point I seem to have made the same mistake in using your software again.
            No documentation, lousy support and misleading promotional articles. This has been a serious waste of my time. Amazingly I’ve found a $20 plugin that does the whole job automatically.

            What use is your software? Because I’m struggling to find anything but the basics that it can cope with.

            • Mikes-12, I’m sorry again. It wasn’t my intention to mislead you with the title. Please note that I used the word “challenge” in the title too. Then I put these words in the intro “Thus, by definition, building a membership site doesn’t appear to be a trivial thing.” and then “Today, we aim to test this with” to make it clear from the very beginning that a membership site might be a challenge as well.

              I reached your support thread and I’m glad that another customer could help you with some custom code and other hints. I also saw that our supporter was doing his best to help you.

              We are also learning on our mistakes. You are mentioning struggling with a classifieds site a year ago. This is why our new version of the directory site is much easier and far less complex.

              Let’s turn this discussion into a constructive one.

              You say “No documentation,” – What exactly are we missing in terms of online docs?

              “lousy support” – what kind of help would you expect?

              “misleading promotional articles” – the purpose of case studies it to show real life examples. We don’t pay the customers to take part in case studies, they are all volunteers ready to share their knowledge. They applied using this form
              https://toolset.com/home/contact-us/case-study-contact-form/

              I think that we will learn a lot on your example too. I will try to share with our supporters that next time we should ‘send’ a clear message to our customers that building a membership site is not a trivial thing and we are still improving our CRED plugin to support it.

              Thank you and sorry that we have disappointed you.

  8. You say “No documentation,?? – What exactly are we missing in terms of online docs?

    There is nothing in your documentation/case studies/tutorials relating to setting up a membership type site with profile pages. Considering creation of this type of site is probably going to be a popular reasons for people to buy your plugins, this is a serious omission. The fact that you’re showcasing building a membership site in your blog just highlights the fact that this is a blind spot for your product.

    “lousy support?? – what kind of help would you expect?

    The support member who answered my first post didn’t provide me with the detail I needed to fix the issues I was having. Though nice enough, he eventually gave up and after promising to pass it on to his seniors, disappeared for 5 days. With the second thread I started, the support member took three attempts to provide the correct code, but still only answered one out of the three queries I had relating to the same form.

    Eventually a customer stepped in and helped me out with both threads, as she seems to have more knowledge on your products that your support staff do. She has also been trying to create the same type of site so has already been through the issues I’ve been facing.

    I would expect your support staff to provide the correct answer the first time around, and to know more, or at least as much, as your customers on using your product.

    “misleading promotional articles?? – the purpose of case studies it to show real life examples.

    As an overview it was brilliant – and the statement “Building a membership site is a piece of cake in its simplest form, provided that you know what you want to build initially.” encouraged me to use Toolset for my project. It’s not a complicated site – a simple membership site with a single profile page for each member. About as basic as a membership site can be, and I used Gravity Forms for registration (as Toolset doesn’t support this), and the nav plugin the author recommended.

    The problem I have is that you should have prepared support tutorials for customers who would naturally be attracted by the article, and wanted to create the same type of site themselves. You didn’t, and instead I’ve had three painful weeks of dealing with patchy support.

    As I said I had a similar experience with your Classifieds site – I used the demo as the base for a listings website project but once I’d got started realised there was a lot of missing functionality, which had to be created from scratch during a long, and painful period via your support. And again the documentation had big holes in it. Great you’ve improved it, but not a great deal of use to me now. No doubt in a years time you’ll have a membership system and tutorials in place, again, not much of a comfort to me now.

    Please don’t showcase projects on your website that:

    a. You don’t have full tutorials and documentation for.
    b. Your system doesn’t support.

    Otherwise you’re just wasting people’s time.

    I’ve almost got my site working now, but this has taken at least 5 times longer than it should have.

    • Thank you very much for your detailed feedback. It helps a lot. There have been some steps taken to get improved here. There are some changes planned in our CRED plugin to add all missing features. Then we will build a demo/ref site and also post some tuts showing how to replicate the steps to build a membership site without pain.

      • Yep, but not a great deal of help to me now, after three weeks of trying unsuccessfully to extract support to get it working. And it’ll probably mean I’ll have to build the site again from scratch when you change update your plugins.

        I think my suggestion is valid – don’t feature case studies if your product doesn’t include the functionality required, or your support don’t know how to create workarounds. There’s a whole bunch of people replying in the above threads who are in for a big shock when they start hitting the issues I faced.

  9. Thank you for this case study. Nice to see a company show a real life situation where they show what their software can and can’t. Seems pretty transparent to me and builds my trust in using your amazing tools. Also, it shows that the membership feature is on the minds of the people at WP-Types. I know it is a feature the community is looking forward to and it looks like with the upcoming CRED release it may be possible. Looking forward to that release as I have several sites I could test the feature on. May just jump in and do it with the Beta release for the fun of it.

  10. Hi Jacob/Agnes,

    Thank you for the article. It is invaluable to read (in detail) how other people achieve the look and functionality that they do. I greatly appreciate the time you both spent putting this case study together.

    I am lucky that I invested in Formidable Pro a couple of years ago and find it a much under-rated product. They are constantly developing and refining it, so its great to see it mentioned here.

    1 question i have (if you have time to answer) is this. With regards using Formidable Pro for membership registration. I gather you could use the Paypal plugin and accept a payment for the membership, but what about membership expiry and renewal? I’m gathering you’d probably opt for a woocommerce membership plugin, but they aren’t cheap and have a hefty annual renewal fee.

    so I’m interested in your thoughts in this area.

    All the best,

    John.

    • Hi John,

      Great question!

      We were not using memberships on a renewal basis but you could absolutely do that with PayPal and WooCommerce with their Subscriptions plugin. There are alternatives but I’d advise using WooCommerce’s version as it is super simple and very seamless.

      On a side note, we very rarely use PayPal for anything just because of the monthly fees tied to a full service on your site. We use Stripe.com or Authorize.net as they have much simpler integrations.

      Hope that helps.

      Cheers,
      Jacob

  11. Hi Jacob,
    what are your thoughts an Formidable Pro vs. GravityForms?
    Any particular reason to choose Formidable Pro over GravityForms for this project – or in general?

    • You mean to add content via front-end forms? Yes, this is where you can use our CRED plugin.

    • No I mean to drip content overtime, this is a very usual option for a membership site. Sometimes you don’t want to reveal all of your content at once but gradually overtime.

      • ok, now I get it. No, there is no such special/dedicated feature available in Toolset.