Gatsby Theme Primer Wiki screenshot

Gatsby Theme Primer Wiki

Author Avatar Theme by Theowenyoung
Updated: 21 Apr 2022
118 Stars

A Gatsby Theme for Wiki/Docs/Knowledge Base, which using Primer style as the UI theme, can work well with Foam or Obsibian or just markdown files.

Overview

The Gatsby Theme Primer Wiki is a theme designed for creating wiki, documentation, and knowledge base websites. It uses the Primer style as the UI theme and is compatible with Foam, Obsidian, and markdown files. This theme provides support for local search, SEO optimization, graph visualization, tags, and light/dark themes. It also supports custom header navigation items, nested sidebars, prefix path, and draft posts. The theme follows the principles of no vendor lock-in and using metadata instead of special characters or categories.

Features

  • Local search: Provides full-text search functionality for easy content discovery.
  • SEO Optimization: Offers search engine optimization features for improved visibility.
  • Graph Visualisation: Supports the visualization of relationships between content using canvas.
  • Tags: Allows the use of tags for organizing and categorizing content. Supports generating tag pages and connecting with graph visualization.
  • Gitbook styled SUMMARY.md: Supports the use of a custom sidebar using the Gitbook style format.
  • WikiLinks: Supports linking between wiki pages using the [[WikiLink]] syntax.
  • Light/Dark Theme: Provides the option to switch between light and dark themes.
  • Custom Header Nav Items: Allows customization of the header navigation items.
  • Nested Sidebar: Supports the nesting of sidebar items for better organization.

Installation

To install the Gatsby Theme Primer Wiki, follow these steps:

  1. For Foam template:

    • Navigate to the foam-template-gatsby-theme-primer-wiki repository.
    • Edit the .layouts/gatsby-config.js file according to your requirements. Example configuration can be found here.
    • Set custom sidebars by creating a file named SUMMARY.md in your content directory. Follow the format described in the Gitbook documentation.
    • Optionally, you can use a custom default sidebar depth by setting the sidebarDepth property in the theme configuration.
    • Overwrite the site theme by adding src/gatsby-theme-primer-wiki/theme.js.
    • Customize the site logo by specifying the icon path.
  2. For Obsidian template:

    • Navigate to the obsidian-template-gatsby-theme-primer-wiki repository.
    • Follow the same steps mentioned above for the Foam template.
  3. For Gatsby starter:

    • Navigate to the gatsby-starter-primer-wiki repository.
    • Edit the gatsby-config.js file according to your requirements. Example configuration can be found here.
    • Follow the same steps mentioned above for the Foam template.

Summary

The Gatsby Theme Primer Wiki is a versatile theme for creating wiki, documentation, and knowledge base websites. It offers a range of features, including local search, SEO optimization, graph visualization, tags, and light/dark themes. The theme follows principles of no vendor lock-in and metadata usage for flexibility and easier migration. With easy installation and customizable options, this theme provides a user-friendly experience for creating and managing content.