Build a Documentation / Help Center with Typedream CMS

Putri Karunia • 2022-08-26

Build a Documentation with nested articles with Notion + Typedream

Let’s talk about the “Documentations” part for now and the FAQ can follow the same way. We're going to follow how Notion's guide and Intercom's Help Center are structured.

Article Structure

Imagine having this article structure

Getting Started
1. Add & Edit Content
2. Hyperlink
3. Drag and Drop
4. Resizing Element
Building your website
1. Templates
2. Section Templates
3. Navbar & Buttons
Publishing your website
1. Light / Dark Mode
2. Custom Domain
3. SEO

You’ll need 2 Notion tables:

Guide Directories:

This is a list of guide directories that you want, like that home page of your intercom help center. In the example above we’ll have 3 rows: Getting Started, Building your website, Publishing your website

Have a column called "Directory" here, we'll use it as reference from the "Guide Articles" table.

Guide Articles:

This is a list of all the articles, like “Add & Edit Content”, “Build your Website”, etc.

Have a column called "Directory" here and indicate the directory where this article lives in.

Adding CMS in Typedream

In Typedream, you'll connect both collections using the CMS feature.

Connecting Guide Directories

Type /collection and go through the setup process, select 'Guide Directories' table to connect. You can select any template you like.

We want each item in our Guide Directories to look like this

It has a title and some description, then the list of articles in this directory at the bottom. To do this,

go to the "Guide Directories Items" in your side bar
click Settings
click "Customize Current Template" under Templates

After customizing the guide directories template page as you like, make sure you include the list of Articles at the bottom.

Connecting Guide Articles

Inside the template for the Guide Directories item, go to the bottom to add a collection of articles for that specific directory.

Type /collection and connect the "Guide Articles" table this time.

After selecting the template, click "Edit Collection" on the right toolbar and set up the Filter:

Set it to View All under Max Number of Items,
Add a filter where Directory equals Current Item - Directory

That's it ⚡️

Try previewing one of the guide directory items and see how it looks. It should have a list of articles in that directory at the bottom.

Learn more about CMS →

See More Guides

Editing your items: add content to your collection items

Edit your collection items, add content, update columns, and publish! You’ll be able to edit your blog posts or products right in Typedream.

Get started with CMS from scratch

Start using CMS to build a blog from scratch. In this guide, we’ll explore how you can set up a new collection and edit the items inside

What is CMS?

Content Management System (CMS) is a feature that allows you to display data from a database, like Notion, Airtable, etc.

We're a remote software company, building online tools for creators, builders, and side hustlers. We quit our 9-5 to pursue our dreams, and we want to help others do the same.