The resource center is an always-on, contextual and personalized help widget.
It empowers your users to find help on their own, directly in your app.
Table of contents
- How the resource center works
- Creating a resource center
- Block types
- Conditionally visible blocks
- Global search
- Custom resource center launcher
How the resource center works
Once you have created and published your resource center, a subtle, but easy-to-find help icon button appears in the corner of the page.
When users click it, it expands to a list of customizable blocks, such as free-form messages, knowledge base search, list of flows, and custom actions:
Creating a resource center
Resource centers are created, managed and published just like other Userflow content such as flows and checklists:
- Go to Content.
- Click Create content.
- Select Resource Center.
- Give it a name and click the Create button.
You’ll now see the resource center builder:
The resource center consists of a list of blocks, which you can edit at will. It comes pre-populated with some example blocks.
Click a block to edit its settings (e.g. name or icon) in the right side panel that will appear. You can also delete a block there.
Click Add block in the bottom to add more blocks.
Click Preview to see a live preview of the resource center running inside your app.
When you’re ready, click Publish to let real users see your resource center.
You can optionally control when the resource center should appear under Only show resource center if. This is useful if it should not show up on certain pages, or if it should only show for certain users. You could even build multiple separate resource centers if you have different user types.
We support several block types, each with their own functionality.
We recommend always having a Checklist block in your resource center.
When the Checklist block is present, a user’s active checklist will automatically be embedded inside the resource center.
The checklist’s text and number of uncompleted tasks (if any) will also show in the resource center launcher:
If you don’t include a Checklist block in your resource center, the checklist will work stand-alone and be displayed next to your resource center by default:
List of flows/checklists block
The List of flows/checklists block enables your users to find and start flows and checklists on demand. When users click it, it’ll show a searchable list of flows:
If you click the block in the builder, you can edit its icon and name, and select which content items should be listed:
Note: Content items are by default not included in the resource center. You must add each individual item you want to list. This is to avoid exposing secret content inadvertently.
You can either let the list be sorted alphabetically, or switch from Sort alphabetically to Sort manually and drag and drop items to reorder.
You can optionally override items’ public names in the resource center. Go to an item’s builder, click Show advanced settings and look for Public name in resource center.
Knowledge base block
The Knowledge base block enables your users to search your existing knowledge base without leaving your app.
Clicking a search result will open the article in a new tab. There’s also a link button in the top, which takes the user to your knowledge base frontpage.
We currently support searching directly in the following knowledge base providers:
For all other knowledge base providers or home-built docs sites, you can use the default Google Search option. Anything that’s indexed by Google goes.
Choose your Knowledge base provider and Knowledge base URL in the builder’s side panel:
We recommend putting a Contact block at the bottom of your resource center. It’s a great way to let users know how to contact you.
When users click the Email or Phone icon, they’ll see a page with information with e.g. your email address:
When they click on the Chat icon, the resource center will close and your live-chat provider will be activated:
Click the Contact block in the resource center builder to customize which of the Email, Phone and Chat options should be displayed, edit the text to display, and choose your live-chat provider:
Action blocks are great for any kind of custom action you want users to be able to do in the resource center. It works kind of like a button in a flow. The block’s actions will be performed when a user clicks the block:
If you want to display a free-form message, such as an announcement or a greeting, in your resource center, then Message block is for you.
If you want to display a larger free-form message, such as a list of resources or an embedded video, in your resource center, then use a Sub-page block.
When the user clicks the block, the Sub-page content will be displayed in a nested route with a Back button.
Conditionally display a block
You can make a block only show up if a condition is true using the Only show block setting.
A good example is if you have an Action block that (re)starts a checklist, then it’s a good idea to only make it show up if the checklist is not already active:
Another example is to conditionally show help articles on certain pages:
If your resource center has at least 2 searchable blocks (currently, only Knowledge base and List of flows/checklists blocks are searchable), a global search icon will appear in the top:
Clicking it and searching will search across both flows in your Userflow account and articles in your knowledge base:
Under Settings → Theme you can customize the look of your resource center.
Use the Base colors section to quickly adjust the colors. Read more in our Themes guide.
Use the Resource center section to control which corner the resource center should appear in as well as its sizing and padding.
Custom resource center launcher
If you want to render your own custom resource center launcher, e.g. by adding a menu item in your own app, you can disable the default launcher, and programmatically control the resource center via Userflow.js.