,/congo/docs/screenshot_huf6d0e0a2859ba579263d522407d5f5ad_1218668_1320x0_resize_q75_h2_box_3.webp 1320w" sizes=100vw type=image/webp><imgwidth=1500height=1000class="mx-auto my-0 rounded-md"alt="Screenshots of Congo on an iPhone, iPad and MacBook"loading=lazydecoding=asyncsrc=/congo/docs/screenshot_huf6d0e0a2859ba579263d522407d5f5ad_1218668_660x0_resize_box_3.pngsrcset="/congo/docs/screenshot_huf6d0e0a2859ba579263d522407d5f5ad_1218668_330x0_resize_box_3.png330w,/congo/docs/screenshot_huf6d0e0a2859ba579263d522407d5f5ad_1218668_660x0_resize_box_3.png660w
,/congo/docs/screenshot_huf6d0e0a2859ba579263d522407d5f5ad_1218668_1320x0_resize_box_3.png 1320w" sizes=100vw></picture></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/samples/>Samples</a> section to see what Congo can do.</p><p><em>Special thanks to
<ahref=https://ninalimpi.comtarget=_blankrel=noreferrer>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 loading=lazy></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 loading=lazy></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 loading=lazy></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 loading=lazy></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">12 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 loading=lazy></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 loading=lazy></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 loading=lazy></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 loading=lazy></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 loading=lazy></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 loading=lazy></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