526avijitgupta / gokarna Goto Github PK

Hugo docs says:

While Hugo supports content nested at any level, the top levels (i.e. content/) are special in Hugo and are considered the content type used to determine layouts etc. To read more about sections, including how to nest them, see sections.

While it is not supported: page type must be specified in the front matter which is a bit confusing.

This theme supports two types of content types: post and page. To specify them, you need to add them in your markdown metadata.

@526avijitgupta running hugo mod clean worked. Thanks! Issue solved :)

By the way, if I want to keep using the previous dark background, which files should I edit? I don't want to edit the files of the Gokarna theme because it's a git submodule, so I wonder if there's a parameter to set a custom background color in dark mode.

Originally posted by @netotz in #82 (comment)

My site is deployed at https://my.domain.com/blog/, rather than the more traditional https://my.domain.com. The tag links that appear under post titles incorrectly omit the /blog/ prefix, instead linking to https://my.domain.com/tags/whatever.

I solved this by adding my own post.html with this change:

        <ul class="post-tags">
        {{ range .Params.tags }}
            <!-- old
            <li class="post-tag"><a href="{{ "/tags/" | absLangURL }}{{ . | urlize }}">{{ . }}</a></li>
            -->
            <!-- new, prefixed / from "/tags/" removed -->
            <li class="post-tag"><a href="{{ "tags/" | absLangURL }}{{ . | urlize }}">{{ . }}</a></li>
        {{ end }}
        </ul>

Interestingly, the Tags link from the nav header works correctly, even though I set it's URL to /tags/ in config.toml:

  [[menu.main]]
    name = "Tags"
    pre = "<span data-feather='tag'></span>"
    url = "/tags/"
    weight = 4

This produces a site with 404's for CSS, JS, etc.

baseURL = 'https://example.org/foo/'

You've hardcoded links to the root of the domain rather than the root of the site.

Hey,

I am not sure what is going on but some posts do break on my page regardless they are short in width:

Anything I can do about this? I see a div element with flex-break class, what this is for? Thanks for help.

What is the best way to make a site using gokarna that uses a hierarchy of pages? For example, suppose the example site had projects/javascript and projects/php instead of simply projects.

Hello sir, I have a question.
I am using the theme via hugo, When creating a markdown file for a new post, the file is located in the content/posts/* sub-path.

> content
 >> posts
   >>> index.md

However, I think this method will be very difficult to manage if there are many markdown files.
I hope the way I want it to be managed is posts/{new folder}/name.md , but I wonder if that's currently possible.

> content
  >> posts
   >>> 2022
    >>>> title1.md
   >>> 2021
    >>>> title2.md

When uploading the static files to a server the social icons do not show up anymore and the console says "404 resource not found".

This is due to the default configuration of Apache servers, which creates an alias for the icons directory:

Alias /icons/ "/usr/share/apache2/icons/"

So, the icons directory should not reside in the website's too directory or have a different name.

Hello, I hope that this theme can add option to show more information, such projects, talks on homepage, instead of only posts. The current homepage is a little empty and don't show visitors more key infromation.

So basically i have image set for every post but it doesn't show it either when sharing the link or when testing via a tool like https://socialsharepreview.com/

For example -
Post: https://mansoorbarri.com/articles/admin-vs-standard/
Front matter:

---
title: "Admin User vs Standard User"
date: 2023-03-01
tags: [Info]
image: "/images/articles/admin-vs-standard/main.webp"
type: "post"
showtableOfContents: true
---

test:

ik that the image and the url is correct as it is embedded on the post

Hi~ Nice to meet you again~

Actually, I know your websites use KaTeX to support the math formula.
However, I find that your web page just support block formula. Actually, there are lot's of cases that you need to express your statement by combining sentences with formula.

I wish you can add this function to gokarna to make it more flexible~
Here are some articles you can refer to~
https://mertbakir.gitlab.io/hugo/math-typesetting-in-hugo/
https://katex.org/docs/supported.html#line-breaks

Wish to hear from your reply~

I am trying to make it showcase Chinese, so I add content blowing:

languageCode = "zh-cn"
defaultContentLanguage = "zh-cn"

But it doesn't work.

I am using hugo hugo v0.104.2-84cbe724983b4b6153fd39aae0888cbb89a56cda windows/amd64 BuildDate=2022-09-29T10:31:09Z VendorInfo=gohugoio

The current table of content is positioned to the right side of the page contrary to the usual place which is to the left.

Taken directly from Gokarna documentation:

It would be nice to make choosing the preferred ToC location (left or right) to be an option.

Resubmission of #126

My site is deployed at https://my.domain.com/blog/, rather than the more traditional https://my.domain.com. The tag links that appear under post titles incorrectly omit the /blog/ prefix, instead linking to https://my.domain.com/tags/whatever.

I solved this by adding my own post.html with this change:

        <ul class="post-tags">
        {{ range .Params.tags }}
            <!-- old
            <li class="post-tag"><a href="{{ "/tags/" | absLangURL }}{{ . | urlize }}">{{ . }}</a></li>
            -->
            <!-- new, prefixed / from "/tags/" removed -->
            <li class="post-tag"><a href="{{ "tags/" | absLangURL }}{{ . | urlize }}">{{ . }}</a></li>
        {{ end }}
        </ul>

Interestingly, the Tags link from the nav header works correctly, even though I set it's URL to /tags/ in config.toml:

  [[menu.main]]
    name = "Tags"
    pre = "<span data-feather='tag'></span>"
    url = "/tags/"
    weight = 4

The examples at https://gohugo.io/functions/abslangurl/ also suggest that the prefixed / is not correct. I think the solution is to simply remove it.

The idea is to show a back to top button only after scrolling with CSS.

This article shows some methods that only use CSS, no JS.

I especially like this method with a fading button.

What do you guys think?

On pages except the homepage the avatar doesn't show up pls help

I have this issue where on my mobile some icons are shifted towards the left, it is fine on my PC doe. The config file seems fine too so i don't really know that is wrong.

my site/demo: mansoorbarri.com

I like this theme a lot, and I want to keep using it so it would be awesome if it could support Katex!

I really like your hugo website design. It's simple and beautiful. Well, this is just an advice. I am wondering whether it can add the TOC supporting so that there is a catalogue displayed in the side when we read the blog?

Im not sure if a theme decides this or if hugo is capable of doing this but, am i able to add an image to the homepage?

Hey, is there any way to remove "s" from the title text like the one here:

Using the socialIcons setting of params renders big icons:

This is the site that I'm rendering: https://github.com/netotz/netotz.github.io

Right now the source code doesn't include the social icons because of it looks.

I had a look at the CSS and can't see any obvious reason for this. The icons are dark on the light theme (which is correct) but for the dark theme they show as black (hard to see) until you mouse over/hover on them and they change.

Happy to help with testing but CSS is not a strong point for me (otherwise I'd submit a fix)!

I've worked around this by adding my icons to the menu instead and I'm pretty happy with that option for now.

Hi! I have started to use the TOC now. But I found that there was a problem:
If you use H1-6 in markdown start with a number
eg.

1. This is the content1

It looks like the TOC can not index the location of the text and go to that part
Take my post as an example

My title start by 1.xxx 2.xxx
But it can not locate in certain part of the page if I click this TOC

If I use other content like the title [Introduction] (which number is not start in the first place), it will work~

Is there a way to add a caption to the images in the blog posts?

#95 added a Table of Contents for desktop, but it does not appear on mobile.

The Gokarna implementation is superior to the generic Hugo shortcode, so seeing this feature regardless of screen size would be great.

If you don't want to implement this feature yourselves, guidance on submitting a Pull Request would be appreciated! 😄

Hi Avijit,

Is there a way to link a menu item to a static HTML file?

I'm trying to add an About section, but if I add it as a post, it will show up with the rest of the posts.

Thanks!

Light theme saturation is too hard on the eyes. Also, when I used this theme, it defaulted to the white mode for some reason.

Even on the largest breakpoint, wide date strings like September 22, 2022 are always wrapped around to a new line:

Scaling the window smaller will eventually cause other dates to wrap, but September 22 specifically will never display normally.

As mentioned in #111, .Site.Copyright is a Hugo variable.

Will you accept a PR which adds this string to the footer? I have one ready to go.

Hi developer team,
I would like to apply the free comment service to your theme. My free service is cusdis.com and set the required condition in toml file

The GNU Project outline the difference between the GPL and AGPL thusly:

The GNU Affero General Public License is a modified version of the ordinary GNU GPL version 3. It has one added requirement: if you run a modified program on a server and let other users communicate with it there, your server must also allow them to download the source code corresponding to the modified version running there.

Currently, if somebody forks gokarna and runs the modified theme on their server, they are not compelled to release the code publicly. Ergo, the changes cannot be reviewed and potentially upstreamed.

If this is a concern for you, re-licensing may have some value. The GNU Project and Free Software Foundation recommend the AGPL for server software.

Regardless of the licence used, a clarification on the version of the licence used would also be appreciated.

Hope this is helpful!

Hi, please could you help me?
I switch from a previous theme to gokarna, but I can0t view the index page with all blog post.
What I'm doing wrong?
thank you

https://github.com/alexdelli/alexpress

I would like to put an avatar which has not a circular shape (i.e. it gets cropped when displayed on the website). Are there any solutions for this?

These are my configuration as per GoKarna documentation but the table of contents isn't rendered.

config.toml:

start of the post:

the page: https://mansoor.cf/posts/scambaiting101/

Hey, thanks for the template! It is great.

I am trying to inject Mastodon icon in the main menu:

  [[menu.main]]
  identifier = "mastodon"
  pre = "<img class='svg-inject' src='/svg/icons/mastodon.svg' />"
  url = "https://social.zapletalovi.com/@lukas"
  weight = 4

But for some reason it loads dark:

It renders fine on the front page (social icons). When I flip dark/light mode everything flips correctly, except this mastodon icon (the same icon on the social section does flip correctly).

Any idea what is wrong? I am not good in CSS stuff, no idea.

FYI the documentation is missing the /svg prefix, so I added it.

how about add a comment class?

See the below screenshots for reference.

This appears using browser emulation (Firefox) and on an actual device (Chromium on Pixel 4a (not 5G)).

Browser Emulation

Actual Device

Hi in which folder should I put the avatar I can't display it

Hello!
Can you please change hard coded date format to accept [params] format? I'm creating my website with this awesome theme, but in Poland we don't use January, 2 2006 we use 2 January 2006 and in general it will be better to end user choose their preferred format.
I can make PR with this changes but I'm new to Hugo and don't know how exactly those changes will do to theme in general...
To have same date format like is now you would need to:
In config.toml you would need to add:

[params]
  dateFormat = "January, 2 2006"

in layouts/partials/list-posts.html change:

<span class="post-date">{{ dateFormat "January 2, 2006" .Date }}</span>

to:

<span class="post-date"> {{ dateFormat .Site.Params.dateFormat .Date }} </span>

and in: layouts/partials/post.html change:

{{ dateFormat "January 2, 2006" .Date }}

to:

 {{ dateFormat .Site.Params.dateFormat .Date }}

Hi I still need a bit of assistance with this, by the way this is my website: https://cloudy-fi.com/

I just need to know why they are being 404'd as mentioned before and what i can do to fix it

Hello, thanks for making this theme. I have been using it for a while and am quite happy with the feel.

I recently have a problem with syntax highlighting of code blocks when using any light theme.

For example, my current style defined in config.toml is pygmentsStyle = "dracula", which yields the following look of a python code:

If I switch to pygmentsStyle = "solarized-light", I got this output:

How to remove the dark background of each line?

By the way, this is not specific to solarized-light. Basically, any light style will have this problem for me.

Regards,
Xi

Hello,

I love theme! I was trying run Hugo through Cloudflare, and I ran into an issue building the application.

In /layouts/partials/list.html, line 9

{{- range .Pages -}}

There is an extra space after the .Pages. It is stopping the application from being built. I downloaded a local copy of the theme and deleted the space and Cloudflare was able to run the application

Can't find

This fix #81 unfortunately breaks the hover effect of social media icons in dark mode. Hovering over the social icons only shows the accent color for a short time (the transition time) and then the icon is white again. This is because of CSS selector precedence: a:hover { fill: var(--accent-color); } in main.css takes less precedence than .social-icons-list .social-icon a:visited { fill: var(--dark-text-color); } because the latter is more specific. To fix this, we need to add a selector with the same specificity that applies the hover effect again. In dark.css, add:

.social-icons-list .social-icon a:hover {
  fill: var(--accent-color);
}

It would be nice to have an ability to search posts and pages. It is useful for sites with a lot of content.

Hello, I would like to customize the home page, but I would like to do that without overriding the template.

I noticed that pages have a kind that could be used for this purpose.

What do you think about adding a class named kind-{{.Kind}} to the body tag for this purpose? I have a PR ready if you are interested!

Have tried putting the images at the directory "static" and in the same directory as .md file.