add yesterdays and todays posts

This commit is contained in:
2026-02-23 01:10:21 -07:00
parent aae7d716a2
commit a47a28e074
118 changed files with 5101 additions and 135 deletions
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,49 @@
---
title: "Lorem Ipsum"
date: 2021-04-15T23:39:49+05:30
tags: ["xyz", "def"]
type: "post"
image: "/images/lorem-ipsum/quick-fox.png"
showTableOfContents: false
---
# Heading 1
"Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
This continues at length and variously. The text is not really Greek, but badly garbled Latin. It started life as extracted phrases from sections 1.10.32 and 1.10.33 of Cicero's "De Finibus Bonorum et Malorum" ("The Extremes of Good and Evil"), which read:
## Heading 2
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.
### Heading 3
"Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
This continues at length and variously. The text is not really Greek, but badly garbled Latin. It started life as extracted phrases from sections 1.10.32 and 1.10.33 of Cicero's "De Finibus Bonorum et Malorum" ("The Extremes of Good and Evil"), which read:
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
#### Heading 4
At ver
"Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
This continues at length and variously. The text is not really Greek, but badly garbled Latin. It started life as extracted phrases from sections 1.10.32 and 1.10.33 of Cicero's "De Finibus Bonorum et Malorum" ("The Extremes of Good and Evil"), which read:
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
##### Heading 5
At ver
"Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
This continues at length and variously. The text is not really Greek, but badly garbled Latin. It started life as extracted phrases from sections 1.10.32 and 1.10.33 of Cicero's "De Finibus Bonorum et Malorum" ("The Extremes of Good and Evil"), which read:
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
At ver
@@ -0,0 +1,128 @@
---
title: "Markdown Syntax Guide"
date: 2019-06-19
description: "Sample article showcasing basic Markdown syntax and formatting for HTML elements."
tags: ["markdown", "css", "html"]
type: post
weight: 20
showTableOfContents: true
---
This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.
# Headings
The following HTML `<h1>``<h6>` elements represent six levels of section headings. `<h1>` is the highest section level while `<h6>` is the lowest.
# H1
## H2
### H3
#### H4
##### H5
###### H6
## Paragraph
Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur? Quianimin porecus evelectur, cum que nis nust voloribus ratem aut omnimi, sitatur? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.
Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia is sinveli squiatum, core et que aut hariosam ex eat.
## Blockquotes
The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a `footer` or `cite` element, and optionally with in-line changes such as annotations and abbreviations.
### Blockquote without attribution
> Tiam, ad mint andaepu dandae nostion secatur sequo quae.
> **Note** that you can use *Markdown syntax* within a blockquote.
### Blockquote with attribution
> Don't communicate by sharing memory, share memory by communicating.
> — Rob Pike[^1]
[^1]: The above quote is excerpted from Rob Pike's [talk](https://www.youtube.com/watch?v=PAAkCSZUG1c) during Gopherfest, November 18, 2015.
## Tables
Tables aren't part of the core Markdown spec, but Hugo supports them out-of-the-box.
Name | Age
--------|------
Bob | 27
Alice | 23
### Inline Markdown within tables
| Italics | Bold | Code |
| -------- | -------- | ------ |
| *italics* | **bold** | `code` |
## Code Blocks
### Code block with backticks
```html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example HTML5 Document</title>
</head>
<body>
<p>Test</p>
</body>
</html>
```
### Code block indented with four spaces
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example HTML5 Document</title>
</head>
<body>
<p>Test</p>
</body>
</html>
### Code block with Hugo's internal highlight shortcode
{{< highlight html >}}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example HTML5 Document</title>
</head>
<body>
<p>Test</p>
</body>
</html>
{{< /highlight >}}
## List Types
### Ordered List
1. First item
2. Second item
3. Third item
### Unordered List
* List item
* Another item
* And another item
### Nested list
* Fruit
* Apple
* Orange
* Banana
* Dairy
* Milk
* Cheese
@@ -0,0 +1,398 @@
---
weight: 15
title: "Theme Documentation - Advanced"
date: 2020-05-06T21:29:01+08:00
description: "Discover how to maximise Gokarna's potential"
tags: ["installation", "configuration", "markdown"]
type: post
showTableOfContents: true
---
Gokarna is an opinionated theme with a focus on minimalism and simplicity.
## Content Types
This theme supports two types of content types: `post` and `page`. To specify them, you need to add them in your markdown metadata.
### Post
This is the default blog post type which will be shown in your "Posts" section and who's tags will be indexed. Basically, a normal blog post.
```markdown
---
title: "Hello, world!"
date: 2021-01-01
description: "A blog post"
image: "/path/to/image.png"
type: "post"
tags: ["blog"]
---
# Hello World!
This is my blog.
```
### Page
We introduced this type to distinguish between blog posts and normal markdown pages. The reason to create this was to give the user complete freedom in creating their website. You can use this to create a portfolio of your projects or showcase your designs. The possibilities are endless and the choice is yours.
```markdown
---
title: "Hello, world!"
image: "/path/to/image.png"
type: "page"
---
# Projects
Keep an eye on this space for my upcoming projects
```
### Table of Contents
To show `Table of Contents`, update your config by adding
```toml
[markup]
[markup.tableOfContents]
startLevel = 1
endLevel = 3
ordered = false
```
And then on each page add the attribute `showTableOfContents: true` **(Note: It is disabled by default)**
```markdown
---
title: "Hello, world!"
image: "/path/to/image.png"
type: "page"
showTableOfContents: true
---
```
Detailed configuration can be found on [Hugo's official documentation](https://gohugo.io/getting-started/configuration-markup/#table-of-contents)
## Weights
The `weight` attribute can be added in the markdown metadata for `post` types. We have an option in our hugo.toml: `params.showPostsOnHomePage` which allows you to:
1. Show popular posts on home page if the value is set to `popular`. It sorts the all the posts by it's weight attribute in ascending order.
2. Show recent posts on home page if the value is set to `recent`
3. Do not show anything if the variable is unset or an empty string.
## Homepage
### About description text
In extension to the basic configuration with the `description` field, it's also possible to write the about section using markdown.
Create a file called `_index.md` in the `content` directory and write your content there.
> **Attention**: Don't use frontmatter in this file. It would also render it.
```markdown
# Gokarna
Gokarna is a small temple town located in the Uttara Kannada district of Karnataka state in southern India.
## Beaches
Something about beaches, **which is *very* important**.
- every
- beach
- is beautiful
```
Having the above about section in place, results in the following homepage:
![Markdown about description](/images/theme-documentation-advanced/homepage-markdown-about-description.png "Markdown about description")
## Icons
Gokarna supports popular social media icons (Github, Linkedin, Twitter, StackOverflow, Dribbble, etc.) out of the box. See full list of supported icons [on GitHub](https://github.com/gokarna-theme/gokarna-hugo/tree/main/static/icons).
### Icons on homepage
To display icons on the homepage, simply update the `socialIcons` config param with a list of name and url of each icon. The specified `name` should exactly match one of the names from [the `icons` directory](https://github.com/gokarna-theme/gokarna-hugo/tree/main/static/svg/icons).
If you want to add more icons, you can download the svg directly from [Simple Icons' website](https://simpleicons.org/) and place them in your local icons directory (`/static/svg/icons/`)
```toml
[params]
socialIcons = [
{name = "twitter", url = "https://example.com"},
{name = "linkedin", url = "https://example.com"},
{name = "stackoverflow", url = "https://example.com"},
]
```
Preview:
![Icons on homepage Preview](/images/theme-documentation-advanced/icons-homepage-preview.png "Icons on homepage Preview")
### Icons in header
[Feather](https://feathericons.com) icons has a comprehensive list of icons which are more general purpose and not limited to social media.
Therefore, we use feather as an additional source of icons. Here is an example of how to add custom icons in the header using feather:
```toml
[[menu.main]]
identifier = "github"
url = "https://github.com"
weight = 3
# Using feather-icons
pre = "<span data-feather='github'></span>"
```
The same icon in this case could also be added without feather:
```toml
[[menu.main]]
identifier = "github"
url = "https://www.buymeacoffee.com/"
weight = 3
# Without using feather-icons
pre = "<img class='svg-inject' src='/icons/github.svg' />"
```
You can add `params` allowing menu link to open in a new tab, for example:
```toml
[[menu.main]]
identifier = "github"
url = "https://github.com/zerodahero"
weight = 4
# We use feather-icons: https://feathericons.com/
pre = "<span data-feather='github'></span>"
[menu.main.params]
newPage = true
```
## Custom Head and Footer HTML
The goal of this feature is to give the user more control over the theme. It's functioning is very straightforward - "You can inject any HTML you want in the `<head>` tag" . This may seem simple at first, but it opens up a lot of possibilities.
## Custom Comment HTML
Similar to custom head and footer HTML, you can add custom HTML for comments at the end of every post. Its in a `<div>` with the id `comments` which can be then customized with your external CSS.
The purpose of this is to freely use any comments platform of your choosing
### For example
```toml
customCommentHTML = """
<script src="https://utteranc.es/client.js"
repo="526avijitgupta/gokarna"
issue-term="title"
theme="github-dark"
crossorigin="anonymous"
async></script>
"""
```
### Bring your own scripts
Add your own JavaScript or CSS by putting them in the `static/` folder and importing them into your HTML.
```toml
[params]
customHeadHTML = '''
<script>console.log("Custom script or import");</script>
<script src="/js/custom.js"></script>
'''
customFooterHTML = '''
<div>Comment SDK Integration</div>
<script>console.log("Custom script or import");</script>
<script src="/js/custom.js"></script>
'''
```
### Analytics
Integration with any analytics tool: This was a personal pet peeve. User privacy is our primary concern and this meant not using Google Analytics or any of the popular tools.
We preferred privacy friendly tools like [Umami](https://umami.is/) & [Fathom Analytics](https://usefathom.com/), but the downside was that no theme supported them out of the box which led to either changing the theme source code or contributing supporting code to the original theme (both of which are good ways to extend the theme, but not our ideal choice)
Giving users the freedom to add anything in the HTML via hugo.toml seemed like an elegant way to solve the problem.
```toml
[params]
customHeadHTML = '''
<script async defer data-website-id="website-id" src="https://analytics.example.com/script.js"></script>
'''
```
### KaTeX
KaTeX is a math typesetting library for the web which lets you write beautiful equations. To use it, add the javascript as mentioned in [their documentation](https://katex.org/docs/browser.html) in our `params.customHeadHTML`.
```toml
[params]
customHeadHTML = '''
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.22/dist/katex.min.css" integrity="sha384-5TcZemv2l/9On385z///+d7MSYlvIEw9FuZTIdZ14vJLqWphw7e7ZPuOiCHJcFCP" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.22/dist/katex.min.js" integrity="sha384-cMkvdD8LoxVzGF/RPUKAcvmm49FQ0oxwDF3BGKtDXcEc+T1b2N+teh/OJfpU0jr6" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.22/dist/contrib/auto-render.min.js" integrity="sha384-hCXGrW6PitJEwbkoStFjeJxv+fSOOQKOPbJxSfM6G5sWZjAyWhXiTIIAmQqnlLlh" crossorigin="anonymous"
onload="renderMathInElement(document.body);"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
renderMathInElement(document.body, {
// customised options
// • auto-render specific keys, e.g.:
delimiters: [
{left: '$$', right: '$$', display: true},
{left: '$', right: '$', display: false},
],
// • rendering keys, e.g.:
throwOnError : false
});
});
</script>
'''
```
> Note: Make sure you use the latest version of KaTeX and use the correct script tags as described in [their documentation](https://katex.org/docs/browser.html)
Then the equation `$$y_t = \beta_0 + \beta_1 x_t + \epsilon_t$$` wrapped by double `$$` is displayed as:
$$y_t = \beta_0 + \beta_1 x_t + \epsilon_t$$
ihl equation `$y_t = \beta_0 + \beta_1 x_t + \epsilon_t$` wrapped by single `$` is displayed inline as $y_t = \beta_0 + \beta_1 x_t + \epsilon_t$.
### Comments
Integration with any comments SDK is possible. All you have to do is add the relevant HTML/JavaScript in the `customFooterHTML` param.
An example with commento:
```toml
[params]
customFooterHTML = '''
<div id="commento"></div>
<script defer src="{{ .Site.Params.CommentoURL }}/js/commento.js"></script>
<noscript>Please enable JavaScript to load the comments.</noscript>
'''
```
## Syntax Highlighting
Hugo lets you choose the color scheme for the codeblocks. You can choose from the options here: https://xyproto.github.io/splash/docs/all.html
After choosing your theme, just update the `pygmentsStyle` attribute in hugo.toml.
```toml
pygmentsStyle = "monokai"
```
You can read more about syntax highlighting on the [official hugo docs](https://gohugo.io/content-management/syntax-highlighting/).
## Site Metadata
Gokarna enables you to improve the SEO performance of your website with minimal effort.
### Image preview
We make sure your pages are social media ready.
![Social Media Preview](/images/theme-documentation-advanced/preview.png "Social Media Preview")
```markdown
---
title: "Hello, world!"
image: "/path/to/image.png"
---
```
> Note: If no image is specified in the markdown metadata, the site avatar is automatically used instead.
### SEO keywords
The keywords relevant for SEO are composed of the page `tags` as defined below:
```markdown
---
title: "Hello, world!"
tags: ["hello", "world"]
---
```
and the `metaKeywords` specified in the hugo.toml:
```markdown
[params]
metaKeywords = ["blog", "gokarna", "hugo"]
```
## Page title and H1
By default, Gokarna uses `.Title` for the `<title>` and `<h1>` elements, in addition to the OpenGraph (`og:title`) and Twitter (`twitter:title`) properties within `<meta>` elements.
```yaml
---
title: "8 Facts About Me - #7 Will Shock You!"
---
```
To define H1 separately from the page title, use the `h1` param in your front matter:
```yaml
---
title: "8 Facts About Me - #7 Will Shock You!"
h1: "8 Facts About Me"
---
```
## Hide tags, date or description of posts
Tags can be used to categorize posts (e.g.: Project or Blog), and be hidden on
the posts. Use the `params.hiddenTags` field in `hugo.toml`.
A post's date and description can be hidden if it has at least one tag listed in
`params.tagsHidePostDate` or `params.tagsHidePostDescription`, respectively.
```toml
[params]
[params.hidden]
tags = ["project", "blog"]
tagsPostDate = ["project"]
tagsPostDescription = ["project"]
[menu]
[[menu.main]]
identifier = "projects"
url = "/tags/project/"
name = "My Projects"
weight = 1
[[menu.main]]
identifier = "blog"
url = "/tags/blog/"
name = "Blog"
weight = 2
```
## Site-wide copyright notice
Define the [copyright notice for your site](https://gohugo.io/methods/site/copyright/). The notice will only be displayed on [page Kinds](#content-types).
For example, the following configuration in `hugo.toml` and front matter respectively...
```toml
copyright = "Verbatim copying and distribution of this entire article are permitted worldwide, without royalty, in any medium, provided this notice is preserved."
```
```
date: 2020-06-17
lastmod: 2024-02-05
```
Will produce this footer:
> © 2020-2024 The Marauders Verbatim copying and distribution of this entire article are permitted worldwide, without royalty, in any medium, provided this notice is preserved.
`copyright` can include [Markdown syntax](https://www.markdownguide.org/tools/hugo/). This is best used for including hyperlinks, emoji, or text formatting.
The years of `.Date` and `.Lastmod` are used to create a date range for your copyrighted material.
## Minification
`hugo`'s HTML output can be [minified](https://gohugo.io/hugo-pipes/minification/#usage), resulting in smaller files. This makes your site more performant (especially when paired with compression), and may confer a better [Google Lighthouse](https://pagespeed.web.dev/) score.
```toml
[minify]
minifyOutput = true
```
@@ -0,0 +1,345 @@
---
weight: 10
title: "Theme Documentation - Basics"
date: 2020-03-06T21:29:01+08:00
description: "A guide to getting started with Gokarna"
tags: ["installation", "configuration", "markdown"]
type: post
showTableOfContents: true
---
Gokarna is an opinionated theme with a focus on minimalism and simplicity.
## Installation
Follow these steps to initialize your new website.
If you are new to [Hugo](https://gohugo.io/), we suggest following this [great documentation for beginners](https://gohugo.io/getting-started/quick-start/).
### a. Create Your Project {#create-your-project}
Hugo provides a `new` subcommand to create a new website:
```bash
hugo new site my-website
cd my-website
```
### b. Install the Theme {#install-the-theme}
The theme's repository is: [https://github.com/gokarna-theme/gokarna-hugo](https://github.com/gokarna-theme/gokarna-hugo).
Make this repository a submodule of your Git project:
```bash
git init
git submodule add https://github.com/gokarna-theme/gokarna-hugo.git themes/gokarna
```
### c. Basic Configuration {#basic-configuration}
A simple Hugo [configuration file](https://gohugo.io/getting-started/configuration/#configuration-file) with [menu items](https://gohugo.io/content-management/menus/#properties-front-matter).
Gokarna supports [adding Feather icons to the header](/posts/theme-documentation-advanced/#icons-in-header).
```toml
baseURL = "https://example.org/"
defaultContentLanguage = "en"
# Automatically generate robots.txt
enableRobotsTXT = true
languageCode = "en"
theme = "gokarna"
title = "My New Hugo Site"
[menu]
[[menu.main]]
# Display name
name = "Posts"
# Relative URL slug (appended to baseURL)
url = "/posts/"
# Lower weights are listed first in the menu (leftmost); higher weights are
# listed last in the menu (rightmost)
weight = 1
[[menu.main]]
name = "Tags"
url = "/tags/"
weight = 2
[[menu.main]]
# Unique identifiers are required for menu entries without a name property,
# or for menu entries which re-use a name
identifier = "github"
# Absolute URL to external resource
url = "https://github.com"
weight = 3
# Surround the menu entry (or name) with HTML content, such as Feather
# icons: https://feathericons.com
pre = "<span data-feather='github'></span>"
post = ""
```
### d. Create Your First Post {#create-your-first-post}
Use the [`new` subcommand](https://gohugo.io/commands/hugo_new/#hugo-new) to create a post (in [the `content/` directory](https://gohugo.io/content-management/organization/#organization-of-content-source)):
```bash
hugo new posts/'My First Post'.md
```
Two [content types](https://gohugo.io/content-management/types/) are supported in Gokarna:
1. `type: "post"`
A blog post consisting of a [page title](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/title#page_titles_and_seo), [meta description](https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML#adding_an_author_and_description), creation/last modified dates, [SEO keywords (tags)](/posts/theme-documentation-advanced/#seo-keywords), and Markdown content.
Read more about Posts in the [advanced documentation](/posts/theme-documentation-advanced/#post).
2. `type: "page"`
A standalone page which only renders Markdown. Best used for custom pages (e.g. your [portfolio](/projects/)) which should not feature in your [Posts](/posts/) timeline.
Read more about Pages in the [advanced documentation](/posts/theme-documentation-advanced/#page).
#### Using archetypes
`hugo new` will automatically use an appropriate [archetype](https://gohugo.io/content-management/archetypes/#lookup-order) (see [`archetypes/`](https://github.com/gokarna-theme/gokarna-hugo/tree/main/archetypes)) and insert [front matter](https://gohugo.io/content-management/front-matter/) depending on the location of your content:
- `hugo new posts/$post-name.md` automatically sets `type: "post"`
- `hugo new $page-name.md` automatically sets `type: "page"`
Gokarna employs [custom front matter](/posts/theme-documentation-advanced/#content-types), which is included in the archetypes:
- The creation date of the file is automatically set (e.g. `date: 2023-12-25`)
- The file name is used as the default title (e.g. `title: "My First Post"`)
### e. Launching the Website Locally {#launching-the-website-locally}
Use the [`server` subcommand](https://gohugo.io/commands/hugo_server/#synopsis) to view your site.
```bash
hugo server
```
Go to [`http://localhost:1313`](http://localhost:1313/) (if no other Hugo servers are running; Hugo will use an [ephemeral port](https://en.wikipedia.org/wiki/Ephemeral_port) if one or more servers are running concurrently on the host).
### f. Build the Website {#build-the-website}
Use the `hugo` command to build your site.
```bash
hugo
```
A `public` folder will be generated, containing all static content and assets for your website. It can be hosted on any web server.
The website can be automatically published and hosted with [Netlify](https://www.netlify.com/), [AWS Amplify](https://gohugo.io/hosting-and-deployment/hosting-on-aws-amplify/), [GitHub Pages](https://gohugo.io/hosting-and-deployment/hosting-on-github/), [Render](https://gohugo.io/hosting-and-deployment/hosting-on-render/), and more...
## Configuration
In addition to [Hugo global configuration](https://gohugo.io/overview/configuration/) and [menu configuration](#basic-configuration), Gokarna lets you define the following [parameters](https://gohugo.io/methods/site/params/) in your site configuration.
See this sample `hugo.toml`, which uses Gokarna's default values, and [exampleSite's `hugo.toml`](https://github.com/gokarna-theme/gokarna-hugo/blob/main/exampleSite/hugo.toml):
```toml
[params]
# Choose the color shown when hyperlinks are hovered over
accentColor = "#FF4D4D"
# Resource URL for the site avatar (home page and header)
avatarURL = "/images/avatar.webp"
# Describe the avatar for screen readers
avatarAltText = "avatar"
# Set the avatar's size: size-xs, size-s, size-m, size-l & size-xl
avatarSize = "size-m"
# Inject arbitrary HTML via the <head> tag
# Best used for importing custom JavaScript, CSS, or analytics
customHeadHTML = ""
# Configure how post dates are displayed
dateFormat = "January 2, 2006"
# Home page meta description
description = "Sky above, sand below & peace within"
# Footer text (i.e. author/project name)
footer = "The Marauders"
# Define SEO keywords
metaKeywords = ["blog", "gokarna", "hugo"]
# Define how many posts are displayed on the home page
# showPostsOnHomePage must be "popular" or "recent"
numberPostsOnHomePage = 4
# Display a "back to top" button on posts and pages: true, false
# May not render on smaller screen sizes
showBackToTopButton = true
# Display posts on the home page:
# "popular" (order posts by weight)
# "recent" (order posts by date)
# "", unset (do not display)
showPostsOnHomePage = ""
# Show the previous and next post in your timeline: "true", "false"
# Incompatible with Weight
togglePreviousAndNextButtons = false
```
### Accent color
The color displayed when a user hovers over hyperlinks (`<a>` tags), expressed as a [hexadecimal](https://developer.mozilla.org/en-US/docs/Web/CSS/hex-color).
```toml
[params]
accentColor = "#FF4D4D"
```
### Avatar URL
The avatar's resource URL, displayed on the [home page](/) and header (top-left).
Images are typically placed into the [`assets/`](https://gohugo.io/getting-started/directory-structure/#assets) or [`static/`](https://gohugo.io/getting-started/directory-structure/#static) directories (which are copied to the top-level directory [at build time](#build-the-website)).
```toml
[params]
avatarURL = "/images/avatar.webp"
```
### Avatar size
Set the avatar's size as: `size-xs`, `size-s`, `size-m`, `size-l`, or `size-xl`.
```toml
[params]
avatarSize = "size-m"
```
### Custom Head HTML
Add arbitrary HTML code to the [`<head>` element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head).
```toml
[params]
customHeadHTML = "<script>console.log('Any HTML')</script>"
```
Examples are available in the [advanced documentation](/posts/theme-documentation-advanced/#bring-your-own-scripts).
### Date format
[Configure how posts date are displayed](https://gohugo.io/functions/time/format/), using [date strings](https://pkg.go.dev/time#pkg-constants).
```toml
[params]
dateFormat = "2 January, 2006"
```
### Description
[Meta description](https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML#adding_an_author_and_description) to display on the home page, below the title and avatar.
```toml
[params]
description = "Sky above, sand below & peace within"
```
### Display content on the home page
Markdown content in `content/_index.md` will be rendered on the home page, below the social icons.
### Display posts on the home page
Recent and popular posts can be shown on the home page:
- `popular`: Sort posts in ascending order of their [Weight](https://gohugo.io/methods/page/weight/)
**If any post on your site defines `weight`, you cannot enable [Previous and Next buttons](#previous-and-next-buttons).**
- `recent`: Sort posts in ascending order of [Date](https://gohugo.io/methods/page/date/)
- Do not show anything if the variable is:
- unset
- an empty string (`""`)
The number of posts displayed on the home page can be changed by setting `numberPostsOnHomePage`. If `numberPostsOnHomePage` is equal to `""` or `0`, the default value (`4`) is used.
```toml
[params]
showPostsOnHomePage = ""
numberPostsOnHomePage = 4
```
### Favicons
Place favicons into the `static/` directory. The following files are supported:
- `apple-touch-icon.png` (180x180)
- `favicon-32x32.png` (32x32)
- `favicon-16x16.png` (16x16)
- `mstile-150x150.png` (150x150)
- `android-chrome-192x192.png` (192x192)
- `android-chrome-512x512.png` (512x512)
Favicons can be generated using services such as [favicon.io](https://favicon.io), or [realfavicongenerator.net](https://realfavicongenerator.net/).
### Font size
Set the content [`font-size`](https://developer.mozilla.org/en-US/docs/Web/CSS/font-size).
Note that '[defining font sizes in px is not accessible](https://developer.mozilla.org/en-US/docs/Web/CSS/font-size#pixels)'.
```toml
[params]
fontSize = "1.1rem" # equal to 17.6px
```
### Footer
Text to display in the footer section, typically the name of the author or project.
```toml
[params]
footer = "The Marauders"
```
`footer` can include [Markdown syntax](https://www.markdownguide.org/tools/hugo/) - best used for including hyperlinks, emoji, or text formatting.
### Previous and Next buttons
At the bottom of a post, show the previous and next post chronologically.
**Warning**: Not compatible with the `.Weight` parameter.
If any post front matter contains `weight`, the posts will not appear by Date. See [Hugo's default sort](https://gohugo.io/templates/lists#default-weight--date--linktitle--filepath).
```toml
[params]
togglePreviousAndNextButtons = false
```
### Reading time
Display a post's [estimated reading time](https://gohugo.io/methods/page/readingtime/) in minutes.
```toml
[params]
displayReadingTime = false
```
### robots.txt
[Automatically generate](https://gohugo.io/templates/robots/) a `robots.txt` file, used to ['manage crawler traffic to your site'](https://developers.google.com/search/docs/crawling-indexing/robots/intro).
```toml
enableRobotsTXT = true
```
@@ -0,0 +1,10 @@
---
title: "Projects"
type: page
---
## Hello, my projects are:
1. [Tatooine](/projects/tatooine/)
2. [Hydra](/projects/hydra/)
3. [Bludhaven](/projects/bludhaven/)
@@ -0,0 +1,8 @@
---
title: Blüdhaven
type: page
---
## History
Blüdhaven was a former whaling town, which was officially incorporated as a "Commonwealth" in 1912. The town had a generally poor socio-economic populace, owing in part to failed efforts to transform itself into a manufacturing and shipping center.
@@ -0,0 +1,8 @@
---
title: Hydra
type: page
---
## Motto
Cut off one head, and two will take their place.
@@ -0,0 +1,8 @@
---
title: Tatooine
type: page
---
## A long time ago in a galaxy far, far away....
A project was planned, but never completed.
+102
View File
@@ -0,0 +1,102 @@
baseURL = "https://gokarna-hugo.netlify.app"
defaultContentLanguage = "en"
enableEmoji = true
enableRobotsTXT = true
languageCode = "en"
# Choose one of emacs, trac or perldoc
pygmentsStyle = "monokai"
theme = "gokarna"
title = "Gokarna"
[params]
avatarAltText = "avatar"
avatarSize = "size-m"
avatarURL = "/images/avatar.webp"
customHeadHTML = """
<!-- KaTeX -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.22/dist/katex.min.css" integrity="sha384-5TcZemv2l/9On385z///+d7MSYlvIEw9FuZTIdZ14vJLqWphw7e7ZPuOiCHJcFCP" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.22/dist/katex.min.js" integrity="sha384-cMkvdD8LoxVzGF/RPUKAcvmm49FQ0oxwDF3BGKtDXcEc+T1b2N+teh/OJfpU0jr6" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.22/dist/contrib/auto-render.min.js" integrity="sha384-hCXGrW6PitJEwbkoStFjeJxv+fSOOQKOPbJxSfM6G5sWZjAyWhXiTIIAmQqnlLlh" crossorigin="anonymous"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
renderMathInElement(document.body, {
// customised options
// • auto-render specific keys, e.g.:
delimiters: [
{left: '$$', right: '$$', display: true},
{left: '$', right: '$', display: false},
],
// • rendering keys, e.g.:
throwOnError : false
});
});
</script>
"""
description = "Sky above, sand below and peace within"
footer = "The Marauders"
metaKeywords = ["blog", "gokarna", "hugo"]
showBackToTopButton = true # true or false for "back to top" button on posts and pages
socialIcons = [
{name = "twitter", url = "https://example.com"},
{name = "linkedin", url = "https://example.com"},
{name = "stackoverflow", url = "https://example.com"},
{name = "dribbble", url = "https://example.com"},
{name = "instagram", url = "https://example.com"},
{name = "twitch", url = "https://example.com"},
{name = "email", url = "mailto:example@example.com"}
]
[menu]
[[menu.main]]
name = "Home"
pre = "<span data-feather='home'></span>"
url = "/"
weight = 1
[[menu.main]]
name = "Posts"
pre = "<span data-feather='book'></span>"
url = "/posts/"
weight = 2
[[menu.main]]
name = "Projects"
pre = "<span data-feather='code'></span>"
url = "/projects/"
weight = 3
[[menu.main]]
name = "Tags"
pre = "<span data-feather='tag'></span>"
url = "/tags/"
weight = 4
[[menu.main]]
identifier = "github"
pre = "<span data-feather='github'></span>"
url = "https://github.com/gokarna-theme/gokarna-hugo"
weight = 5
[[menu.main]]
identifier = "buymeacoffee"
pre = "<span data-feather='coffee'></span>"
url = "https://www.buymeacoffee.com/avijitgupta"
weight = 6
[[menu.main]]
identifier = "rss"
pre = "<span data-feather='rss'></span>"
url = "/index.xml"
weight = 7
[markup]
[markup.tableOfContents]
startLevel = 1
endLevel = 4
ordered = false
[minify]
minifyOutput = true
Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 306 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 811 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 70 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 71 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 439 KiB

@@ -0,0 +1 @@
{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
+1
View File
@@ -0,0 +1 @@
../../