mirror of https://github.com/jpanther/congo.git
204 lines
15 KiB
HTML
204 lines
15 KiB
HTML
<!doctype html><html lang=en-au><head>
|
|
<meta charset=utf-8>
|
|
<meta http-equiv=content-language content="en-AU">
|
|
<meta name=viewport content="width=device-width,initial-scale=1">
|
|
<meta http-equiv=x-ua-compatible content="ie=edge">
|
|
<title>Installation · Congo</title>
|
|
<meta name=title content="Installation · Congo">
|
|
<meta name=description content="How to install the Congo theme.">
|
|
<link rel=canonical href=https://jpanther.github.io/congo/docs/installation/>
|
|
<link type=text/css rel=stylesheet href=/congo/css/schemes/congo.min.b48d6ba061dc77186a2524fb8aac5ac3823b2679a9299ca60325abbccc9c1764c884715f0ba24b4e2776cb3814df4af1f4c854b87207cd5d4c7a254da9b55751.css integrity="sha512-tI1roGHcdxhqJST7iqxaw4I7JnmpKZymAyWrvMycF2TIhHFfC6JLTid2yzgU30rx9MhUuHIHzV1MeiVNqbVXUQ==">
|
|
<link type=text/css rel=stylesheet href=/congo/css/compiled/main.min.ea854f5324e6f022fce8a455002c667df804536940ec2e12411e4a8cab77790e8403bc0acc8feb64a7f08e3cac0e869a37f8cba59650d1fe3f3e83fe54a49c8a.css integrity="sha512-6oVPUyTm8CL86KRVACxmffgEU2lA7C4SQR5KjKt3eQ6EA7wKzI/rZKfwjjysDoaaN/jLpZZQ0f4/PoP+VKScig==">
|
|
<link rel=apple-touch-icon sizes=180x180 href=/congo/apple-touch-icon.png>
|
|
<link rel=icon type=image/png sizes=32x32 href=/congo/favicon-32x32.png>
|
|
<link rel=icon type=image/png sizes=16x16 href=/congo/favicon-16x16.png>
|
|
<link rel=manifest href=/congo/site.webmanifest>
|
|
<meta property="og:title" content="Installation">
|
|
<meta property="og:description" content="How to install the Congo theme.">
|
|
<meta property="og:type" content="article">
|
|
<meta property="og:url" content="https://jpanther.github.io/congo/docs/installation/"><meta property="article:section" content="docs">
|
|
<meta property="article:published_time" content="2020-08-16T00:00:00+00:00">
|
|
<meta property="article:modified_time" content="2020-08-16T00:00:00+00:00">
|
|
<meta name=twitter:card content="summary">
|
|
<meta name=twitter:title content="Installation">
|
|
<meta name=twitter:description content="How to install the Congo theme.">
|
|
<script type=application/ld+json>{"@context":"https://schema.org","@type":"BlogPosting","articleSection":"Documentation","name":"Installation","headline":"Installation","description":"How to install the Congo theme.","inLanguage":"en-AU","author":{"@type":"Person","name":"Congo"},"creator":{"@type":"Person","name":"Congo"},"copyrightHolder":"Congo","copyrightYear":"2020","dateCreated":"2020-08-16T00:00:00\u002b00:00","datePublished":"2020-08-16T00:00:00\u002b00:00","dateModified":"2020-08-16T00:00:00\u002b00:00","url":"https:\/\/jpanther.github.io\/congo\/docs\/installation\/","wordCount":"564","keywords":["installation","docs"]}</script>
|
|
<meta name=generator content="Hugo 0.87.0">
|
|
<meta name=author content="Congo">
|
|
<link href=https://twitter.com/ rel=me>
|
|
<link href=https://facebook.com/ rel=me>
|
|
<link href=https://linkedin.com/ rel=me>
|
|
<link href=https://youtube.com/ rel=me>
|
|
</head>
|
|
<body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-neutral text-neutral-900 sm:px-14 md:px-24 lg:px-32 dark:bg-neutral-800 dark:text-neutral max-w-7xl"><header class="flex justify-between py-6 font-semibold sm:py-10 text-neutral-800 dark:text-neutral">
|
|
<div>
|
|
<a class="hover:underline hover:underline-primary-500 hover:underline-thickness-bold hover:underline-offset-small" rel=me href=/congo/>Congo</a>
|
|
</div>
|
|
<nav>
|
|
<ul class="flex flex-col list-none sm:flex-row">
|
|
<li class="mb-1 text-right sm:mb-0 sm:mr-7 sm:last:mr-0">
|
|
<a class="hover:underline hover:underline-primary-500 hover:underline-thickness-bold hover:underline-offset-small" href=/congo/docs/ title=Documentation>Docs</a>
|
|
</li>
|
|
<li class="mb-1 text-right sm:mb-0 sm:mr-7 sm:last:mr-0">
|
|
<a class="hover:underline hover:underline-primary-500 hover:underline-thickness-bold hover:underline-offset-small" href=/congo/samples/ title="Content Samples">Samples</a>
|
|
</li>
|
|
<li class="mb-1 text-right sm:mb-0 sm:mr-7 sm:last:mr-0">
|
|
<a class="hover:underline hover:underline-primary-500 hover:underline-thickness-bold hover:underline-offset-small" href=/congo/users/ title=Users>Users</a>
|
|
</li>
|
|
<li class="mb-1 text-right sm:mb-0 sm:mr-7 sm:last:mr-0">
|
|
<a class="hover:underline hover:underline-primary-500 hover:underline-thickness-bold hover:underline-offset-small" href=https://github.com/jpanther/congo title>GitHub</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
<main class=flex-grow>
|
|
<article class=max-w-prose>
|
|
<header>
|
|
<ol class="text-sm text-neutral-400 dark:text-neutral-500">
|
|
<li class="inline hidden">
|
|
<a class="hover:underline hover:underline-neutral-300 dark:underline-neutral-600" href=/congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
|
|
</li>
|
|
<li class=inline>
|
|
<a class="hover:underline hover:underline-neutral-300 dark:underline-neutral-600" href=/congo/docs/>Documentation</a><span class="px-1 text-primary-500">/</span>
|
|
</li>
|
|
<li class="inline hidden">
|
|
<a class="hover:underline hover:underline-neutral-300 dark:underline-neutral-600" href=/congo/docs/installation/>Installation</a><span class="px-1 text-primary-500">/</span>
|
|
</li>
|
|
</ol>
|
|
<h1 class="mt-0 text-4xl font-extrabold text-neutral-800 dark:text-neutral">
|
|
Installation
|
|
</h1>
|
|
<div class="mt-8 mb-12 text-base text-neutral-400 dark:text-neutral-500">
|
|
<div class="flex flex-row items-center">
|
|
<span title="Reading time">3 mins</span><span class="px-2 text-primary-500">·</span>
|
|
<span class=mb-[2px]>
|
|
<a href=https://github.com/jpanther/congo/tree/dev/exampleSite/content/docs/installation.md class="text-lg hover:text-primary-500" rel="noopener noreferrer" target=_blank title="Edit content"><span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="far" data-icon="edit" class="svg-inline--fa fa-edit fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentcolor" d="M402.3 344.9l32-32c5-5 13.7-1.5 13.7 5.7V464c0 26.5-21.5 48-48 48H48c-26.5.0-48-21.5-48-48V112c0-26.5 21.5-48 48-48h273.5c7.1.0 10.7 8.6 5.7 13.7l-32 32c-1.5 1.5-3.5 2.3-5.7 2.3H48v352h352V350.5c0-2.1.8-4.1 2.3-5.6zm156.6-201.8L296.3 405.7l-90.4 10c-26.2 2.9-48.5-19.2-45.6-45.6l10-90.4L432.9 17.1c22.9-22.9 59.9-22.9 82.7.0l43.2 43.2c22.9 22.9 22.9 60 .1 82.8zM460.1 174 402 115.9 216.2 301.8l-7.3 65.3 65.3-7.3L460.1 174zm64.8-79.7-43.2-43.2c-4.1-4.1-10.8-4.1-14.8.0L436 82l58.1 58.1 30.9-30.9c4-4.2 4-10.8-.1-14.9z"/></svg>
|
|
</span>
|
|
</a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<section class="prose dark:prose-light">
|
|
<p>Simply follow the standard Hugo <a href=https://gohugo.io/getting-started/quick-start/>Quick Start</a> procedure to get up and running quickly.</p>
|
|
<p>Detailed instructions can be found below.</p>
|
|
<h2 id=install-hugo>Install Hugo <a class=heading-anchor href=#install-hugo aria-label=Anchor>#</a></h2>
|
|
<p>You can find specific instructions for your platform in the official <a href=https://gohugo.io/getting-started/installing.>Hugo docs</a>.</p>
|
|
<p>Make sure you are using <strong>Hugo version 0.86.1</strong> or later as the theme takes advantage of some of the latest Hugo features.</p>
|
|
<h2 id=create-a-new-site>Create a new site <a class=heading-anchor href=#create-a-new-site aria-label=Anchor>#</a></h2>
|
|
<p>Run the command <code>hugo new site mywebsite</code> to create a new Hugo site in a folder named <code>mywebsite</code>.</p>
|
|
<h2 id=download-the-congo-theme>Download the Congo theme <a class=heading-anchor href=#download-the-congo-theme aria-label=Anchor>#</a></h2>
|
|
<p>There are a couple of ways to install the Congo theme into your Hugo website. The Hugo Modules method is the easiest, then the git method if you’re familiar with submodules, but you can also download and install manually if you don’t have <code>go</code> or <code>git</code> available.</p>
|
|
<h3 id=install-using-hugo>Install using Hugo <a class=heading-anchor href=#install-using-hugo aria-label=Anchor>#</a></h3>
|
|
<p>This method is the quickest and easiest for keeping the theme up-to-date. Hugo Modules uses Go to initialise and manage modules so you need to ensure you have Go installed before proceeding.</p>
|
|
<ol>
|
|
<li>
|
|
<p><a href=https://golang.org/dl/>Download</a> and install Go. You can check if it’s already installed by using the command <code>go version</code>.</p>
|
|
</li>
|
|
<li>
|
|
<p>From your Hugo project’s directory, initiate the Hugo Modules system for your website:</p>
|
|
<div class=highlight><pre tabindex=0 class=chroma><code class=language-shell data-lang=shell><span class=c1># If you're managing your project on GitHub</span>
|
|
hugo mod init github.com/<username>/<repo-name>
|
|
|
|
<span class=c1># If you're managing your project locally</span>
|
|
hugo mod init my-project
|
|
</code></pre></div></li>
|
|
<li>
|
|
<p>Add the theme to your configuration by creating a new file <code>config/_default/module.toml</code> and adding the following:</p>
|
|
<div class=highlight><pre tabindex=0 class=chroma><code class=language-toml data-lang=toml><span class=p>[[</span><span class=nx>imports</span><span class=p>]]</span>
|
|
<span class=nx>path</span> <span class=p>=</span> <span class=s2>"github.com/jpanther/congo"</span>
|
|
</code></pre></div></li>
|
|
<li>
|
|
<p>Start your server using <code>hugo server</code> and the theme will be downloaded automatically.</p>
|
|
</li>
|
|
<li>
|
|
<p>Continue to <a href=#set-up-theme-configuration-files>set up the theme configuration files</a>.</p>
|
|
</li>
|
|
</ol>
|
|
<h3 id=install-using-git>Install using git <a class=heading-anchor href=#install-using-git aria-label=Anchor>#</a></h3>
|
|
<p>Change into the directory for your Hugo website, initialise a new repository and add Congo as a submodule.</p>
|
|
<div class=highlight><pre tabindex=0 class=chroma><code class=language-bash data-lang=bash><span class=nb>cd</span> mywebsite
|
|
git init
|
|
git submodule add -b stable https://github.com/jpanther/congo.git themes/congo
|
|
</code></pre></div><div class="flex px-4 py-3 rounded-md bg-primary-100 dark:bg-primary-900">
|
|
<span class="pr-3 text-primary-400">
|
|
<span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="exclamation-triangle" class="svg-inline--fa fa-exclamation-triangle fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentcolor" d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937.0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154.0l239.94 416.028zM288 354c-25.405.0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346 7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373.0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884.0-12.356 5.78-11.981 12.654z"/></svg>
|
|
</span>
|
|
</span>
|
|
<span class="no-prose dark:text-neutral-300"><strong>Note:</strong> You need to substitute <code>mywebsite</code> for the correct folder name you used when creating your Hugo site.</span>
|
|
</div>
|
|
<p>Then continue to <a href=#set-up-theme-configuration-files>set up the theme configuration files</a>.</p>
|
|
<h3 id=install-manually>Install manually <a class=heading-anchor href=#install-manually aria-label=Anchor>#</a></h3>
|
|
<ol>
|
|
<li>
|
|
<p>Download the latest release of the theme source code.</p>
|
|
<a class="px-4 py-2 !text-neutral !no-underline !rounded-md bg-primary-600 hover:!bg-primary-500 dark:bg-primary-800 dark:hover:!bg-primary-700" href=https://github.com/jpanther/congo/releases/latest target=_blank role=button>
|
|
Download from Github
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<p>Extract the archive, rename the folder to <code>congo</code> and move it to the <code>themes/</code> directory inside your Hugo project’s root folder.</p>
|
|
</li>
|
|
<li>
|
|
<p>Continue to <a href=#set-up-theme-configuration-files>set up the theme configuration files</a>.</p>
|
|
</li>
|
|
</ol>
|
|
<h2 id=set-up-theme-configuration-files>Set up theme configuration files <a class=heading-anchor href=#set-up-theme-configuration-files aria-label=Anchor>#</a></h2>
|
|
<p>In the root folder of your website, delete the <code>config.toml</code> file that was generated by Hugo. Copy the <code>*.toml</code> config files from the theme into your <code>config/_default/</code> folder. If you installed using Hugo Modules, you should not copy the <code>module.toml</code> file! This will ensure you have all the correct theme settings and will enable you to easily customise the theme.</p>
|
|
<p>Depending on how you installed the theme you will find the theme config files in different places:</p>
|
|
<ul>
|
|
<li><strong>Hugo Modules:</strong> In the Hugo cache directory, or <a href="https://minhaskamal.github.io/DownGit/#/home?url=https://github.com/jpanther/congo/tree/stable/config/_default">download a copy</a> from GitHub</li>
|
|
<li><strong>Git submodule or Manual install:</strong> <code>themes/congo/config/_default</code></li>
|
|
</ul>
|
|
<p>Once you’ve copied the files, your config folder should look like this:</p>
|
|
<div class=highlight><pre tabindex=0 class=chroma><code class=language-shell data-lang=shell>config/_default/
|
|
├─ config.toml
|
|
├─ markup.toml
|
|
├─ menus.toml
|
|
├─ module.toml <span class=c1># if you installed using Hugo Modules</span>
|
|
└─ params.toml
|
|
</code></pre></div><div class="flex px-4 py-3 rounded-md bg-primary-100 dark:bg-primary-900">
|
|
<span class="pr-3 text-primary-400">
|
|
<span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="exclamation-triangle" class="svg-inline--fa fa-exclamation-triangle fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentcolor" d="M569.517 440.013C587.975 472.007 564.806 512 527.94 512H48.054c-36.937.0-59.999-40.055-41.577-71.987L246.423 23.985c18.467-32.009 64.72-31.951 83.154.0l239.94 416.028zM288 354c-25.405.0-46 20.595-46 46s20.595 46 46 46 46-20.595 46-46-20.595-46-46-46zm-43.673-165.346 7.418 136c.347 6.364 5.609 11.346 11.982 11.346h48.546c6.373.0 11.635-4.982 11.982-11.346l7.418-136c.375-6.874-5.098-12.654-11.982-12.654h-63.383c-6.884.0-12.356 5.78-11.981 12.654z"/></svg>
|
|
</span>
|
|
</span>
|
|
<span class="no-prose dark:text-neutral-300"><strong>Important:</strong> If you didn’t use Hugo Modules to install Congo, you must add the line <code>theme = "congo"</code> to the top of your <code>config.toml</code> file.</span>
|
|
</div>
|
|
<p>You’re now all set up to use Congo. From here you can add some content and start the Hugo server.</p>
|
|
<p>Refer to the Hugo docs for more information or read the next section to learn more about configuring the theme.</p>
|
|
</section>
|
|
<footer class=pt-8>
|
|
<div class="pt-8 article-pagination">
|
|
<hr class="border-dotted border-neutral-300 dark:border-neutral-600">
|
|
<div class="flex justify-between pt-3">
|
|
<span>
|
|
</span>
|
|
<span>
|
|
<a class="flex text-right" href=/congo/docs/getting-started/>
|
|
<span class="flex flex-col">
|
|
<span class=article-pagination-title>Getting Started</span>
|
|
<span class="-mt-1 text-xs text-neutral-400 dark:text-neutral-500">
|
|
</span>
|
|
</span>
|
|
<span class="ml-3 article-pagination-direction">→</span>
|
|
</a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</article>
|
|
</main><footer class="py-10 text-sm">
|
|
<p class="text-neutral-400 dark:text-neutral-500">
|
|
©
|
|
2021
|
|
Congo
|
|
</p>
|
|
<p class="text-xs text-neutral-300 dark:text-neutral-600">
|
|
Powered by
|
|
<a class="hover:underline hover:underline-primary-300 hover:text-primary-400" href=https://gohugo.io/ target=_blank rel="noopener noreferrer">Hugo</a>
|
|
&
|
|
<a class="hover:underline hover:underline-primary-300 hover:text-primary-400" href=https://git.io/hugo-congo target=_blank rel="noopener noreferrer">Congo</a>
|
|
</p>
|
|
</footer>
|
|
</body>
|
|
</html> |