<!doctype html><htmllang=en-audir=ltrclass=scroll-smoothdata-default-appearance=lightdata-auto-appearance=true><head><metacharset=utf-8><metahttp-equiv=content-languagecontent="en-au"><metaname=viewportcontent="width=device-width,initial-scale=1"><metaname=theme-colorcontent="rgb(255,255,255)"><metahttp-equiv=x-ua-compatiblecontent="ie=edge"><title>Documentation · Congo</title><metaname=titlecontent="Documentation · Congo"><metaname=descriptioncontent="Learn how to use Congo and its features."><linkrel=canonicalhref=https://jpanther.github.io/congo/docs/><linkrel=alternatetype=application/rss+xmlhref=/congo/docs/index.xmltitle=Congo><linktype=text/cssrel=stylesheethref=/congo/css/main.bundle.min.d2d22c5c1c2460999b194d3fbbce6097c00f40fb952d56864bb609de68cbc5ea.cssintegrity="sha256-0tIsXBwkYJmbGU0/u85gl8APQPuVLVaGS7YJ3mjLxeo="><scripttype=text/javascriptsrc=/congo/js/appearance.min.022d0ebc3b46a335eb1c7ef79b7f2de143d7cd5156d433638592ef1ce5f8554e.jsintegrity="sha256-Ai0OvDtGozXrHH73m38t4UPXzVFW1DNjhZLvHOX4VU4="></script>
<linkrel=apple-touch-iconsizes=180x180href=/congo/apple-touch-icon.png><linkrel=icontype=image/pngsizes=32x32href=/congo/favicon-32x32.png><linkrel=icontype=image/pngsizes=16x16href=/congo/favicon-16x16.png><linkrel=manifesthref=/congo/site.webmanifest><metaproperty="og:title"content="Documentation"><metaproperty="og:description"content="Learn how to use Congo and its features."><metaproperty="og:type"content="website"><metaproperty="og:url"content="https://jpanther.github.io/congo/docs/"><metaname=twitter:cardcontent="summary"><metaname=twitter:titlecontent="Documentation"><metaname=twitter:descriptioncontent="Learn how to use Congo and its features."><metaname=authorcontent="Congo"><linkhref=https://twitter.com/rel=me><linkhref=https://facebook.com/rel=me><linkhref=https://linkedin.com/rel=me><linkhref=https://youtube.com/rel=me></head><bodyclass="flex flex-col h-screen px-6 m-auto text-lg leading-7 max-w-7xl bg-neutral text-neutral-900 dark:bg-neutral-800 dark:text-neutral sm:px-14 md:px-24 lg:px-32"><divid=the-topclass="absolute flex self-center"><aclass="px-3 py-1 text-sm -translate-y-8 rounded-b-lg bg-primary-200 focus:translate-y-0 dark:bg-neutral-600"href=#main-content><spanclass="font-bold pe-2 text-primary-600 dark:text-primary-400">↓</span>Skip to main content</a></div><headerclass="py-6 font-semibold text-neutral-900 dark:text-neutral print:hidden sm:py-10"><navclass="flex items-start justify-between sm:items-center"><divclass="flex flex-row items-center"><aclass="decoration-primary-500 hover:underline hover:decoration-2 hover:underline-offset-2"rel=mehref=/congo/>Congo</a></div><ulclass="flex list-none flex-col ltr:text-right rtl:text-left sm:flex-row"><liclass="group mb-1 sm:mb-0 sm:me-7 sm:last:me-0.5"><ahref=/congo/docs/title=Documentation><spanclass="decoration-primary-500 group-hover:underline group-hover:decoration-2 group-hover:underline-offset-2">Docs</span></a></li><liclass="group mb-1 sm:mb-0 sm:me-7 sm:last:me-0.5"><ahref=/congo/samples/title="Content Samples"><spanclass="decoration-primary-500 group-hover:underline group-hover:decoration-2 group-hover:underline-offset-2">Samples</span></a></li><liclass="group mb-1 sm:mb-0 sm:me-7 sm:last:me-0.5"><ahref=/congo/users/title=Users><spanclass="decoration-primary-500 group-hover:underline group-hover:decoration-2 group-hover:underline-offset-2">Users</span></a></li><liclass="group mb-1 sm:mb-0 sm:me-7 sm:last:me-0.5"><ahref=https://github.com/jpanther/congotitletarget=_blank><spanclass="group-dark:hover:text-primary-400 transition-colors group-hover:text-primary-600"><spanclass="relative inline-block align-text-bottom icon"><svgxmlns="http://www.w3.org/2000/svg"viewBox="0 0 496 512"><pathfill="currentcolor"d="M165.9397.4c02-2.33.6-5.23.6-3.3.3-5.6-1.3-5.6-3.6.0-22.3-3.65.2-3.63-.35.61.35.63.6zm-31.1-4.5c-.721.34.34.34.92.615.6.06.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.22.3zm44.2-1.7c-2.9.7-4.92.6-4.64.9.322.93.35.92.62.9-.74.9-2.64.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.88C106.180113.3.0252c0110.969.8205.8169.5239.212.82.317.3-5.617.3-12.1.0-6.2-.3-40.4-.3-61.4.0.0-7015-84.7-29.8.0.0-11.4-29.1-27.8-36.6.0.0-22.9-15.71.6-15.4.0.024.9238.625.821.938.658.627.572.920.92.3-168.8-27.116-33.7-55.9-6.2-112.3-14.3-112.3-110.5.0-27.57.6-41.323.6-58.9-2.6-6.5-11.1-33.32.6-67.920.9-6.56927692720-5.641.5-8.562.8-8.5s42.82.962.88.5c0048.1-33.669-2713.734.75.261.42.667.91617.725.831.525.858.9.096.5-58.9104.2-114.8110.59.27.91722.91746.4.033.7-.375.4-.383.6.06.54.614.417.312.1C428.2457.8496362.9496252496113.3383.58244.88zM97.2352.9c-1.31-13.3.75.21.61.63.92.35.211.3-11-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.71.3.32.92.33.91.613.6.74.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.435.6c-1.61.3-14.31.36.22.32.35.22.66.511.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.61-1.63.6.05.91.62.34.33.35.62.31.6-1.31.6-3.9.0-6.2-1.4-2.3
<spanclass="group-dark:hover:text-primary-400 transition-colors group-hover:text-primary-600"><spanclass="relative inline-block align-text-bottom icon"><svgaria-hidden="true"focusable="false"data-prefix="fas"data-icon="search"class="svg-inline--fa fa-search fa-w-16"role="img"xmlns="http://www.w3.org/2000/svg"viewBox="0 0 512 512"><pathfill="currentcolor"d="M505 442.7 405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9.0 208 0S0 93.1.0 208s93.1 208 208 208c48.3.0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9.0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7.0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7.0 128 57.2 128 128 0 70.7-57.2 128-128 128z"/></svg></span></span><spanclass="decoration-primary-500 group-hover:underline group-hover:decoration-2 group-hover:underline-offset-2"></span></button></li></ul></nav></header><divclass="relative flex flex-col grow"><mainid=main-contentclass=grow><header><olclass="text-sm text-neutral-500 dark:text-neutral-400 print:hidden"><liclass="inline hidden"><aclass="hover:underline decoration-neutral-300 dark:underline-neutral-600"href=/congo/>Welcome to Congo! :tada:</a><spanclass="px-1 text-primary-500">/</span></li><liclass="inline hidden"><aclass="hover:underline decoration-neutral-300 dark:underline-neutral-600"href=/congo/docs/>Documentation</a><spanclass="px-1 text-primary-500">/</span></li></ol><h1class="mt-0 text-4xl font-extrabold text-neutral-900 dark:text-neutral">Documentation</h1></header><sectionclass="mt-0 prose flex max-w-full flex-col dark:prose-invert lg:flex-row"><divclass="min-w-0 min-h-0 max-w-prose grow"><divclass="lead !mb-9 text-xl">Simple, yet powerful. Learn how to use Congo and its features.</div><p><figure><imgclass="mx-auto my-0 rounded-md"srcset="/congo/docs/screenshot_huf6d0e0a2859ba579263d522407d5f5ad_1218668_330x0_resize_box_3.png 330w,/congo/docs/screenshot_huf6d0e0a2859ba579263d522407d5f5ad_1218668_660x0_resize_box_3.png 660w,/congo/docs/screenshot_huf6d0e0a2859ba579263d522407d5f5ad_1218668_1024x0_resize_box_3.png 1024w,/congo/docs/screenshot_huf6d0e0a2859ba579263d522407d5f5ad_1218668_1320x0_resize_box_3.png 2x"src=/congo/docs/screenshot_huf6d0e0a2859ba579263d522407d5f5ad_1218668_660x0_resize_box_3.pngalt="Screenshots of Congo on an iPhone, iPad and MacBook"></figure></p><p>This section contains everything you need to know about Congo. If you’re new, check out the <ahref=https://jpanther.github.io/congo/docs/installation/>Installation</a> guide to begin or visit the <ahref=https://jpanther.github.io/congo/samples/>Samples</a> section to see what Congo can do.</p><p><em>Special thanks to <ahref=https://ninalimpi.comtarget=_blankrel="noreferrer noopener">Katerina Limpitsouni</a> for the excellent illustrations that are used throughout these docs!</em></p><hr></div></section><section><articleclass="mt-6 flex max-w-prose flex-row"><divclass="flex-none pe-4 sm:pe-6"><ahref=/congo/docs/version-2/aria-label="What's New in 2.0 ✨"><imgaltclass="w-24max-w-[6rem]max-h-[4.5rem]rounded-mdsm:max-h-[7.5rem]sm:w-40
sm:max-w-[10rem]" src=/congo/docs/version-2/thumb-online-party.svg></a></div><div><h3class="flex items-center text-xl font-semibold"><aclass="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"href=/congo/docs/version-2/>What's New in 2.0 ✨</a></h3><divclass="text-sm text-neutral-500 dark:text-neutral-400"><divclass="flex flex-row flex-wrap items-center"><spantitle="Reading time">4 mins</span></div></div><divclass="prose py-1 dark:prose-invert">Version 2 takes Congo to new heights, making the theme even more powerful while still maintaining its lightweight footprint.</div></div></article><articleclass="mt-6 flex max-w-prose flex-row"><divclass="flex-none pe-4 sm:pe-6"><ahref=/congo/docs/installation/aria-label=Installation><imgaltclass="w-24max-w-[6rem]max-h-[4.5rem]rounded-mdsm:max-h-[7.5rem]sm:w-40
sm:max-w-[10rem]" src=/congo/docs/installation/thumb-cloud-files.svg></a></div><div><h3class="flex items-center text-xl font-semibold"><aclass="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"href=/congo/docs/installation/>Installation</a></h3><divclass="text-sm text-neutral-500 dark:text-neutral-400"><divclass="flex flex-row flex-wrap items-center"><spantitle="Reading time">5 mins</span></div></div><divclass="prose py-1 dark:prose-invert">Learn how to get up and running using Hugo and Congo from a completely blank state. It’s the best place to start if you’re a new user.</div></div></article><articleclass="mt-6 flex max-w-prose flex-row"><divclass="flex-none pe-4 sm:pe-6"><ahref=/congo/docs/getting-started/aria-label="Getting Started"><imgaltclass="w-24max-w-[6rem]max-h-[4.5rem]rounded-mdsm:max-h-[7.5rem]sm:w-40
sm:max-w-[10rem]" src=/congo/docs/getting-started/thumb-choose.svg></a></div><div><h3class="flex items-center text-xl font-semibold"><aclass="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"href=/congo/docs/getting-started/>Getting Started</a></h3><divclass="text-sm text-neutral-500 dark:text-neutral-400"><divclass="flex flex-row flex-wrap items-center"><spantitle="Reading time">7 mins</span></div></div><divclass="prose py-1 dark:prose-invert">This section assumes you have already installed the Congo theme and are ready to start with basic configuration tasks like selecting a colour scheme, menu and content structure.</div></div></article><articleclass="mt-6 flex max-w-prose flex-row"><divclass="flex-none pe-4 sm:pe-6"><ahref=/congo/docs/configuration/aria-label=Configuration><imgaltclass="w-24max-w-[6rem]max-h-[4.5rem]rounded-mdsm:max-h-[7.5rem]sm:w-40
sm:max-w-[10rem]" src=/congo/docs/configuration/thumb-setup.svg></a></div><div><h3class="flex items-center text-xl font-semibold"><aclass="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"href=/congo/docs/configuration/>Configuration</a></h3><divclass="text-sm text-neutral-500 dark:text-neutral-400"><divclass="flex flex-row flex-wrap items-center"><spantitle="Reading time">11 mins</span></div></div><divclass="prose py-1 dark:prose-invert">Discover all the site, language and theme configurations that are available in Congo and how they can be used to customise your project.</div></div></article><articleclass="mt-6 flex max-w-prose flex-row"><divclass="flex-none pe-4 sm:pe-6"><ahref=/congo/docs/homepage-layout/aria-label="Homepage Layout"><imgaltclass="w-24max-w-[6rem]max-h-[4.5rem]rounded-mdsm:max-h-[7.5rem]sm:w-40
sm:max-w-[10rem]" src=/congo/docs/homepage-layout/thumb-heatmap.svg></a></div><div><h3class="flex items-center text-xl font-semibold"><aclass="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"href=/congo/docs/homepage-layout/>Homepage Layout</a></h3><divclass="text-sm text-neutral-500 dark:text-neutral-400"><divclass="flex flex-row flex-wrap items-center"><spantitle="Reading time">3 mins</span></div></div><divclass="prose py-1 dark:prose-invert">Congo provides a fully flexible homepage layout with built-in templates and the ability to provide your own.</div></div></article><articleclass="mt-6 flex max-w-prose flex-row"><divclass="flex-none pe-4 sm:pe-6"><ahref=/congo/docs/front-matter/aria-label="Front Matter"><imgaltclass="w-24max-w-[6rem]max-h-[4.5rem]rounded-mdsm:max-h-[7.5rem]sm:w-40
sm:max-w-[10rem]" src=/congo/docs/front-matter/thumb-file-analysis.svg></a></div><div><h3class="flex items-center text-xl font-semibold"><aclass="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"href=/congo/docs/front-matter/>Front Matter</a></h3><divclass="text-sm text-neutral-500 dark:text-neutral-400"><divclass="flex flex-row flex-wrap items-center"><spantitle="Reading time">3 mins</span></div></div><divclass="prose py-1 dark:prose-invert">While supporting most Hugo defaults, Congo adds a number of front matter parameters to customise the presentation of individual articles.</div></div></article><articleclass="mt-6 flex max-w-prose flex-row"><divclass="flex-none pe-4 sm:pe-6"><ahref=/congo/docs/shortcodes/aria-label=Shortcodes><imgaltclass="w-24max-w-[6rem]max-h-[4.5rem]rounded-mdsm:max-h-[7.5rem]sm:w-40
sm:max-w-[10rem]" src=/congo/docs/shortcodes/thumb-website-builder.svg></a></div><div><h3class="flex items-center text-xl font-semibold"><aclass="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"href=/congo/docs/shortcodes/>Shortcodes</a></h3><divclass="text-sm text-neutral-500 dark:text-neutral-400"><divclass="flex flex-row flex-wrap items-center"><spantitle="Reading time">5 mins</span></div></div><divclass="prose py-1 dark:prose-invert">Congo includes several shortcodes for adding rich content to articles including images, charts, diagrams, buttons and more.</div></div></article><articleclass="mt-6 flex max-w-prose flex-row"><divclass="flex-none pe-4 sm:pe-6"><ahref=/congo/docs/partials/aria-label=Partials><imgaltclass="w-24max-w-[6rem]max-h-[4.5rem]rounded-mdsm:max-h-[7.5rem]sm:w-40
sm:max-w-[10rem]" src=/congo/docs/partials/thumb-charts.svg></a></div><div><h3class="flex items-center text-xl font-semibold"><aclass="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"href=/congo/docs/partials/>Partials</a></h3><divclass="text-sm text-neutral-500 dark:text-neutral-400"><divclass="flex flex-row flex-wrap items-center"><spantitle="Reading time">4 mins</span></div></div><divclass="prose py-1 dark:prose-invert">Partials are used to add special functionality to the theme including analytics, comments, favicons, custom scripts and more.</div></div></article><articleclass="mt-6 flex max-w-prose flex-row"><divclass="flex-none pe-4 sm:pe-6"><ahref=/congo/docs/content-examples/aria-label="Content Examples"><imgaltclass="w-24max-w-[6rem]max-h-[4.5rem]rounded-mdsm:max-h-[7.5rem]sm:w-40
sm:max-w-[10rem]" src=/congo/docs/content-examples/thumb-inspiration.svg></a></div><div><h3class="flex items-center text-xl font-semibold"><aclass="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"href=/congo/docs/content-examples/>Content Examples</a></h3><divclass="text-sm text-neutral-500 dark:text-neutral-400"><divclass="flex flex-row flex-wrap items-center"><spantitle="Reading time">10 mins</span></div></div><divclass="prose py-1 dark:prose-invert">It’s time to bring everything together with some examples that demonstrate how content should be created and structured.</div></div></article><articleclass="mt-6 flex max-w-prose flex-row"><divclass="flex-none pe-4 sm:pe-6"><ahref=/congo/docs/advanced-customisation/aria-label="Advanced Customisation"><imgaltclass="w-24max-w-[6rem]max-h-[4.5rem]rounded-mdsm:max-h-[7.5rem]sm:w-40
sm:max-w-[10rem]" src=/congo/docs/advanced-customisation/thumb-static-website.svg></a></div><div><h3class="flex items-center text-xl font-semibold"><aclass="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"href=/congo/docs/advanced-customisation/>Advanced Customisation</a></h3><divclass="text-sm text-neutral-500 dark:text-neutral-400"><divclass="flex flex-row flex-wrap items-center"><spantitle="Reading time">8 mins</span></div></div><divclass="prose py-1 dark:prose-invert">Congo supports advanced customisations that include modifying the underlying Tailwind configuration, building the theme manually and providing custom CSS.</div></div></article><articleclass="mt-6 flex max-w-prose flex-row"><divclass="flex-none pe-4 sm:pe-6"><ahref=/congo/docs/hosting-deployment/aria-label="Hosting & Deployment"><imgaltclass="w-24max-w-[6rem]max-h-[4.5rem]rounded-mdsm:max-h-[7.5rem]sm:w-40
