Skip to content
Docs Engine
Visit Docs Engine on GitHub
Set theme to dark (⇧+D)

Configuration

The Docs Engine is designed to allow customization by each Cloudflare product team.

Every docs site must include a docs-config.js file. This file is used by Docs Engine to customize the docs site’s title, logo, external links menu, site metadata, search, and more.

Properties

Create a docs-config.js file which exports (by setting module.exports) a JavaScript object containing the following properties:

  • product string required

    • The title of the project, e.g. "My Docs". Displayed inside the sidebar navigation on desktop, the header on mobile, and concatenated into a few tooltips.
  • pathPrefix string optional

  • productIconKey string optional

  • productLogoPathD string optional

    • The logo for the docs site, specified directly as the SVG <path/> d attribute for an inline SVG element with viewBox="0 0 48 48". The example "M8 8h32v32h-32v-32z" would draw a solid 32px square centered inside the 48px square space. One of productLogoPathD or productIconKey is required.
  • contentRepo string required

    • The GitHub repo (e.g. "cloudflare/cloudflare-docs") used to for example construct the the “Edit on GitHub” links displayed in each docs page’s footer.
  • contentRepoFolder string optional

  • externalLinks array required

    • An array of objects each specifying a title string and url string. Used to construct the external links menu inside the sidebar nav on desktop.
  • search object required

    • Adds a search to the site, powered by Algolia DocSearch. To hide search, set search.indexName and search.apiKey to the empty string, and search.algoliaOptions to the default empty filter, e.g.:

      search: {  indexName: "",  apiKey: "",  algoliaOptions: { "facetFilters": "" }}

      For an example of a project using search, see the Workers config.

  • siteMetadata object required

    • A proxy to the Gatsby property of the same name. Sub-properties:

      • title string

        • Used in meta tags for SEO.
      • description string

        • Used in description meta tags for SEO.
      • author string

        • Used in author meta tags for SEO.
      • url string

        • The URL of the final resulting site (including appending pathPrefix). Used to construct rel="canonical" meta tags for SEO.
      • image string

        • Used for the og:image meta tag for SEO and social media.

Examples

Here’s the docs-config.js file for these docs:

docs-config.jsmodule.exports = {  product: "Docs Engine",  pathPrefix: "/docs-engine",  productIconKey: "docs-engine",  contentRepo: "cloudflare/cloudflare-docs",  contentRepoFolder: "products/docs-engine",  externalLinks: [    {      title: "Docs Engine on GitHub",      url: "https://github.com/cloudflare/cloudflare-docs-engine"    },    {      title: "Cloudflare Developer documentation",      url: "https://developers.cloudflare.com/docs"    },  ],  search: {    indexName: "",    apiKey: "",  },  siteMetadata: {    title: "Cloudflare Docs Engine docs",    description: "Documentation for the open-source Cloudflare Documentation engine which powers Cloudflare's open-source documentation.",    author: "@cloudflare",    url: "https://developers.cloudflare.com/docs-engine",    image: "data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQEAYAAABPYyMiAAAABmJLR0T///////8JWPfcAAAACXBIWXMAAABIAAAASABGyWs+AAAAF0lEQVRIx2NgGAWjYBSMglEwCkbBSAcACBAAAeaR9cIAAAAASUVORK5CYII=",  }}

(Source)