We rebuilt our website using our knowledge base software, and here's how we did it

I had been toying around with the idea for a while. We spend the majority of our time helping customers with their knowledge bases, and we couldn't seem to find the time or motivation to maintain our marketing site. While it started as one of those far-fetched ideas, it started becoming more and more plausible as we thought about it.

• We spend a lot of time helping customers build custom themes, and many of them look like websites. There was no reason our knowledge base couldn't look and feel like a normal website. 
• We are continuously adding features and support for SEO as many of our customers have public sites they want and need searchable on the web. Many of the features we'd need for our website were already feature requests. 
• We needed to work on our website but we'd prefer to work on our software. Using our software for our website means that time spent marketing is also time spent using, testing, and improving our own product.

We finally decided the pull the trigger and launched our new marketing website built in KnowledgeOwl at the beginning of the week. Here's how we did it.

Knowledge base as a website

Each knowledge base is basically its own website with its own URL, theme, and settings. We shortened our default link structure to create cleaner URLs, and we added a new root domain option to allow your content to be published on "/home" rather than "/help". Both options had already been feature requests, so that was an early win in the process.

We created a new knowledge base for the the website in the same account as our support documentation. Having them in the same account gave me the ability to share content between the kbs, which was useful for our Terms and Conditions, Privacy Policy, and Security and Reliability pages.

For example, if we need to make a change to our Terms and Conditions, we can update it in one kb and it will automatically update in the other. This way we can manage content across multiple sites and not worry about having different versions in different places.

Bare minimum mode theme

One of the newer theme options we've added this year was bare minimum mode. Bare minimum mode basically allows you to build your HTML, navigation, and styles from scratch; the only thing we load by default is the Bootstrap framework.

We used bare minimum mode to create our website theme since it made it much easier to break out of the layout and create a custom navigation bar at the top. It also meant we could build our own style sheet without having to override many defaults, just Bootstrap.

Articles as pages

We built each of our existing web pages (such as Pricing and Features) as top level articles. Articles already allowed for custom permalinks and title tags based on title, but we decided to add support for custom title tags and meta descriptions. Both were feature requests, so it killed the proverbial two birds with one stone.

Another really nice thing about using KnowledgeOwl for our web pages is the ability to use article versioning to work on updates. With versions, we can test out changes in preview and make the new versions visible to a restricted group without impacting the live page. We can also test out new versions of pages with the ability to revert to previous versions if the new versions aren't successful.

Blog style category

One of the most fun parts of converting our site to KnowledgeOwl was recreating the blog. To do this, we built a new blog style category type. The blog style category displays its articles in typical blog format (reverse chronological order) with the option to control the order in the application.

The blog page is automagically paginated with the ability to choose between 5, 10, 20, or 50 articles per page. Each article will display the article title, author, date published, tags, and a short preview of the article.

We added a new date published field to support the new blog category, since our existing fields, date created and date modified, were controlled by the system.  This allowed us to move over our old blogs while still displaying them in the correct date order. Plus, it allows us to update existing blog post articles without affecting the date published.

Inside the blog articles, we took advantage of snippets to add blog author bios. This allows us to manage author bios globally in the snippet library so it's easy to make changes and create new blog articles using a template. 

We also used a snippet to embed Disqus at the bottom of our blog articles. Rather than adding the embed code at the bottom of each individual article, I put it in a snippet and added the snippet to our blog template articles. This way, Disqus automatically appears at the bottom of each article and, if I need to manage the Disqus embed code, I can do it in one place.

I'm also really excited to eventually use related articles and tags to help visitors navigate the blog. I'm planning on adding the related articles and potentially the popular articles widget to the bottom of articles. 

SEO considerations

One of the biggest concerns about moving to KnowledgeOwl was search engine optimization. However, we had already added support and functionality for SEO based on customer feedback. Many customers are already relying on KO for SEO.

Moving our own marketing website to KnowledgeOwl is putting our money where our mouth is. We are now in the same boat as our customers when it comes to SEO concerns, which just seems like the right thing to do. What better way to validate and endorse the effectiveness of our software than by running our entire online business using it?

Web analytics tracking

We've installed Google Search Console (formerly Google Webmaster Tools), Google Analytics, and Hotjar to track and measure how our new website performs over time. All three tools are free and can be easily embedded in any knowledge base by adding to the Custom Head on the style page.

• Google Search Console helps you monitor and maintain your site's search presence on Google. We've submitted our sitemap and are monitoring for errors and recommendations. No errors so far!
• Google Analytics helps you track and report website traffic. We are recording trial signups, app logins, and feature searches as events to help us better understand our visitors. So far so good; bounce rate is down and traffic is holding steady!
• Hotjar helps you analyze your traffic using heatmaps and visitor recordings. They also have the ability to analyze forms, collect feedback via surveys and polls, and track conversion funnels. We have a heatmap set up for our new home page and will be watching visitor recordings to decide how we can improve the site. 

Postmortem Thoughts

I'm sure time will tell whether this was a brilliant idea or just a great learning opportunity, but I'm happy we did it regardless. Here's why:

• We built a ton of new features during the process, many of which were feature requests from existing customers: shorter links, new root domain, customizable title tags, article meta descriptions, date published, self-referencial canonical tgs, and blog style categories.
• We dogfooded the heck out of our product. Rebuilding our website in KO was very similar to what our customers experience when building or recreating their own sites in our software. We are using many of our advanced features, such as bare minimum mode, snippets, and user permissions to manage our site.
• We finally updated our website content. Our feature list, blog, and even site name were sadly outdated. Not to mention we got a fresh new look, logo, and mascot (we love Linus!). 

I'm probably still high on the sweet feeling of successfully completing a large project, but I honestly only have one regret: that we didn't do it sooner :)