You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
vmaillot 1599d2f440 theme: update as wanted 10 months ago
archetypes The graat customizing ... 2 years ago
assets Fix hamburger icon flicker 1 year ago
data added zh-cn, zh-tw, ja & corrected icon link 1 year ago
docs {docs,layouts}: svg: Add spotify icon 11 months ago
exampleSite Display categories in posts 1 year ago
i18n Added instructions to setup word count for CJK languages in config.toml 1 year ago
images Add images 2 years ago
layouts theme: update as wanted 10 months ago
static theme: update as wanted 10 months ago
.eslintrc.yml New Version - 1.0.1 — Set dark theme as default & fix eslint 3 years ago
.gitignore Edit gitignore 1 year ago Add changelog 1 year ago Add 1 year ago Update 2 years ago Typo 11 months ago
theme.toml Update theme.toml 2 years ago

Hello Friend NG

Hello Friend NG

General informations

This theme was highly inspired by the hello-friend and hermit. A lot of kudos for their great work.

Table of Contents


  • Theming: dark/light mode, depending on your preferences (dark is default, but you can change it)
  • Great reading experience thanks to Inter UI font, made by Rasmus Andersson
  • Nice code highlighting thanks to PrismJS
  • An easy way to modify the theme with Hugo tooling
  • Fully responsive
  • Support for social icons
  • Support for sharing buttons

How to start

You can download the theme manually by going to and pasting it to themes/hello-friend-ng in your root directory.

You can also clone it directly to your Hugo folder:

$ git clone themes/hello-friend-ng

If you don’t want to make any radical changes, it’s the best option, because you can get new updates when they are available. To do so, include it as a git submodule:

$ git submodule add themes/hello-friend-ng

How to configure

The theme doesn’t require any advanced configuration. Just copy the following config file. To see all possible configurations, check the docs. Note: There are more options to configure. Take a look into the config.toml in exampleSite.

baseurl      = "localhost"
title        = "My Blog"
languageCode = "en-us"
theme        = "hello-friend-ng"
paginate     = 10

  dateform        = "Jan 2, 2006"
  dateformShort   = "Jan 2"
  dateformNum     = "2006-01-02"
  dateformNumTime = "2006-01-02 15:04"

  # Subtitle for home
  homeSubtitle = "A simple and beautiful blog"

  # Set disableReadOtherPosts to true in order to hide the links to other posts.
  disableReadOtherPosts = false

  # Enable sharing buttons, if you linke
  enableSharingButtons = true

  # Metadata mostly used in document's head
  description = "My new homepage or blog"
  keywords = "homepage, blog"
  images = [""]

  # Default theme "light" or "dark"
  defaultTheme = "dark"

    category = "blog"
    tag      = "tags"
    series   = "series"

    title = "Hello Friend NG"
    subtitle = "A simple theme for Hugo"
    keywords = ""
    copyright = '<a href="" target="_blank" rel="noopener">CC BY-NC 4.0</a>'
    readOtherPosts = "Read other posts"

      logoText = "hello friend ng"
      logoHomeLink = "/"
    # or
    # path = "/img/your-example-logo.svg"
    # alt = "Your example logo alt text"

  # And you can even create generic menu
    identifier = "blog"
    name       = "Blog"
    url        = "/posts"

More things

Built-in shortcodes

Of course you are able to use all default shortcodes from hugo (



  • src (required)
  • alt (optional)
  • position (optional, default: left, options: [left, center, right])
  • style


{{< image src="/img/hello.png" alt="Hello Friend" position="center" style="border-radius: 8px;" >}}

Code highlighting

Supported languages: Take a look here

By default the theme is using PrismJS to color your code syntax. All you need to do is to wrap you code like this:

``` html
  // your code here


Check the docs.

Social Icons:

Take a look into this list

If you need another one, just open an issue or create a pull request with your wished icon. :)

Known issues

There is a bug in Hugo that sometimes causes the main page not to render correctly. The reason is an empty taxonomy part. Related issue tickets: !14 !59.

Either you comment it out completely or you write the following in

  tag      = "tags"
  category = "categories"

How to edit the theme

Just edit it. You don’t need any node stuff. ;)


If you like my work and if you think this project is worth to support it, just
Buy Me A Coffee


Copyright © 2019-2020 Djordje Atlialp

The theme is released under the MIT License. Check the original theme license for additional licensing information.