Build and Manage Your Website on HubSpot's Content Hub

There are lots of reasons businesses today need to know how to register users on a website. It can be an important avenue for generating growth and repeat customers, even for some types of small businesses. From start-up apps to ecommerce businesses or community-based sites, many platforms rely on the ability to provide secure accounts for their visitors.

For example, I worked with a local gym to improve the performance and organic search rankings of their website. One of the features I implemented was user registration and a membership area with features that had previously been managed at the front desk.

This massively improved the customer experience and freed up a lot of admin time for the team. It wasn't an overnight project, but the business gains made it well worth the time and effort.

Adding a user registration feature is often a major change to the structure and functionality of websites I work on. Fortunately, today's website-building software makes this possible with just a few clicks. In this article, I'll explain how to enable user accounts and profiles on six popular content management systems. Let's begin!

Table of Contents

• Why create a website with user accounts?
• How to Make a Website With User Accounts and Profiles
• How to Create a Login Page for My Website
• Test Your New User Accounts
• Things You'll Need to Make a Website with User Logins
• Alternative Ways to Register Users on Your Website

Why create a website with user accounts?

With a user account, a visitor creates a personalized profile on your website in order to tailor their experience with your web content. Accounts empower users to access exclusive offers, contribute to a community of fellow customers, reach out to customer support, and receive content recommendations relevant to them.

All of these benefits help you gain consumer trust and convert visitors into engaged leads. After all, they're called "user accounts," not "visitor accounts."

Many sites can gain from providing user accounts, regardless of the product or industry. If I'm working on a website that...

• Offers paid products and/or services for account holders
• Facilitates social or professional networking
• Facilitates e-commerce and stores users' payment information, orders, and/or carts
• Offers exclusive content for registered users
• Hosts public user-generated content, like blog posts, videos, or reviews
• Hosts private user-provided content, like cloud storage, notes, or e-journal entries
• Aims to build a community around users
• Allows reactions to content in the form of comments, ratings, and/or reviews
• Uses visitor-related information to tailor the browsing experience to individuals

... then I'll likely need to implement user accounts on that website.

But before I continue, consider whether it's best for your specific site to suggest or require accounts. An account should first and foremost enhance the user experience, so make sure the benefits to the customer are worth the time and effort of signing up. No one should feel "forced" to create an account when they don't need to.

This is the general process for making a website with user accounts and profiles, no matter what CMS or website builder you use. Below I'll take a closer look at the process for six of the most popular platforms.

If you haven't created a website yet, then you have a choice between two types of software.

For the simplest approach to making an account-based website, I recommend a website builder that specializes in membership sites. See our list of the best membership website builders and platforms for recommendations for this type of service.

If you've already built a website using a CMS, you can easily add user accounts, too. In most cases, the CMS handles the functionality of a membership site for you, either by itself or with an add-on or plugin. A user account tool should introduce features for registration, login, profile customization, and restricting content to only certain registrants.

Content Hub

Content Hub is HubSpot's content management system. Content Hub fully integrates with HubSpot CRM and HubSpot's marketing, sales, and service tools. With an Enterprise account, you can limit access to website pages, landing pages, and blog content by contact list. After restricting a page to selected lists, contacts on these lists will be notified via email to register.

To set up membership registration for a page in Content Hub, do the following.

1. First, I navigate to Marketing, then Website, then Website Pages or Landing Pages.
2. Then, I hover over the page that I want to restrict access to and click Edit.
3. In the Settings tab, I'll click Advanced Options.
4. Under "Control audience access for page," I select Private - Registration required, then choose the lists I want to register.
5. Finally, I click Update in the upper right-hand corner.

Image Source

For a full guide to managing user access on your HubSpot-powered website and blog, see our knowledge base article on membership registration with Content Hub.

WordPress

If I'm enabling user membership on a WordPress site, I generally need to use a plugin. There are many reputable options for WordPress website account management - here are some I recommend.

• Memberpress is an all-in-one WordPress plugin for building and managing membership sites. It includes tools for handling payment information, setting up user forums, and tracking performance. Memberpress has also built a reputation for its strong security and customer support.
• MemberSpace contains tools for membership websites and integrates with many website builders and CMS platforms, including WordPress. With MemberSpace, administrators allow access to specific website pages based on user actions like logging in or submitting a form.
• ARMember is a free plugin for creating a membership site on WordPress. For the (lack of) price, ARMember is a very comprehensive solution. It includes a form builder, content post scheduler, and tools for limiting page access by membership level. You can read our full review of ARMember for more info.
• Memberful is a lightweight solution for integrated checkout and account management on WordPress. Memberful emphasizes its ease of use, allowing users to set up their service quickly and securely. Memberful does not offer members-only pages. Instead, it sends exclusive content through emails and Discourse forums.

They might have similar names, but be sure to consider how each plugin fits your specific needs and budget. For more WordPress plugin recommendations and some excellent examples of membership sites built with WordPress, see our guide to creating a WordPress membership site.

Joomla

Here is how I activate user accounts on a Joomla site.

1. I start by navigating to the User Manager by clicking on the User icon on the left sidebar. Alternatively, in the top navigation bar, I could click Users > Manage.
2. In the upper-right-hand corner, I click the Options button.
3. Next to Allow User Registration, I choose Yes.
4. After allowing user registration, I'll add a login form somewhere on the site. I can link to the form as a page module and/or as a menu item.

Image Source

I can also toggle how to confirm membership through email confirmation or administrator approval. For more detailed instructions on enabling user registration with Joomla, see Joomla's user documentation.

Wix

Wix lets administrators activate user accounts with the Members Area feature, available with any Wix plan. With a Members Area set up on a Wix site, visitors can register and view exclusive content on member pages, and I can easily view and manage my site members.

Image Source

This tool is designed for easy setup and integrates with add-on applications for chat, blogging, events, e-commerce, and more. Learn how to set up a Members Area on Wix's support site.

If I wanted to restrict access to content without setting up a Members Area, I could set access to specific pages based on member roles or make pages exclusive to paid members only.

Drupal

Drupal lets me create roles for different visitors. These roles grant different permissions for viewing and creating website content. Drupal creates three roles by default:

• anonymous user, a visitor who has not logged in
• authenticated user, a visitor who is logged in
• administrator, someone with control over website functionality

In Drupal core, I can also add additional roles specific to whoever may come to your website and assign permissions to these roles. For example, when working on a blog site, I might have a "writer" role for visitors who have permission to create and publish content.

Here's how I configure who can create accounts on my Drupal site and customize the registration and cancellation processes:

1. I open the Manage menu, then select Configuration.
2. Then I select People, then Account Settings.
3. Next, I open the Registration and Cancellation panel to view my options.
4. I select Visitors under "Who can register accounts?"
5. Finally, I click on the checkbox that says Require email verification when a visitor creates an account.

Image Source

For more complex membership site functions, Drupal relies on third-party modules. I recommend selecting a well-maintained, reputable Drupal module like Membership, Drupal Commerce, and/or Rules for more hands-on control over your membership site. For guidance on installing these modules, see Drupal's instructions.

Shopify

Creating user registration via Shopify is very straightforward. Here's how I enable customer accounts in Shopify:

• I navigate to Settings, then Checkout.
• Under Customer Accounts, I choose to activate either optional or required accounts for customers.
• Then I click Save.

For more help editing customer account settings on your Shopify site, including how to change your site settings on a mobile device, see Shopify's help page.

How to Create a Login Page for My Website

Once I've set up user registration with a built-in feature or plugin, I need to create a registration form. This type of form will enable visitors to create a user account by filling out some basic information, like their name, email address, and a password.

Next, I'll need to create a login page where users can log in after they've registered. My general process is outlined below, but the exact steps will depend on what CMS or website builder I'm using.

1. Create a login form using a form builder.

Some website builders and content management systems have built-in form builders, while others require a plugin. Whatever tool I'm using, my primary goal when building a form is to provide a good user experience.

Some best practices to consider are accepting login alternatives like an email address or phone number, adding a clear "Forgot password?" link, and warning users when Caps Lock is on.

2. Create a login page.

Next, I need to create the page where I'll embed the login form. This will become my login page. A login page should be simple and consistent with branding guidelines.

3. Embed the login form on the login page.

Once I've created my login page, I embed the login form. This process is relatively simple on any CMS or website builder. For example, here's what the process looks like in Content Hub:

• In my HubSpot account, I navigate to my landing pages or website pages.
• I hover over the login page I just created and click Edit.
• In the page editor, I click the form module.
• On the Options tab in the left panel, I select Login Form from the Choose a form dropdown menu.

I can then customize the form's settings and the login page until I'm happy with its design and functionality.

The result should be as simple and sleek as Facebook's login page and form.

Test Your New User Accounts

Testing is the most important part of my process when it comes to user registration. After setting up user accounts on your website and creating a login page, be sure to test the user registration process on your site.

I always create a test account and have friends do the same to be as thorough as possible. Modify your test account profiles, modify their permissions, and check that exclusive content is actually set to exclusive.

If my website is already online, I generally set it to maintenance mode while testing these changes. Temporarily hiding your site prevents any complications from new signups in this phase.

Another option is to create a staging site where you can freely experiment with user accounts, while your live site stays untouched. During this testing phase, you'll want to check on the following:

Sign-Up Confirmation Email

Did you receive a confirmation email upon signing up? If not, you'll want to ensure you've set that up. Your CMS platform may provide an option to send a confirmation email. You can install a plugin or extension that gives you the option.

Password Change Workflow

Test the workflow a user would take when changing their password. If you don't receive a password change link in a timely manner, something may have gone amiss during activation. I always double-check the password change email to ensure it aligns with branding in both verbiage and design.

Member Area Design

A member area may be simple, or it may be more elaborate, depending on the nature of your website. Double-check that it looks right and that it offers all the options a user needs. If I'm working with an ecommerce brand, I always make sure there are options to view previous orders, change card information, and establish their shipping address.

Test for mobile-responsiveness as well. If buttons are cut off or users can't get to certain sections, you'll want to tinker with the design of the membership area.

Exclusive Offers

I've touched upon this briefly, but make sure all exclusive content is truly exclusive to your users. If you're planning to distribute exclusive PDFs and documents, mark them with robots.txt files or noindex, nofollow meta tags so that search engines don't crawl them, and unregistered users can't find them via a site search.

Privacy Policies and Terms of Use

As an owner of a website where people give you access to their contact and card information, you'll want to ensure you have a privacy policy that protects these users from abuse.

Even if you already have a privacy policy, you'll need to update it to reflect your new user section. To get started, use a privacy policy generator such as Termsfeed, Termly.io, or Shopify.

Pro tip: It's likely you will need a privacy policy page at some point in the user registration process, especially if you go with one of the alternative methods I cover later on. Lots of integrations and plugins require you to provide a URL to this page on your site. So, I highly recommend creating one at this point.

SSL Certificate

If you don't already have one, invest in an SSL certificate to ensure your website is as secure as possible. If you're not sure if you have one, use an SSL checker. This certificate changes your internet protocol from HTTP to HTTPS. In some browsers, there will be a padlock next to your URL, signifying that all the information users share with you will be kept private.

Things You'll Need to Make a Website with User Logins

Now that I've covered how to set up user accounts and profiles, how to create a login page, and how to test user accounts, let's recap what you'll need to make a website with user accounts and profiles:

• A CMS or website builder.
• A budget for user accounts and/or form plugins if needed.
• A theme that comes bundled or is compatible with a membership plugin if needed.
• A registration form and page.
• A login form and page.
• An edit profile form and page.
• Exclusive content offers.
• A privacy policy.
• An SSL certificate.

Alternative Ways to Register Users on Your Website

1. Code your own registration form.

If you have some coding knowledge, it's possible to code a registration form for your site all by yourself.

I like coding my own form when the code and styling needs are relatively simple, I'm not expecting a large volume of submissions, and I want a lot more flexibility than an out-of-the-box form creation tool can offer.

That being said, creating the form is one thing. Managing the process of sending the form data somewhere in a useful format is another. So, you might need the hand of an experienced developer to connect the custom form to a server and send the data to a database.

Here's how I go about building a custom form from scratch. First, I'll set up the HTML elements needed.

Next, I need to use CSS to put the design elements in place, like colors and spacing. You can add extra elements to customize the look of errors, hover effects on your "submit" button, and more.

Finally, I'll add some Javascript that will handle validation of form fields and submission of the data.

Here's what all this looks like together in one form:

See the Pen register users HTML by HubSpot (@hubspot) on CodePen.

This method gives me a ton of flexibility but is a little time-consuming.

If you're concerned about using your own code on a website and want to make sure everything is working as it should, check out this free website grader tool.

2. Use a Google Connector for single sign on (SSO).

Lots of websites let users sign in with Google. If a user already has a Google account, this saves them from having to create a whole user profile just for your website. Instead, they simply sign up and then sign in using an existing Gmail login. This is done through Google's OAuth API.

To do this, you'll need a Google Cloud Console account and use the Google+ API. Again, this method can be a little time consuming and tricky to configure, but I find it really easy to manage once the initial set-up is done.

First, I'll set up a project in Google Cloud Console for the website I'm working on. Next, I'll set up OAuth 2.0 credentials and integrate OAuth with my website, using those credentials. This is how a user will get redirected to their Google login screen and be asked to authenticate my app when signing up.

It's important to note here that Google will ask me to configure the consent screen and define the scope of my OAuth. It's all about keeping user data safe and secure, ensuring that both Google and the user understand the scope of access you'll need to a user's account. You can learn more about the different consent configurations and scopes in Google's OAuth 2.0 documentation.

Next, I'll get the Client ID and Client Secret (found on the credentials page when setting up OAuth). I'll typically use a plugin on my website to configure everything there to simplify the process, usually the Nextend Social Login and Register plugin if I'm using a WordPress site.

You'll need the Client ID and Client Secret from Cloud Console to configure the plugin. The benefit is that the plugin then handles all the backend processes of callbacks and authorization code exchange between my website and Google, which allows my site access to user data.

Regardless of which plugin you use, make sure you thoroughly test the sign up and login process once set-up is complete.

Pro tip: If you're having issues, make sure the redirect URL matches exactly between your OAuth plugin and your Cloud Console project. You'll find this in the "Credentials" section.

3. Integrate with social media logins.

Similar to Google OAuth is the ability to use single sign on (SSO) for website user registration through social media platforms. This means users can register on your website and sign in using their existing social media logins.

Facebook is the social media platform that I've most commonly used for this method, because it has such a wide user base. You might like to offer both Google and social media authenticator options depending on your audience.

The process is quite similar to setting up a Google API for registrations. First, I'll go to my developer account on the chosen social media platform. Setting this up is typically very easy. For example, to set up a Facebook developer account, you simply go to Meta for Developers and register using your existing login credentials.

Within the developer account for the platform, I'll usually have to follow some sort of process for adding my app/website. Then I need to select Facebook Login from the product list and proceed with OAuth set up. On Facebook, this is pretty straightforward and the set-up wizard takes me through it step by step. I have to add some information similar to setting up the Google OAuth (the type of app, its purpose, redirect URLs, etc.).

Again, I usually use the Nextend Social Login and Register plugin to complete the configuration on Wordpress and enable Facebook credential registration on my site. As always, I make sure to test the live registration process and troubleshoot any issues.

4. Use a third-party account registration tool.

For setting up registration on a single website, the previous methods are my go-to. But if you're building multiple apps and products, it gets super time-consuming and complicated to manage a separate authentication process for each one.

In those instances, a third-party tool with more robust functionality for user registration and authentication might be more suitable. Some good examples are Auth0, an identity management solution that helps you centralize your registration process, and Firebase, a similar solution from Google that is free for up to 10 registrations a day and up to 50k monthly active users.

An example of when you might need something like this is a large volume of user registrations, or having registrations set up across multiple platforms and/or domains.

Grow Your Website With User Profiles

I've had to do some convincing about user registration features when working with clients to improve or build their websites. But it doesn't need to be as complicated to set up and maintain as you might think. And it's always worthwhile seeing how much it can improve the user experience and business results.

Whether you're running an online store, building loyalty through a membership site, or providing a home for user content with a hosting service, user accounts empower your visitors to stay engaged with your premium content and features and help you keep track of your customer base as it continues to grow. No matter the CMS, you're covered.

Editor's note: This post was originally published in June 2020 and has been updated for comprehensiveness.

Topics:Website Development

Don't forget to share this post!