You’ve built out a WordPress website – maybe it’s a WooCommerce store, Learndash course website or simply a service-based business. But you’re busier than ever – and now the website is just *another* aspect of your business you need to manage, with constant emails from users and time-consuming content management updates.
If this sounds like you, you might need a WordPress Customer Portal (or Custom WordPress Dashboard).
Often agencies will hand over a website that looks great – but doesn’t actually help you run your business. At HotSource, we specialise in turning existing websites into tools that work *for* your business, saving you both time and money.
A Customer Portal is one way we do that.
What this guide will cover:
In this guide, we’ll cover what a Customer Portal (or Custom Dashboard) is, how it can be used, and how you can start to set one up yourself.
Note: We use Custom Dashboard and Customer Portal interchangeably in this article. While there is a small difference between the two, for the sake of this post we’ll treat them the same.
So what is a customer portal
If you’re running WooCommerce, you’ve likely already seen a basic version of a customer portal already. It’s the My Account section that customers see when they log in.
Or you probably have used one yourself, most service providers (internet provider, mobile phone, electricity) have a customer portal that you can log into.
In a nutshell, it gives your users/customers a way to manage their account information, perform tasks, submit documents on your website themselves (self-service) without having to manually email or call and ask you to do it for them.
1. A customer portal allows your users to update their personal details
At it’s most basic level, a Customer Portal will allow users to update their personal details. These include their name, email address, phone number and password.
According to American Express, 60% of U.S. customers say their main channel for simple customer support questions is a self-service utility
2. Your user can see updates in real-time
Imagine you’re a customer who purchased an order 3 days ago. You want to see the progress of the order, so you log into the website, find your order number and can instantly see the status and tracking information.
Or you may be a student who wants to see the progress on your current online courses.
All of this information should be made available to the user, in an easy-to-use interface. It seems like common sense, but it’s surprisingly ignored by a lot of website owners – and could result in the difference between a loyal user, and one that never returns.
3. Personalised Onboarding Process
It doesn’t matter if you’re running an e-commerce store, a membership website or a simple blog – your onboarding process will help create loyal fans, and encourage your users to return.
This could be as simple as a sign up form and a welcome screen, or it could require multiple steps including document submission (for an insurance company for example). The important thing is to make your onboarding process as easy as possible for the user, and make sure they know what the next steps are.
4. Streamlined Processes
Business processes often involve multiple steps and interactions. A customer portal can help streamline these processes.
Whether it’s onboarding new clients, handling inquiries, or managing projects, a portal can make everything smoother – and save you time.
Now that we’ve outlined some of the potential benefits of having a well-designed customer portal, in the next section we’ll cover how to get started and actually build one for your website.
How to plan your customer portal
Before you get started building our your customer portal, you’ll want to make sure you have a plan in place to keep things on track – and it will help you build out a product brief if you decide to hire someone to build it for you.
1. Define Your Portal’s Purpose
Start by answering a crucial question:
What do you want your customer portal to achieve?
Are you aiming to provide easy access to documents, offer customer support, or streamline order processes? Knowing your portal’s purpose is the first step.
2. What roles (or types of users) will be using your portal?
What users will be using your portal? Customers? Internal Staff?
Your portal may support more than one type of user, but you’ll want to ensure you define these up front. These roles/user types will drive the logic behind what is shown on the portal, and what features you provide.
3. What features do you want to support?
This one may take a bit of brainstorming. I’m sure you already have a rough idea of what you want to build, but take a sheet of paper and start writing.
Create headers for each user type, and then list all of the features that you want included in your portal.
Some ideas to help with your brainstorming:
- Update personal information
- View Order/Request History
- Submit documents
- View Status of current orders
- Statistics and Reporting
- Content Management (ie: ability to manage products)
- Order Processing
- Document Approval
Once you have a bulleted list, start adding more detail around why this is important and how you would imagine this to work within your portal.
You won’t always get it right first time, but you can refine things as you go
4. Cut 50% off your list
This is an important step. Take your list, and score each feature from 1-5 based on the importance to your business. How you measure importance is up to you, but by the end you should have a list of must-haves, should-haves and nice-to-haves.
Then cut 50% off your list.
One common thing we see with our clients is they start trying to build the perfect solution from the get go. This is a recipe for disaster – within 12 months time, you’ll probably be looking at a mess of a website, featuring a portal you no longer believe will solve your problems.
If you ended up hiring us to develop your portal, this will be one of the first questions we ask:
What can we remove?
By focusing on the most important items first, you can start slowly and add to your portal as your needs and requirements change (and they will) – and you’ll end up with a much better result in the long term.
Start small, grow and refine.
Remember, the key to a successful customer portal project is in the planning. Don’t bite off more than you can chew. Outline your goals and features but start small.
With a solid plan in place, you’ll be ready to move on to the technical aspects of setting up your customer portal in WordPress.
Prepare your staging environment
Rule #1 of development: Never test changes on a live environment
To begin, it’s important to make sure you have a staging environment set up. If you already know what a staging environment, feel free to skip this section. If not, continue reading.
What is a staging environment?
Put simply, a staging environment is a clone of your live website. It’s used to test out changes before deploying them live.
Often, development teams will have multiple environments set up – Development, QA, Staging, Production (Live) – but unless you have a complex development workflow, you can get away with one staging environment.
Your staging environment is what insulates your live website from the changes you’re making. The last thing you want is to make a change that breaks your entire website. We’re building a portal to make your job easier, not harder.
How to set up a staging environment?
These days, most hosting platforms come with staging functionality built in. Many of these will feature a one-click staging deployment process.
We’ve listed some hosts below with links to their staging articles:
SiteGround: https://world.siteground.com/tutorials/staging/
WP Engine: https://wpengine.com/resources/what-is-a-staging-site-why-have-one/
GoDaddy: https://nz.godaddy.com/help/create-a-staging-site-16466
Cloudways: https://www.cloudways.com/blog/wordpress-staging/
Kinsta: https://kinsta.com/blog/wordpress-staging-site/
BlueHost: https://www.bluehost.com/help/article/wordpress-how-to-create-a-staging-site
If you can’t find your web host in the list above, check their documentation or ask their support team. Alternatively, use our chat tool below to get in contact – we’ll point you in the right direction.
What to do if your host doesn’t support staging environments
If you’re running on a VPS or a host that doesn’t provide one-click staging, there are some plugins you could use. The one we’d recommend is WP Staging. You can find the plugin here: https://wp-staging.com/
Choosing the Right Plugins and Themes
Selecting the right plugins is crucial. With the number of plugins available for WordPress, and many of them overlapping in functionality, it can be difficult to decide which plugins to use.
In this section, we’ll provide some recommendations for plugins based on the ‘feature’ you’re looking to implement. Keep in mind that this list is not exhaustive, and your unique requirements could change our recommendations (if you were to get on a call with us). But we’ll list a few options anyway – just be sure to check your chosen plugin supports your required features.
1. User Log in and Registration
Getting your login and registration process ironed out is one of the first things you should implement. While you could use the default WordPress login, it can be a jarring experience for the end user – and there are a number of plugins that’ll improve this process.
Implementing your required features
Implementing your required features can be tricky. You have to balance the use of third-party plugins with custom code.
At this point, it’s probably worth consulting a developer to determine which plugins would be the best fit for your website.
Some of the top plugins we recommend are listed below
1. Adding Custom Fields and Post Types
If you need to add custom fields and/or post types to WordPress, ACF is the easiest way to do it without writing custom code.
Even developers who know how to write the code manually will often use Advanced Custom Fields, simply because it is an extremely powerful tool.
When to use a custom post type?
If you’re creating any approval process where a user submits information that needs to be captured as a “record”, a Custom Post Type is generally the recommended way to do this.
One thing to note: Custom Post Types are typically “public” within WordPress by default. You’ll want to make sure you turn off “Show on front-end” (under Advanced)
When to use custom fields?
You’ll typically want to use custom fields if you have existing post types (such as WooCommerce Products, LearnDash Courses, or simply your own custom post type), and you want to add custom data to these records.
How this data is captured and presented will depend on what you’re building, but generally you can create custom fields for anything from simple text entry to image/file uploads, and you can group these fields into groups and repeatable sections.
2. Capturing data with forms
Next we’ll look at capturing data from the user. This may be some kind of Order Request, or capturing feedback/survey responses – or simply a way for the user to update personal details.
All of these actions require some kind of form.
Gravity Forms is our top choice for anything form related. It’s very easy to use, and is designed to be extended. Of course you can use other form plugins, or even create your own form.
When designing your forms, be sure to capture all the information you need to process the request.
Building Workflows into your Customer Portal
Once you have a form set up, and any related custom post types created, you can move on to form processing and automation.
1. Processing Form Data
Most form plugins will provide the ability to set up “tasks” to be executed once a form has been submitted. In the case of a Service Order Request for example, you’ll want to use the form data to create a Service Order post (where Service Order was a custom post type you added earlier).
More often than not, these steps will require custom coding – but there are extensions for most popular form plugins that will perform the more common actions.
Of course, there’s always the option to process these manually – set it up to send an email and then manually enter the details into your system yourself. Obviously this is more work, and we want to automate as much as possible – but could be an option for an initial version if you have a tight budget and simply want to build a proof of concept.
2. Building Automations
A workflow could be as simple as “When an request is processed, we want to upload a file as a result and notify the client that it is available” – or it could be more complex, involving multiple staff members and approvals
The easiest way to do this is to grab a pen and paper and create a checklist of all the steps needed in your workflow, starting from the form submission.
After doing this for all of your workflows, you will have a list of actions and you’ll need to decide which of these steps should be automated, and which of them are manual processes.
We’d recommend using Zapier if you want to build out these automations yourself.
While there are other tools around that provide no/low-code automations, Zapier is one of the larger platforms and has a wide range of integrations across many different platforms and services.
Testing and Deployment
Now that your WordPress Customer Dashboard is set up, you’ll want to make sure it’s fully tested before deploying.
1. Run through testing yourself
Going through the checklists you created earlier, go through each step and test to ensure everything is fully working. Make sure you test error conditions and invalid scenarios as well.
Some things to pay attention to:
- Do all fields have correct validation and error messages?
- If you add invalid input into a field (ie: negative numbers, or wrong file type), does it show an error?
- Can the user successfully register and log in?
- Do user roles work as expected, hiding and showing the correct content?
- Can you bypass security by navigating directly to a URL in your browser?
- Do all notifications and processes execute as expected?
Remember, you’ll not only want to look for errors – but also make sure you are providing a great user experience to your users.
2. Early adopter testing
If you have a client or customer who is willing to test out the system, they can provide valuable feedback around the process and could identify areas that need improvement.
If you don’t have a client or customer, ask a friend or family member to test out the system.
Ask them to perform a few simple tasks, and ask for feedback. You’ll often be surprised at the results – people who don’t understand the processes (and how it was built) will often find certain seemingly simple tasks more difficult than you’d expect.
3. Go Live
Once you’ve spent some time testing, it’s time to Go Live.
How you’d do this will depend on your host – but most web hosts provide the ability to push changes from staging to production.
One thing to keep in mind is that any changes that were made to your live site in the meantime (including data changes, eg orders) could be lost – so be sure to back up your website first.
If your live website has changes you want to keep, you’ll need to deploy the changes manually. This can be a time-consuming process, but build out a list of all the changes you’ve made, then apply these one-by-one to your live website.
Final Thoughts
Congratulations on reaching the end of our guide on building a customer portal in WordPress. Hopefully you have gained some insights around creating a user-friendly client portal.
Creating a customer portal can be a complicated process requiring planning, technical setup, user authentication, content management, automations and custom code. While this guide aims to provide the knowledge and steps to undertake this journey on your own, we highly recommend getting professional help (whether or not you choose to work with us!).
Here are some reasons how professional assistance could help:
- Expertise: Professionals like HotSource have years of experience and expertise in developing custom solutions. They can ensure that your portal is built to the highest standards and do so in a way that future-proofs as much as possible to minimise the potential for errors in future WordPress update.
- Efficiency: Professionals can streamline the development process, potentially saving you time and effort.
- Customization: Custom coding is sometimes needed to closely match to your specific business needs.
- Security: Ensuring the security of user data and your portal as a whole is crucial. Professionals have the knowledge to implement strong security measures.
- Maintenance and Support: After your portal is live, you may require ongoing maintenance, updates, and support. Professionals can provide these services to keep your portal running smoothly.
If you’re have any questions, comments or suggestions on how we can improve this guide, please don’t hesitate to reach out to us at HotSource using either the chat tool below, or using the contact form. We’re here to support all WordPress business owners who want to automate their business processes, whether you’re a client or not.