These tutorials use Page Types for a hierarchical knowledge base with SEO-friendly URLs. For simpler documentation needs, you could also use Collections to store articles in a flat structure. The Page Type approach is recommended for knowledge bases that need search engine visibility and deep linking.
Pages core concepts
For a deeper look at ButterCMS Pages, check out our core concepts article. Learn about creating Pages,
choosing between the blog engine and a custom Page Type, the API, and more.
{"docsConfig":{"theme":"mint","$schema":"https://mintlify.com/docs.json","name":"ButterCMS Docs","colors":{"primary":"#0505e5","light":"#5050ff","dark":"#0000a0"},"logo":{"light":"https://cdn.buttercms.com/nDD3LeMXQxiR9aJRpRLE","dark":"https://cdn.buttercms.com/nDD3LeMXQxiR9aJRpRLE","href":"https://buttercms.com"},"favicon":"https://mintcdn.com/buttercms/ADHjuou5Js2KRBnv/favicon.svg?fit=max\u0026auto=format\u0026n=ADHjuou5Js2KRBnv\u0026q=85\u0026s=719e07eca4e3b3446e3ba6621a6095f0","navbar":{"links":[{"href":"https://buttercms.com/sales/","label":"Request a Demo"}],"primary":{"type":"button","label":"Start for Free","href":"https://app.buttercms.com/join/"}},"seo":{"metatags":{"canonical":"https://buttercms.com/docs","robots":"noindex, nofollow"}},"integrations":{"gtm":{"tagId":"GTM-W7DPCL97"}},"interaction":{"drilldown":true},"styling":{"latex":false},"navigation":{"pages":[]}},"deployment":{"deploymentMetadataValue":{"subdomain":"buttercms","hasAudioNarration":false,"actualSubdomain":"buttercms","customDomains":["buttercms.com"],"gitSource":{"type":"github","owner":"buttercms","repo":"buttercms","deployBranch":"master","contentDirectory":"unified-docs","isPrivate":true,"mountPath":"","label":""},"feedback":{"thumbs":true,"agentFeedback":true},"entitlements":{"AI_CHAT":{"status":"ENABLED"},"WEB_MCP":{"status":"ENABLED"},"NARRATION":{"status":"ENABLED"}},"buildId":"6af1f01fc512f821748a9f47","clientVersion":"0.0.4102","searchFilterCounts":[{"language":"default","tag":"Frameworks","count":79},{"language":"default","tag":"Build your app","count":74},{"language":"default","tag":"Create content","count":74},{"language":"default","tag":"API Reference","count":63},{"language":"default","tag":"Creating and editing content","count":24},{"language":"default","tag":"Core concepts","count":23},{"language":"default","tag":"Starter projects","count":21},{"language":"default","tag":"All starter projects","count":20},{"language":"default","tag":"Webhooks API","count":19},{"language":"default","tag":"How-to recipes","count":18}]},"assistantConfig":{"enableAskAiButton":false,"enableStarterQuestions":false,"enableAskAiSearchBar":true},"basePath":"/docs","hasChatPermissions":false,"hasWebMcpPermissions":true,"toggles":[{"name":"kill-isr","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"custom-rbac-roles","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-mintlify-slack","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-integrations-settings","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"rbac-expansion","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-pr-grouping","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"custom-prefix","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"analytics-v7","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"user-flows-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"no-publish-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-onboarding","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"llms-txt-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving-live","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"stripTemperatureMiddleware","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"support-platform-pylon-zendesk","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"instant-rollback","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications-server","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-fable","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fixed-ai-action-pricing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automation-resolve-merge-conflict","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"scoped-publishing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"mintql","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"page-level-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-version-history-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"billing-page-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"full-page-search","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workspace-projects","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"assistant-v5","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fork-pr-previews","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"revalidation-jwt","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-sso-scim","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"hobby-abuse-scan","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"dashboard-inbox","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-signup","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"turbopuffer-dual-write","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-enabled","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"approve-review-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-metadata","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"sso-setup-deadline-banner","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"turbopuffer-serve","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"live-agents","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false}],"googleFontsInlined":false},"customCss":[{"filePath":"style.css","content":".mermaid .node rect,.mermaid .node circle,.mermaid .node ellipse,.mermaid .node polygon{fill:#f0f4ff!important;stroke:#0505e5!important;stroke-width:2px!important}.mermaid .node .label,.mermaid .node text,.mermaid .nodeLabel{font-family:'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif!important;fill:#000022!important;font-size:14px!important;font-weight:500!important}.mermaid .cluster rect{fill:#f8fafc!important;stroke:#5050ff!important;stroke-width:2px!important;rx:8px!important;ry:8px!important}.mermaid .cluster text,.mermaid .cluster .nodeLabel{fill:#0505e5!important;font-weight:600!important;font-size:15px!important}.mermaid .edgePath .path,.mermaid .flowchart-link{stroke:#5050ff!important;stroke-width:2px!important}.mermaid .arrowheadPath,.mermaid marker path{fill:#5050ff!important;stroke:#5050ff!important}.mermaid .edgeLabel,.mermaid .edgeLabel rect{background-color:#ffffff!important;fill:#ffffff!important}.mermaid .edgeLabel p,.mermaid .edgeLabel>p,.mermaid .edgeLabel div,.mermaid .edgeLabel>div{background:#f8fafc!important}.mermaid .edgeLabel text,.mermaid .edgeLabel .label{fill:#000022!important;font-size:12px!important}.mermaid .actor{fill:#f0f4ff!important;stroke:#0505e5!important;stroke-width:2px!important}.mermaid .actor-line{stroke:#5050ff!important;stroke-width:1px!important}.mermaid text.actor{fill:#000022!important;font-weight:600!important}.mermaid .messageText{fill:#000022!important;font-size:13px!important}.mermaid .messageLine0,.mermaid .messageLine1{stroke:#5050ff!important;stroke-width:1.5px!important}.mermaid .note{fill:#fbe700!important;stroke:#c4b800!important}.mermaid .noteText{fill:#000022!important}.mermaid .statediagram-state rect{fill:#f0f4ff!important;stroke:#0505e5!important;stroke-width:2px!important;rx:6px!important}.mermaid .state-start,.mermaid .state-end{fill:#0505e5!important}.mermaid .pieTitleText{fill:#0505e5!important;font-weight:600!important;font-size:16px!important}.mermaid .classGroup rect{fill:#f0f4ff!important;stroke:#0505e5!important}.mermaid .classGroup text{fill:#000022!important}.mermaid .er.entityBox{fill:#f0f4ff!important;stroke:#0505e5!important}.mermaid .section{fill:#f0f4ff!important}.mermaid .task{fill:#5050ff!important;stroke:#0505e5!important}.mermaid .taskText{fill:#ffffff!important}.mermaid,pre:has(.mermaid),div:has(>.mermaid){max-width:100%!important;min-width:100%!important;padding:1.5rem!important}.mermaid svg{width:100%!important;max-width:100%!important;height:auto!important;min-height:200px!important;max-height:800px!important}.dark .mermaid .edgeLabel p,.dark .mermaid .edgeLabel>p,.dark .mermaid .edgeLabel div,.dark .mermaid .edgeLabel>div{background:#1a1a2e!important}.dark .mermaid{background:#1a1a2e!important}.dark .mermaid .node rect,.dark .mermaid .node circle,.dark .mermaid .node ellipse{fill:#2a2a4a!important;stroke:#5050ff!important}.dark .mermaid .node text,.dark .mermaid .nodeLabel{fill:#e0e0e0!important}.dark .mermaid .cluster rect{fill:#1e1e3a!important;stroke:#5050ff!important}.dark .mermaid .cluster text{fill:#8080ff!important}.dark .mermaid .edgePath .path,.dark .mermaid .flowchart-link{stroke:#7070ff!important}.dark .mermaid .arrowheadPath{fill:#7070ff!important}.dark .mermaid .edgeLabel rect{fill:#1a1a2e!important}.dark .mermaid .edgeLabel text{fill:#e0e0e0!important}.diagram-modal-toggle{display:none}.diagram-container{position:relative}.diagram-preview{position:relative;display:block;cursor:zoom-in;transition:opacity 0.2s ease}.diagram-preview:hover{opacity:0.95}.diagram-expand-hint{position:absolute;top:12px;right:12px;background:rgba(255, 255, 255, 0.95);color:#0505e5;padding:6px 12px;border-radius:6px;font-size:12px;font-weight:500;opacity:0;transition:opacity 0.2s ease;pointer-events:none;box-shadow:0 2px 8px rgba(0, 0, 0, 0.15);z-index:10}.diagram-preview:hover .diagram-expand-hint{opacity:1}.dark .diagram-expand-hint{background:rgba(30, 30, 46, 0.95);color:#8080ff}.diagram-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0, 0, 0, 0.9);display:none;align-items:center;justify-content:center;z-index:9999;padding:2rem;cursor:zoom-out}.diagram-modal-toggle:checked~.diagram-modal-overlay{display:flex;animation:fadeIn 0.2s ease}.diagram-modal-content{max-width:90vw;max-height:90vh;background:#ffffff;border-radius:12px;padding:2rem;box-shadow:0 20px 60px rgba(0, 0, 0, 0.5);cursor:default;overflow:auto}.dark .diagram-modal-content{background:#1a1a2e}.diagram-modal-toggle:checked~*{overflow:hidden}.mermaid-lightbox-wrapper{position:relative;cursor:zoom-in;transition:all 0.2s ease}.mermaid-lightbox-wrapper:hover{opacity:0.95}.mermaid-expand-icon{position:absolute;top:12px;right:12px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:rgba(255, 255, 255, 0.95);border-radius:6px;box-shadow:0 2px 8px rgba(0, 0, 0, 0.15);opacity:0;transition:opacity 0.2s ease, transform 0.2s ease;pointer-events:none;z-index:10}.mermaid-lightbox-wrapper:hover .mermaid-expand-icon{opacity:1;transform:scale(1.05)}.mermaid-expand-icon svg{width:18px;height:18px;color:#0505e5}.dark .mermaid-expand-icon{background:rgba(30, 30, 46, 0.95)}.dark .mermaid-expand-icon svg{color:#8080ff}.mermaid-lightbox-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0, 0, 0, 0.9);display:flex;align-items:center;justify-content:center;z-index:9999;padding:2rem;animation:fadeIn 0.2s ease;cursor:zoom-out}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.mermaid-lightbox-content{max-width:90vw;max-height:90vh;background:#ffffff;border-radius:12px;padding:2rem;box-shadow:0 20px 60px rgba(0, 0, 0, 0.5);cursor:default;overflow:auto}.dark .mermaid-lightbox-content{background:#1a1a2e}.mermaid-lightbox-content .mermaid{padding:0!important}.mermaid-lightbox-content .mermaid svg{max-height:85vh!important;width:auto!important;max-width:85vw!important}.mermaid-lightbox-close{position:fixed;top:1.5rem;right:1.5rem;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:rgba(255, 255, 255, 0.95);border:none;border-radius:50%;cursor:pointer;box-shadow:0 4px 12px rgba(0, 0, 0, 0.3);transition:all 0.2s ease;z-index:10000}.mermaid-lightbox-close:hover{transform:scale(1.1);background:#ffffff}.mermaid-lightbox-close svg{width:24px;height:24px;color:#000022}.dark .mermaid-lightbox-close{background:rgba(30, 30, 46, 0.95)}.dark .mermaid-lightbox-close:hover{background:#1e1e3a}.dark .mermaid-lightbox-close svg{color:#e0e0e0}.mermaid-scroll-zoom{overflow:auto;max-height:500px;border:1px solid #e5e7eb;border-radius:12px;background:#ffffff;margin:1rem 0;cursor:grab;position:relative}.mermaid-scroll-zoom:active{cursor:grabbing}.dark .mermaid-scroll-zoom{border-color:#374151;background:#1a1a2e}.mermaid-scroll-zoom .mermaid{padding:1.5rem!important;min-width:100%;width:max-content}.mermaid-scroll-zoom .mermaid svg{min-width:120%;max-width:none!important;max-height:none!important;height:auto!important;transform-origin:top left}.mermaid-zoom-hint{text-align:center;font-size:12px;color:#6b7280;margin:0.5rem 0 1rem 0;font-style:italic}.dark .mermaid-zoom-hint{color:#9ca3af}.mermaid-scroll-zoom::-webkit-scrollbar{width:8px;height:8px}.mermaid-scroll-zoom::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.mermaid-scroll-zoom::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}.mermaid-scroll-zoom::-webkit-scrollbar-thumb:hover{background:#a1a1a1}.dark .mermaid-scroll-zoom::-webkit-scrollbar-track{background:#2a2a4a}.dark .mermaid-scroll-zoom::-webkit-scrollbar-thumb{background:#4a4a6a}.dark .mermaid-scroll-zoom::-webkit-scrollbar-thumb:hover{background:#5a5a7a}@media (max-width: 768px){.mermaid-lightbox-overlay{padding:1rem}.mermaid-lightbox-content{max-width:95vw;max-height:95vh;padding:1rem}.mermaid-lightbox-content .mermaid svg{max-height:90vh!important;max-width:90vw!important}.mermaid-lightbox-close{width:40px;height:40px;top:1rem;right:1rem}.mermaid-lightbox-close svg{width:20px;height:20px}.mermaid-expand-icon{opacity:0.8}}"}],"page":{"pagePath":"build-your-app/how-to-recipes/build/knowledge-base","slug":"/build-your-app/how-to-recipes/build/knowledge-base","pageMetadata":{"title":"Knowledge base","description":"Build a knowledge base with ButterCMS and your framework of choice using one of our guided tutorials.","icon":"book","href":"/build-your-app/how-to-recipes/build/knowledge-base"},"description":{"compiledSource":"\"use strict\";\nconst {jsx: _jsx} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = {\n p: \"p\",\n ..._provideComponents(),\n ...props.components\n };\n return _jsx(_components.p, {\n children: \"Build a knowledge base with ButterCMS and your framework of choice using one of our guided tutorials.\"\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = {\n ..._provideComponents(),\n ...props.components\n };\n return MDXLayout ? _jsx(MDXLayout, {\n ...props,\n children: _jsx(_createMdxContent, {\n ...props\n })\n }) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\n","frontmatter":{},"scope":{}},"pageType":"default","mdx":{"mdxSource":{"compiledSource":"\"use strict\";const{Fragment:_Fragment,jsx:_jsx,jsxs:_jsxs}=arguments[0];const{useMDXComponents:_provideComponents}=arguments[0];function _createMdxContent(props){const _components={a:`a`,li:`li`,p:`p`,ul:`ul`,..._provideComponents(),...props.components},{Card,CardGroup,Heading,Tip}=_components;if(!Card)_missingMdxReference(`Card`,true);if(!CardGroup)_missingMdxReference(`CardGroup`,true);if(!Heading)_missingMdxReference(`Heading`,true);if(!Tip)_missingMdxReference(`Tip`,true);return _jsxs(_Fragment,{children:[_jsx(Heading,{level:`2`,id:`what-you’ll-build`,children:`What you’ll build`}),`\n`,_jsx(_components.p,{children:`A complete knowledge base that includes:`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsx(_components.li,{children:`Organized sections and articles`}),`\n`,_jsx(_components.li,{children:`Hierarchical navigation`}),`\n`,_jsx(_components.li,{children:`Search functionality`}),`\n`,_jsx(_components.li,{children:`Article detail pages`}),`\n`,_jsx(_components.li,{children:`Related articles suggestions`}),`\n`]}),`\n`,_jsx(Tip,{children:_jsx(_components.p,{children:`These tutorials use Page Types for a hierarchical knowledge base with SEO-friendly URLs. For simpler documentation needs, you could also use Collections to store articles in a flat structure. The Page Type approach is recommended for knowledge bases that need search engine visibility and deep linking.`})}),`\n`,_jsx(Card,{title:`Pages core concepts`,icon:`lightbulb`,href:`/core-concepts/content-types/pages`,children:_jsx(_components.p,{children:`For a deeper look at ButterCMS Pages, check out our core concepts article. Learn about creating Pages,\nchoosing between the blog engine and a custom Page Type, the API, and more.`})}),`\n`,_jsx(Heading,{level:`2`,id:`choose-your-framework`,children:`Choose your framework`}),`\n`,_jsx(_components.p,{children:`Choose one of the frameworks below for a tailored guide to building a fully functional knowledge base with ButterCMS.`}),`\n`,_jsx(Tip,{children:_jsxs(_components.p,{children:[`Many of these tutorials have their code available on GitHub. `,_jsx(_components.a,{href:`https://github.com/orgs/ButterCMS/repositories?q=knowledge-base`,children:`Check if your favorite framework is one of them!`})]})}),`\n`,_jsx(Heading,{level:`3`,id:`javascript-frameworks`,children:`JavaScript frameworks`}),`\n`,_jsxs(CardGroup,{cols:3,children:[_jsx(Card,{title:`Angular`,icon:`js`,href:`https://buttercms.com/blog/how-to-build-a-knowledge-base-with-angular`}),_jsx(Card,{title:`Astro`,icon:`js`,href:`https://buttercms.com/blog/astro-tutorial-knowledge-base`}),_jsx(Card,{title:`Express.js`,icon:`js`,href:`https://buttercms.com/blog/expressjs-website-tutorial-effortless-knowledge-base-creation`}),_jsx(Card,{title:`Next.js`,icon:`js`,href:`https://buttercms.com/blog/nextjs-knowledge-base-tutorial`}),_jsx(Card,{title:`Nuxt`,icon:`js`,href:`https://buttercms.com/blog/nuxt-tutorial-building-a-knowledge-base`}),_jsx(Card,{title:`React`,icon:`js`,href:`https://buttercms.com/blog/build-a-knowledge-base-with-react`}),_jsx(Card,{title:`React Native`,icon:`js`,href:`https://buttercms.com/blog/building-a-knowledge-base-with-react-native`}),_jsx(Card,{title:`Vanilla js`,icon:`js`,href:`https://buttercms.com/blog/javascript-app-tutorial-knowledge-base-creation`}),_jsx(Card,{title:`Vue.js`,icon:`js`,href:`https://buttercms.com/blog/vue-knowledge-base`})]}),`\n`,_jsx(Heading,{level:`3`,id:`non-javascript-frameworks`,children:`Non-JavaScript frameworks`}),`\n`,_jsxs(CardGroup,{cols:3,children:[_jsx(Card,{title:`ASP.Net`,icon:`microsoft`,href:`https://buttercms.com/blog/asp-net-website-tutorial-knowledge-base`}),_jsx(Card,{title:`Flutter`,icon:`flutter`,href:`https://buttercms.com/blog/flutter-app-tutorial-build-a-knowledge-base`}),_jsx(Card,{title:`Hugo`,icon:`golang`,href:`https://buttercms.com/blog/hugo-tutorial-knowledge-base`}),_jsx(Card,{title:`Kotlin`,icon:`android`,href:`https://buttercms.com/blog/kotlin-tutorial-knowledge-base`}),_jsx(Card,{title:`Laravel`,icon:`laravel`,href:`https://buttercms.com/blog/create-laravel-knowledge-base-app-with-buttercms`}),_jsx(Card,{title:`PHP`,icon:`php`,href:`https://buttercms.com/blog/php-knowledge-base-tutorial`}),_jsx(Card,{title:`Ruby + Rails`,icon:`gem`,href:`https://buttercms.com/blog/rails-tutorial-creating-a-knowledge-base`}),_jsx(Card,{title:`Ruby + Sinatra`,icon:`gem`,href:`https://buttercms.com/blog/create-ruby-knowledge-base-website`})]})]})}function MDXContent(props={}){const{wrapper:MDXLayout}={..._provideComponents(),...props.components};return MDXLayout?_jsx(MDXLayout,{...props,children:_jsx(_createMdxContent,{...props})}):_createMdxContent(props)}return{default:MDXContent};function _missingMdxReference(id,component){throw new Error(`Expected `+(component?`component`:`object`)+\" `\"+id+\"` to be defined: you likely forgot to import, pass, or provide it.\")}","frontmatter":{},"scope":{"config":{},"pageMetadata":{"title":"Knowledge base","description":"Build a knowledge base with ButterCMS and your framework of choice using one of our guided tutorials.","icon":"book","href":"/build-your-app/how-to-recipes/build/knowledge-base"}}},"mdxSourceWithNoJs":null},"mdxExtracts":{"tableOfContents":[{"title":"What you’ll build","slug":"what-you’ll-build","depth":2,"children":[]},{"title":"Choose your framework","slug":"choose-your-framework","depth":2,"children":[{"title":"JavaScript frameworks","slug":"javascript-frameworks","depth":3,"children":[]},{"title":"Non-JavaScript frameworks","slug":"non-javascript-frameworks","depth":3,"children":[]}]}],"codeExamples":{}},"jsLinks":[],"subdomain":"buttercms","siteName":"ButterCMS Docs","title":"Knowledge base - ButterCMS Docs","navMaps":{"firstHrefInVersion":{},"firstHrefInLanguage":{}},"lastModified":"2026-06-08T09:57:50.309Z","originalFileLocation":"build-your-app/how-to-recipes/build/knowledge-base.mdx"},"headHtml":"\u003cscript data-mint-head>(function(){var d=document.documentElement,p=null;if(!p){try{p=localStorage.getItem(\"isDarkMode\")}catch(e){}if(p==='true')p='dark';else if(p==='false')p='light';if(p!=='light'\u0026\u0026p!=='dark'\u0026\u0026p!=='system')p=\"system\"}var r=p==='system'?(matchMedia(\"(prefers-color-scheme: dark)\").matches?'dark':'light'):p;d.classList.remove(r==='dark'?'light':'dark');d.classList.add(r);d.setAttribute(\"data-theme-preference\",p)})();\u003c/script>\u003cmeta data-mint-head name=\"description\" content=\"Build a knowledge base with ButterCMS and your framework of choice using one of our guided tutorials.\">\u003cmeta data-mint-head name=\"application-name\" content=\"ButterCMS Docs\">\u003cmeta data-mint-head name=\"generator\" content=\"Mintlify\">\u003cmeta data-mint-head name=\"robots\" content=\"noindex, nofollow\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/docs/mintlify-assets/_mintlify/favicons/buttercms/r9p2A1fiqo_BuZws/_generated/favicon/android-chrome-192x192.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"apple-touch-icon\" type=\"image/png\" sizes=\"180x180\" href=\"/docs/mintlify-assets/_mintlify/favicons/buttercms/r9p2A1fiqo_BuZws/_generated/favicon/apple-touch-icon.png\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/docs/mintlify-assets/_mintlify/favicons/buttercms/r9p2A1fiqo_BuZws/_generated/favicon/favicon-16x16.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/docs/mintlify-assets/_mintlify/favicons/buttercms/r9p2A1fiqo_BuZws/_generated/favicon/favicon-32x32.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/docs/mintlify-assets/_mintlify/favicons/buttercms/r9p2A1fiqo_BuZws/_generated/favicon/favicon.ico\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/docs/mintlify-assets/_mintlify/favicons/buttercms/r9p2A1fiqo_BuZws/_generated/favicon-dark/android-chrome-192x192.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/docs/mintlify-assets/_mintlify/favicons/buttercms/r9p2A1fiqo_BuZws/_generated/favicon-dark/favicon-16x16.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/docs/mintlify-assets/_mintlify/favicons/buttercms/r9p2A1fiqo_BuZws/_generated/favicon-dark/favicon-32x32.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/docs/mintlify-assets/_mintlify/favicons/buttercms/r9p2A1fiqo_BuZws/_generated/favicon-dark/favicon.ico\" media=\"(prefers-color-scheme: dark)\">\u003cmeta data-mint-head property=\"og:title\" content=\"Knowledge base - ButterCMS Docs\">\u003cmeta data-mint-head property=\"og:description\" content=\"Build a knowledge base with ButterCMS and your framework of choice using one of our guided tutorials.\">\u003cmeta data-mint-head property=\"og:site_name\" content=\"ButterCMS Docs\">\u003cmeta data-mint-head property=\"og:url\" content=\"https://buttercms.com/docs/build-your-app/how-to-recipes/build/knowledge-base\">\u003cmeta data-mint-head property=\"og:type\" content=\"website\">\u003cmeta data-mint-head property=\"og:image\" content=\"https://buttercms.mintlify.site/docs/_mintlify/api/og/v2?division=I+want+to+build+a+...+\u0026amp;title=Knowledge+base\u0026amp;description=Build+a+knowledge+base+with+ButterCMS+and+your+framework+of+choice+using+one+of+our+guided+tutorials.\u0026amp;theme=5b7441fa906780c0ab866249\u0026amp;signature=963b7dcd13dd1351d09ace464d125b52969f15bf263c33f91eefa6fd57c1c841\">\u003cmeta data-mint-head property=\"og:image:width\" content=\"1200\">\u003cmeta data-mint-head property=\"og:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"twitter:card\" content=\"summary_large_image\">\u003cmeta data-mint-head name=\"twitter:title\" content=\"Knowledge base - ButterCMS Docs\">\u003cmeta data-mint-head name=\"twitter:description\" content=\"Build a knowledge base with ButterCMS and your framework of choice using one of our guided tutorials.\">\u003cmeta data-mint-head name=\"twitter:image\" content=\"https://buttercms.mintlify.site/docs/_mintlify/api/og/v2?division=I+want+to+build+a+...+\u0026amp;title=Knowledge+base\u0026amp;description=Build+a+knowledge+base+with+ButterCMS+and+your+framework+of+choice+using+one+of+our+guided+tutorials.\u0026amp;theme=5b7441fa906780c0ab866249\u0026amp;signature=963b7dcd13dd1351d09ace464d125b52969f15bf263c33f91eefa6fd57c1c841\">\u003cmeta data-mint-head name=\"twitter:image:width\" content=\"1200\">\u003cmeta data-mint-head name=\"twitter:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"msapplication-config\" content=\"/docs/mintlify-assets/_mintlify/favicons/buttercms/r9p2A1fiqo_BuZws/_generated/favicon/browserconfig.xml\">\u003cmeta data-mint-head name=\"apple-mobile-web-app-title\" content=\"ButterCMS Docs\">\u003cmeta data-mint-head name=\"msapplication-TileColor\" content=\"#0505e5\">\u003clink data-mint-head rel=\"canonical\" href=\"https://buttercms.com/docs/build-your-app/how-to-recipes/build/knowledge-base\">\u003clink data-mint-head rel=\"alternate\" type=\"application/xml\" href=\"/docs/sitemap.xml\">\u003clink data-mint-head rel=\"alternate\" type=\"text/markdown\" href=\"/docs/build-your-app/how-to-recipes/build/knowledge-base.md\">\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https://buttercms.com/#organization\",\"name\":\"ButterCMS Docs\",\"url\":\"https://buttercms.com\",\"logo\":{\"@type\":\"ImageObject\",\"url\":\"https://cdn.buttercms.com/nDD3LeMXQxiR9aJRpRLE\"}},{\"@type\":\"WebSite\",\"@id\":\"https://buttercms.com/docs#website\",\"name\":\"ButterCMS Docs\",\"url\":\"https://buttercms.com/docs\",\"publisher\":{\"@id\":\"https://buttercms.com/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https://buttercms.com/docs/build-your-app/how-to-recipes/build/knowledge-base#webpage\",\"url\":\"https://buttercms.com/docs/build-your-app/how-to-recipes/build/knowledge-base\",\"name\":\"Knowledge base\",\"description\":\"Build a knowledge base with ButterCMS and your framework of choice using one of our guided tutorials.\",\"dateModified\":\"2026-06-08T09:57:50.309Z\",\"isPartOf\":{\"@id\":\"https://buttercms.com/docs#website\"},\"breadcrumb\":{\"@id\":\"https://buttercms.com/docs/build-your-app/how-to-recipes/build/knowledge-base#breadcrumb\"}},{\"@type\":\"BreadcrumbList\",\"@id\":\"https://buttercms.com/docs/build-your-app/how-to-recipes/build/knowledge-base#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"How-to recipes\",\"item\":\"https://buttercms.com/docs/build-your-app/how-to-recipes/build/building-a-blog-blog-engine\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"I want to build a ... \",\"item\":\"https://buttercms.com/docs/build-your-app/how-to-recipes/build/building-a-blog-blog-engine\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Knowledge base\",\"item\":\"https://buttercms.com/docs/build-your-app/how-to-recipes/build/knowledge-base\"}]},{\"@type\":[\"Article\",\"TechArticle\"],\"@id\":\"https://buttercms.com/docs/build-your-app/how-to-recipes/build/knowledge-base#article\",\"headline\":\"Knowledge base\",\"name\":\"Knowledge base\",\"description\":\"Build a knowledge base with ButterCMS and your framework of choice using one of our guided tutorials.\",\"url\":\"https://buttercms.com/docs/build-your-app/how-to-recipes/build/knowledge-base\",\"mainEntityOfPage\":{\"@id\":\"https://buttercms.com/docs/build-your-app/how-to-recipes/build/knowledge-base#webpage\"},\"dateModified\":\"2026-06-08T09:57:50.309Z\",\"publisher\":{\"@id\":\"https://buttercms.com/#organization\"},\"isPartOf\":{\"@id\":\"https://buttercms.com/docs#website\"}}]}\u003c/script>\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@type\":\"WebSite\",\"name\":\"ButterCMS Docs\",\"publisher\":{\"@type\":\"Organization\",\"name\":\"ButterCMS Docs\"},\"provider\":{\"@type\":\"Organization\",\"name\":\"Mintlify\",\"url\":\"https://mintlify.com\"}}\u003c/script>","agentPointerHref":"/docs/build-your-app/how-to-recipes/build/knowledge-base.md","siteName":"ButterCMS Docs","nav":{"global":null,"tabs":[{"tab":"Quickstart","pages":[{"title":"Quickstart","href":""}]},{"tab":"Core concepts","pages":[{"title":"Core concepts","href":"/core-concepts/content-types/overview"}]},{"tab":"Create content","pages":[{"title":"Create content","href":"/create-content/overview"}]},{"tab":"Build your app","groups":[{"group":"Overview","pages":[{"title":"Table of contents","icon":"wand-magic-sparkles","href":"/build-your-app/overview"},{"title":"Environment setup","icon":"layer-group","href":"/build-your-app/multi-site/environment-setup"}]},{"group":"How-to recipes","pages":[{"group":"I want to build a ... ","icon":"hammer","pages":[{"title":"Blog (Blog Engine)","icon":"newspaper","href":"/build-your-app/how-to-recipes/build/building-a-blog-blog-engine"},{"title":"Custom blog (Page Types)","icon":"newspaper","href":"/build-your-app/how-to-recipes/build/building-a-blog-page-type"},{"title":"Customer portal","icon":"user","href":"/build-your-app/how-to-recipes/build/customer-portal"},{"title":"E-commerce project","icon":"store","href":"/build-your-app/how-to-recipes/build/e-commerce-projects"},{"title":"Event management system","icon":"calendar","href":"/build-your-app/how-to-recipes/build/event-management-system"},{"title":"Food ordering app","description":"Build a food ordering app with React + ButterCMS with item listings, search, and add to cart","icon":"burger","href":"/build-your-app/how-to-recipes/build/food-ordering-app"},{"title":"Knowledge base","icon":"book","href":"/build-your-app/how-to-recipes/build/knowledge-base"},{"title":"Learning platform","description":"Use ButterCMS and Django to build a collaborative online learning platform, including courses, student enrollment, and student progress","icon":"graduation-cap","href":"/build-your-app/how-to-recipes/build/learning-platform"},{"title":"News aggregator","icon":"newspaper","href":"/build-your-app/how-to-recipes/build/news-aggregator"},{"title":"Project portfolio","icon":"briefcase","href":"/build-your-app/how-to-recipes/build/project-portfolio"},{"title":"Quiz app","icon":"block-question","href":"/build-your-app/how-to-recipes/build/quiz-app"},{"title":"Team directory","icon":"users","href":"/build-your-app/how-to-recipes/build/team-member-directory"}]},{"group":"I want to add ...","icon":"puzzle-piece","pages":[{"title":"Dynamic landing pages","icon":"wand-magic-sparkles","href":"/build-your-app/how-to-recipes/add-a-feature/dynamic-landing-pages"},{"title":"Add table of contents to Blog Engine post","icon":"list","href":"/build-your-app/how-to-recipes/add-a-feature/table-of-contents"},{"title":"Navigation menu","icon":"bars","href":"/build-your-app/how-to-recipes/add-a-feature/navigation-menus-collections"},{"title":"SEO Components to Pages","icon":"share-nodes","href":"/build-your-app/how-to-recipes/add-a-feature/seo-components-to-pages"},{"title":"Social sharing buttons","icon":"share-nodes","href":"/build-your-app/how-to-recipes/add-a-feature/social-sharing-buttons"},{"title":"Community comments","icon":"comments","href":"/build-your-app/how-to-recipes/add-a-feature/community-comments"}]}]},{"group":"Rendering complex field types","pages":[{"title":"Repeaters: fetch and add to application","icon":"code","href":"/build-your-app/rendering-complex-field-types/fetching-repeater-data"},{"title":"Components: fetch and add to application","icon":"code","href":"/build-your-app/rendering-complex-field-types/fetching-components"},{"title":"Rendering Conditional Fields","icon":"code-branch","href":"/build-your-app/rendering-complex-field-types/rendering-conditional-fields"},{"group":"Rendering forms","icon":"wpforms","pages":[{"title":"Rendering embedded forms","icon":"window-restore","href":"/build-your-app/rendering-complex-field-types/embedding-forms"},{"title":"Rendering integrated forms","icon":"square-poll-vertical","href":"/build-your-app/rendering-complex-field-types/form-integrations"},{"title":"Rendering custom forms","icon":"code","href":"/build-your-app/rendering-complex-field-types/custom-form-handling"}]}]},{"group":"Webhooks and events","pages":[{"title":"Webhooks overview","icon":"webhook","href":"/build-your-app/webhooks-events/webhooks-overview"},{"title":"Webhook event types","icon":"list","href":"/build-your-app/webhooks-events/webhook-event-types"},{"title":"Configuring and Receiving Webhooks","icon":"gear","href":"/build-your-app/webhooks-events/configuring-and-receiving-webhooks"},{"title":"Webhook payloads \u0026 data","icon":"code","href":"/build-your-app/webhooks-events/webhook-payloads-data"},{"title":"Securing webhooks","icon":"shield","href":"/build-your-app/webhooks-events/securing-webhooks"},{"title":"Retry logic \u0026 error handling","icon":"rotate","href":"/build-your-app/webhooks-events/retry-logic-error-handling"},{"title":"Webhook monitoring \u0026 debugging","icon":"bug","href":"/build-your-app/webhooks-events/webhook-monitoring-debugging"},{"title":"Cache invalidation with webhooks","icon":"broom","href":"/build-your-app/webhooks-events/cache-invalidation-webhooks"},{"title":"Real-time synchronization","icon":"arrows-rotate","href":"/build-your-app/webhooks-events/real-time-synchronization"},{"title":"Automating with no-code tools","icon":"gears","href":"/build-your-app/webhooks-events/automating-with-no-code-tools"}]},{"group":"Third-party integrations","pages":[{"title":"ButterCMS Marketplace","icon":"store","href":"/build-your-app/third-party-integrations/buttercms-marketplace"},{"title":"Integration with AI tools","icon":"plug","href":"/build-your-app/third-party-integrations/ai-tools-integration"}]},{"group":"Performance","pages":[{"title":"API performance best practices","icon":"bolt","href":"/build-your-app/performance/api-performance-best-practices"},{"title":"Query optimization","icon":"magnifying-glass","href":"/build-your-app/performance/query-optimization"},{"title":"Pagination","icon":"filter","href":"/build-your-app/performance/pagination"},{"title":"Filtering requests","icon":"sliders","href":"/build-your-app/performance/filtering-requests"},{"title":"Caching strategies","icon":"database","href":"/build-your-app/performance/caching-strategies"},{"title":"CDN \u0026 global content delivery","icon":"globe","href":"/build-your-app/performance/cdn-global-delivery"},{"title":"Usage \u0026 limits","icon":"chart-line","href":"/build-your-app/performance/usage-limits"},{"title":"Monitoring API usage","icon":"chart-line","href":"/build-your-app/performance/monitoring-api-usage"},{"title":"Rate limits \u0026 throttling","icon":"gauge","href":"/build-your-app/performance/rate-limits-throttling"},{"title":"Scaling for high traffic","icon":"chart-bar","href":"/build-your-app/performance/scaling-high-traffic"}]},{"group":"Content migration","pages":[{"title":"Content migration overview","icon":"arrow-right-arrow-left","href":"/build-your-app/content-migration/migration-overview"},{"title":"Migration planning \u0026 strategy","icon":"map","href":"/build-your-app/content-migration/migration-planning-strategy"},{"title":"Export and inventory current content","icon":"box-archive","href":"/build-your-app/content-migration/export-and-inventory-content"},{"title":"Map content to ButterCMS models","icon":"sitemap","href":"/build-your-app/content-migration/map-content-to-buttercms"},{"title":"Import data using the Write API","icon":"upload","href":"/build-your-app/content-migration/import-data-using-write-api"},{"title":"Post-migration validation","icon":"clipboard-check","href":"/build-your-app/content-migration/post-migration-validation"},{"title":"Third-party migration tools","icon":"wrench","href":"/build-your-app/content-migration/third-party-migration-tools"},{"title":"Contentful to ButterCMS migration","icon":"arrow-right-arrow-left","href":"/build-your-app/content-migration/contentful-to-buttercms"},{"title":"WordPress to ButterCMS migration","icon":"wordpress","href":"/build-your-app/content-migration/wordpress-to-buttercms"}]},{"group":"Multi-site and environments","pages":[{"title":"Multi-site API architecture","icon":"sitemap","href":"/build-your-app/multi-site-environments/multi-site-architecture"},{"title":"Automating cross-site sync","icon":"rotate","href":"/build-your-app/multi-site-environments/syncing-content-across-sites"}]},{"group":"Localization and languages","pages":[{"title":"Localization quickstart","icon":"compass","href":"/build-your-app/localization/localization-quickstart"},{"title":"Localization architecture","icon":"globe","href":"/build-your-app/localization/localization-architecture"},{"title":"Fetching localized content via API","icon":"code","href":"/build-your-app/localization/fetching-localized-content-api"},{"title":"Locale-specific content","icon":"file-lines","href":"/build-your-app/localization/locale-specific-content"},{"title":"Translation Integrations","icon":"plug","href":"/build-your-app/localization/translation-integrations"}]},{"group":"SEO","pages":[{"title":"Rendering SEO data","icon":"code","href":"/build-your-app/seo/rendering-seo-data"},{"title":"SEO for multilingual sites","icon":"magnifying-glass","href":"/build-your-app/seo/seo-multilingual-sites"},{"title":"Structured data \u0026 schema markup","icon":"code","href":"/build-your-app/seo/structured-data-schema"},{"title":"Sitemap generation","icon":"sitemap","href":"/build-your-app/seo/sitemap-generation"},{"title":"Mobile SEO optimization","icon":"mobile","href":"/build-your-app/seo/mobile-seo-optimization"}]},{"group":"Media CDN","pages":[{"title":"Customizing media URLs","icon":"link","href":"/build-your-app/media-cdn/customizing-media-urls"}]},{"group":"Security and compliance","pages":[{"title":"Security overview","icon":"shield","href":"/build-your-app/security-compliance/security-overview"},{"title":"Data protection and encryption","icon":"database","href":"/build-your-app/security-compliance/data-protection-encryption"},{"title":"Compliance certifications","icon":"certificate","href":"/build-your-app/security-compliance/compliance-certifications"},{"title":"Infrastructure and hosting","icon":"server","href":"/build-your-app/security-compliance/infrastructure-hosting"}]}]},{"tab":"API Reference","pages":[{"title":"API Reference","href":"/api/overview"}]},{"tab":"Frameworks","pages":[{"title":"Frameworks","href":"/frameworks/tab-overview"}]},{"tab":"Support","pages":[{"title":"Support","href":"/support/account-management/account-settings"}]}]},"basePath":"","title":"Knowledge base - ButterCMS Docs","buildId":"dpl_2AK98Hxhwu4fUXpx9atbv41cC328","deploymentId":"dpl_2AK98Hxhwu4fUXpx9atbv41cC328","dynamics":[],"chunks":[]}