# Hugo

notes

Hugo Troubleshooting

14 October 2024

Hugo is fast, but ineffecinet templates can make it slower. For checking the performance you can use the below commands.

  • Use hugo --logLevel debug to display debug information, warning, and error message.

  • Use hugo --templateMetrics to check for slow templates. This will show the time it takes to render each template.

  • Use hugo --gc (garbage collection) to clean up unused files, which might help reduce build time.

  • Use debug.Timer to determine the execution time of a block of code. And use the hugo --logLevel info info command line flag when you build the site.

{{ $t := debug.Timer "TestSqrt" }}
{{ range seq 2000 }}
  {{ $f := math.Sqrt . }}
{{ end }}
{{ $t.Stop }}
References

Hugo Docs

hugo
essay

Set up a feed/ archive page in Hugo to display all posts

7 January 2024
This website contains various types of blogs, both technical and non-technical, that can be accessed through the variuos links. I wanted to have a single page...
Continue reading
hugo
essay

Hugo image shortcode

24 October 2023
This website is built with Hugo, a static site generator that uses Markdown for writing content files...
Continue reading
hugo shortcodes
essay

Hugo alert box shortcode

24 September 2023
If you are using Hugo as your static site generator, you might want to create a card shortcode that can display different types of information on your blog posts...
Continue reading
hugo shortcodes
essay

Hugo Custom Shortcodes

2 September 2023
Writings comments in the code will help you and anyone who reads the code by giving more readability and understandings.
Continue reading
hugo shortcodes
essay

Card shortcode for Hugo

25 January 2023
Shortcodes are simple snippets inside your content files calling built-in or custom templates.
Continue reading
hugo shortcodes
essay

Lightbi Theme Parameters

17 January 2021
Lightbi is a sleek blog theme for Hugo, the fast static site generator. It's thoughtfully designed for a smooth and elegant blogging experience.
Continue reading
lightbi themes hugo
essay

Lightbi - Hugo Theme

16 January 2021
Lightbi is a sleek blog theme for Hugo, the fast static site generator. It's thoughtfully designed for a smooth and elegant blogging experience.
Continue reading
lightbi hugo themes bootstrap projects
projects

Lightbi Hugo Theme

16 January 2021

Lightbi is a modern, elegant Hugo theme focused on readability, performance, and content-first design. It offers a clean, minimal experience for personal blogs, digital gardens, and long form writing, with two homepage modes, Profile for personal introductions and Blog for content driven sites, plus responsive layouts and light/dark mode support.

Lightbi profile and blog home page

Lightbi profile and blog home page

Demo & GitHub

Screenshots

You can find the screenshots of the theme below:

/img/blog/2021/lightbi-blog-theme/gallery-v2/1.png /img/blog/2021/lightbi-blog-theme/gallery-v2/2.png /img/blog/2021/lightbi-blog-theme/gallery-v2/3.png /img/blog/2021/lightbi-blog-theme/gallery-v2/4.png /img/blog/2021/lightbi-blog-theme/gallery-v2/5.png /img/blog/2021/lightbi-blog-theme/gallery-v2/6.png

Features

Below are the features of Lightbi theme.

General

  • Two Modes:

    • Profile
    • Blog

  • Two Main Content Sections:

    • Blog
    • Notes

  • Responsive Design:

    • Built with a mobile-first approach for seamless viewing on any device.

  • Card-Based Theme:

    • Flexible image placement options:
      • Image at the top of the card
      • Image in the middle of the card
      • Image at the bottom of the card
      • No image option

  • Image Gallery
      You can add multiple images to your post and display them beautifully as a gallery.

  • Menu Location Indicator:
    Clear visual cues for active menu items.

  • Multilingual Support:
    Includes a language selector for easy switching between languages.

  • Taxonomies:
    Organize content effectively with customizable tags and categories.

  • Search Functionality:
    Integrated search option for quick content access.

  • Light/Dark Theme:

    • Automatic theme switching based on browser preferences.
    • Includes a manual theme-switch button for user control.

  • Google Analytics Integration:
    Track user activity with built-in support for Google Analytics.

  • SEO-Friendly:
    Optimized for search engines to improve visibility.

  • Commit SHA in Footer:
    Display the current commit SHA for version tracking.

  • Self-Hosted Assets:
    Compliant with GDPR / EU-DSGVO regulations by hosting all assets locally.

  • Bootstrap Icons:
    Beautiful, lightweight icons integrated with Bootstrap Icons.

Page
  • Other Posts suggestion below a post.
  • Social-Media Share buttons on posts.
  • Syntax highlighting.
  • Cover image for each post (with Responsive image support).

Configurations

Select theme mode

To configure the theme for either profile or blog mode, add the following under the params section in your hugo.toml file:

  • Set homepageLayout = "profile" for profile mode
  • Set homepageLayout = "blog" for blog mode

Card based theme.

To customize the image placement within a card, the Lightbi theme offers four flexible options. To configure this, use the previewCardImagePlacement parameter in the hugo.toml file. Set it as follows:

  • For the image at the top: previewCardImagePlacement = "top"
  • For the image in the middle: previewCardImagePlacement = "middle"
  • For the image at the bottom: previewCardImagePlacement = "bottom"
  • For no image: previewCardImagePlacement = "none"

For more details about parameters you can check here.

This theme is designed to help you build amazing websites with ease. I would love to hear your feedback and see your creations.

lightbi hugo themes bootstrap