HB - Hugo Bootstrap Framework on HB Framework

Google Fonts Module

Wed, 15 Nov 2023 00:24:24 +0800

Module github.com/hbstack/google-fonts Repository ⭐ Please consider giving a star if your like it. Stars Version Used by Requirements License Usage See how to use modules. Site Parameters Parameter Type Required Default Description families array ✔️ The array of font families, the first one are preferred. families.name string ✔️ Font name. families.axis object Font axis. families.axis.ital array Font italic, range from 0 to 1. families.axis.wght array Font weight, the quantity must be the same as the families.

Header News Module

Wed, 01 Nov 2023 19:06:50 +0800

Module github.com/hbstack/header/modules/news Repository ⭐ Please consider giving a star if your like it. Stars Version Used by Requirements License Usage See how to use modules. Site Parameters Parameter Type Required Default Description sections array [news] Main sections. limit number 5 The maximum number of news. date_format string :date_full The format of news date. icon_name string bell-fill The name of icon. icon_vendor string bootstrap The name of icon vendor.

Broken styles when building site via Hugo v0.120.0 or later

Tue, 31 Oct 2023 16:33:52 +0800

1hugo mod get github.com/hugomods/hugopress@v0.2.2 2hugo mod get github.com/hbstack/footer@v0.2.7

Header Google Custom Search Engine Module

Thu, 12 Oct 2023 20:11:15 +0800

Module github.com/hbstack/header/modules/gcse Repository ⭐ Please consider giving a star if your like it. Stars Version Used by Requirements License Usage See how to use modules. Site Parameters TOML YAML JSON hugo.toml 1[params] 2 [params.hb] 3 [params.hb.header] 4 [params.hb.header.gcse] 5 id = 'SEARCH_ENGINE_ID' 6 layout = 'offcanvas' hugo.yaml 1params: 2 hb: 3 header: 4 gcse: 5 id: SEARCH_ENGINE_ID 6 layout: offcanvas hugo.json 1{ 2 "params": { 3 "hb": { 4 "header": { 5 "gcse": { 6 "id": "SEARCH_ENGINE_ID", 7 "layout": "offcanvas" 8 } 9 } 10 } 11 } 12} Parameter Type Required Default Description id string ✔️ The Google custom search engine ID.

Replace Meta Modules

Tue, 10 Oct 2023 22:44:37 +0800

Backgrounds Initially, to make it easier for newbies to get started and familiarize themselves with the themes of the HB framework, we provide a number of meta modules, which are just collections of modules that don’t provide any functionalities. However, meta modules have an obvious disadvantage that it is difficult to remove unwanted modules from them, so in this tutorial, we’re going to talk about how to replace the meta module.

HB Blog Profile Sidebar Module

Sun, 08 Oct 2023 22:02:48 +0800

Module github.com/hbstack/blog/modules/sidebar/profile Repository ⭐ Please consider giving a star if your like it. Stars Version Used by Requirements License Usage See how to use modules. Site Parameters Parameter Type Required Default Description avatar string /images/logo.png The avatar image path relative to the assets folder. avatar_size number 100 The size of avatar image. company string The company name, Markdown supported. description string Site description. The description or bio, Markdown supported. location string The location, Markdown supported.

Applications

Fri, 15 Sep 2023 22:42:11 +0800

Currently, the applications are specified through the menus configuration. TOML YAML JSON config/_default/menus.yaml.toml 1[[apps]] 2 identifier = 'group-1' 3 name = 'Group 1' 4[[apps]] 5 name = 'Foo' 6 parent = 'group-1' 7 url = 'https://example.org/foo' 8[[apps]] 9 identifier = 'group-2' 10 name = 'Group 2' 11[[apps]] 12 name = 'Bar' 13 parent = 'group-2' 14 url = 'https://example.org/bar' config/_default/menus.yaml.yaml 1apps: 2- identifier: group-1 3 name: Group 1 4- name: Foo 5 parent: group-1 6 url: https://example.

Look and Feel

Fri, 15 Sep 2023 22:34:11 +0800

Background Image The background image is supported by the HB background image module. Favicons The favicons is supported by the favicons module, the image path is images/logo.png by default.

Installation

Fri, 15 Sep 2023 16:26:58 +0800

Prerequisites Read more on prerequisites. Clone the Repository 1git clone --depth 1 https://github.com/hbstack/theme-start Copy the Example Site 1cp -r theme-start/exampleSite ./start-page Change Working Directory 1cd start-page Reinitializing the Site 1rm go.mod go.sum config/_default/module.yaml 2hugo mod init [MODULE_PATH] The [MODULE_PATH] is the identifier of your site, which usually the repository URL, i.e. example.com/user/repo. Import the Theme and Search Engines TOML YAML JSON config/_default/module.toml 1[[imports]] 2 path = 'github.com/hbstack/theme-start' 3[[imports]] 4 path = 'github.

Search Engines

Fri, 15 Sep 2023 16:26:58 +0800

Search Engines Properties Name Type Description weight number Lower weight gets higer priority. Built-in Search Engines Name Identifier Module Version Baidu baidu github.com/hbstack/theme-start/engines/baidu Bing bing github.com/hbstack/theme-start/engines/bing DockDockGo duckduckgo github.com/hbstack/theme-start/engines/duckduckgo Google google github.com/hbstack/theme-start/engines/google Sogou sogou github.com/hbstack/theme-start/engines/sogou Wikipedia wikipedia github.com/hbstack/theme-start/engines/wikipedia Yahoo yahoo github.com/hbstack/theme-start/engines/yahoo Yandex yandex github.com/hbstack/theme-start/engines/yandex Search Engines Configuration TOML YAML JSON hugo.toml 1[module] 2[[module.imports]] 3 path = 'github.com/hbstack/theme-start/engines/google' 4[[module.imports]] 5 path = 'github.com/hbstack/theme-start/engines/bing' 6[[module.imports]] 7 path = 'github.com/hbstack/theme-start/engines/baidu' 8[[module.imports]] 9 path = 'github.

Header Breakpoint

Sun, 03 Sep 2023 00:52:53 +0800

Backgrounds The header was initially designed to be collapsed when the width is less than xxl breakpoint, otherwise expanding. The problem is that the header collapsed and looks empty under the lg and xl breakpoint. So we introduce the breakpoint parameter, and use the lg as default to suit most of the cases. Usage TOML YAML JSON hugo.toml 1[params] 2 [params.hb] 3 [params.hb.header] 4 breakpoint = 'xl' hugo.yaml 1params: 2 hb: 3 header: 4 breakpoint: xl hugo.

HB Framework Showcases

Sat, 02 Sep 2023 23:39:04 +0800

HB Framework Showcases Sharing with us about your sites built with HB, once the request is approved, your sites will be shown on our homepage and this page. How to Add My Sites? Using CMS (Recommended) We set up a CMS for open authoring, you can add and modify your sites here. Using CLI or GitHub Web UI Create a data file with following format to describe your site under the /data/sites/ folder, then create a PR and waiting for reviewing and merging.

Header Banner Animations

Sat, 02 Sep 2023 18:57:06 +0800

Configurations You’ll need to turn on the markup.goldmark.parser.attribute.block, to attach attributes on title and description. Similarly, you can attach the AOS animations on any content. TOML YAML JSON hugo.toml 1[markup] 2 [markup.goldmark] 3 [markup.goldmark.parser] 4 [markup.goldmark.parser.attribute] 5 block = true 6 title = true hugo.yaml 1markup: 2 goldmark: 3 parser: 4 attribute: 5 block: true 6 title: true hugo.json 1{ 2 "markup": { 3 "goldmark": { 4 "parser": { 5 "attribute": { 6 "block": true, 7 "title": true 8 } 9 } 10 } 11 } 12} Requirements Module github.

HLS Video Banner

Fri, 01 Sep 2023 10:57:18 +0800

Requirements Module github.com/hbstack/modules/banner Source Code

MPEG DASH Video Banner

Fri, 01 Sep 2023 10:57:18 +0800

Requirements Module github.com/hbstack/modules/banner Source Code

Normal Video Banner

Fri, 01 Sep 2023 10:57:18 +0800

Requirements Module github.com/hbstack/modules/banner Source Code Credit The images and videos are belong to BLACK MYTH WUKONG.

Header Banner

Sat, 26 Aug 2023 13:40:01 +0800

Module github.com/hbstack/header/modules/banner Repository ⭐ Please consider giving a star if your like it. Stars Version Used by Requirements License Usage See how to use modules. Properties Name Type Required Default Description img string Y - The image URL, you should at least specify the img or video. video object Y - The video. video.src string Y - The video URL. video.poster string Y - The video poster. video.type string Y - The video media type, i.

Header Themes

Thu, 27 Jul 2023 20:59:06 +0800

Header Pills Theme Module github.com/hbstack/header/themes/pills Repository ⭐ Please consider giving a star if your like it. Stars Version Used by Requirements License Usage See how to use modules. Header Classic Theme Module github.com/hbstack/header/themes/classic Repository ⭐ Please consider giving a star if your like it. Stars Version Used by Requirements License Usage See how to use modules. Header Tabs Theme Module github.com/hbstack/header/themes/tabs Repository ⭐ Please consider giving a star if your like it.

Contact Module

Tue, 20 Jun 2023 15:26:36 +0800

The contact module ships with a layout and shortcode for generating contact forms, which are designed to be compatible with mosts of form backends.

Blog Sidebar Overview

Mon, 19 Jun 2023 19:03:29 +0800

The blog module supports an optional sidebar layout.

Blog Sidebar Posts Module

Mon, 19 Jun 2023 19:03:29 +0800

This module shows the recent and featured posts on the blog’s sidebar.

Blog Taxonomies Sidebar Module

Mon, 19 Jun 2023 19:03:29 +0800

This module shows the taxonomies on the blog’s sidebar.

Install on Existing Sites

Sun, 18 Jun 2023 10:49:47 +0800

This guide introduces how to install HB and modules to existing sites.

Announcement Bar

Sun, 11 Jun 2023 18:36:36 +0800

The announcement bar module makes important thing stand out, such as news and project’s releases.

Inline Frame Module

Mon, 29 May 2023 22:26:59 +0800

This module ships with an universal inline frame shortcode.

Blog Staticman Comments Module

Mon, 29 May 2023 11:49:27 +0800

This module integrate the Staticman comments module with blog layout.

Docs Staticman Comments Module

Mon, 29 May 2023 11:49:27 +0800

This module integrate the Staticman comments module with docs layout.

Staticman Comments Module

Sun, 28 May 2023 23:54:58 +0800

The staticman comments module ships with flexible template for other modules, to generate comment form and show the nested comments.

Pagination

Sat, 13 May 2023 22:32:45 +0800

This module ships with an universal pagination template, which allows configuring by parameters, such as alignment, size and the number of siblings.

Preferred Language Module

Sat, 22 Apr 2023 22:35:07 +0800

When the defaultContentLanguageInSubdir is enabled, Hugo will redirect the home page to the default language site, e.g. / -> /en/. This module will attempt to redirect the site based on the user’s preferred language.

Blog Twikoo Module

Sat, 22 Apr 2023 14:40:58 +0800

This module add support for the Twikoo, a simple, safe and free comments system.

Docs Twikoo Module

Sat, 22 Apr 2023 14:40:58 +0800

This module add support for the Twikoo, a simple, safe and free comments system.

Header DocSearch Module

Fri, 21 Apr 2023 01:52:36 +0800

DocSearch is a free online search service for open source documentations sites.

Move to a New Domain Name

Wed, 19 Apr 2023 22:35:38 +0800

We recently moved our website to a new domain name - hbstack.dev.

Join Us

Mon, 17 Apr 2023 15:25:17 +0800

We’re glad you plan to join us, and we appreciate any contributions. You can support this project in the following ways.

Blog ToC Scrollspy Module

Mon, 17 Apr 2023 14:49:18 +0800

Automatically update table of content navigation to indicate which heading is currently active in the viewport.

Docs ToC Scrollspy Module

Mon, 17 Apr 2023 14:49:18 +0800

Automatically update table of content navigation to indicate which heading is currently active in the viewport.

Footer Beian Module

Mon, 17 Apr 2023 13:12:16 +0800

Beian (备案 in pinyin), it was designed for Chinese sites that display links about ICP records.

Add Custom HTML Markup

Sun, 16 Apr 2023 13:02:38 +0800

You may want to include custom HTML markup to extend functionalities, that’s quit easy to do that with HugoPress built-in hooks and HB custom hooks.

Deploy on Netlify

Sat, 15 Apr 2023 10:09:40 +0800

This article contains step-by-step instructions on how to deploy sites on Netlify.

Blog Hooks

Sat, 15 Apr 2023 02:44:01 +0800

The list of blog’s custom hooks.

Docs Hooks

Sat, 15 Apr 2023 02:44:01 +0800

The list of docs’s custom hooks.

Footer Hooks

Sat, 15 Apr 2023 02:44:01 +0800

The list of footer’s custom hooks.

Gallery Hooks

Sat, 15 Apr 2023 02:44:01 +0800

The list of gallery’s custom hooks.

PurgeCSS

Sat, 15 Apr 2023 01:02:56 +0800

Sometimes you may be surprised that some styles are missing from the production environment, most likely because they have been removed by PurgeCSS. This article describes how to prevent styles from being deleted by PurgeCSS.

Customize Scripts

Sat, 15 Apr 2023 00:55:27 +0800

This article offers a sample for showing how to add custom scripts.

Customize Styles

Sat, 15 Apr 2023 00:12:29 +0800

HB allows adding custom styles and overriding the Bootstrap default SCSS variables.

Slide Module

Fri, 14 Apr 2023 23:43:28 +0800

The module implements a simple slide, the blog related posts module was built on top of it.

Blog Content Panel

Fri, 14 Apr 2023 23:35:22 +0800

This module integrates content panel with blog module.

Docs Content Panel

Fri, 14 Apr 2023 23:35:22 +0800

This module integrates content panel with blog module.

Content Panel Module

Fri, 14 Apr 2023 22:30:00 +0800

This module display a content panel on single pages, which includes translations, comments and repo buttons.

Create Docker Images for Hugo Sites

Fri, 14 Apr 2023 21:22:22 +0800

The article describes how to create a Docker image for Hugo site, then you’re able push it to container registry, and deploy on self-hosted server, Docker Swarm, k8s cluster and so on.

Deploy Site on Github Pages

Fri, 14 Apr 2023 21:15:18 +0800

This guide shows how to deploy your site on GitHub Pages via GitHub Actions.

Deployment Overview

Fri, 14 Apr 2023 17:47:25 +0800

This article introduces the key points of deployments.

PWA Module

Fri, 14 Apr 2023 16:14:51 +0800

This module integrates the Hugo PWA module with HB, to customize the offline page and tweak some parameters.

Bootstrap Module

Fri, 14 Apr 2023 15:54:58 +0800

This module ports Bootstrap module to HB, to add missing components.

Gallery Breadcrumb

Fri, 14 Apr 2023 00:00:00 +0000

This module display the breadcrumb for gallery layout.

Gallery Overview

Thu, 13 Apr 2023 00:00:00 +0000

The gallery module provides a simple layout for images.

Core Module

Wed, 12 Apr 2023 22:28:04 +0800

The github.com/hbstack/hb is the core module of HB framework, which automatically loads and compiles the module’s SCSS and TypeScript, as well as rendering HTML.

Shortcodes

Tue, 11 Apr 2023 00:00:00 +0000

This article will briefly describe how to use shortcodes to enrich your content and list some of the available shortcodes. Using Shortcodes Learn more on use shortcodes. Hugo Built-in Shortcodes Figure: an extension of the image syntax in Markdown. Gist: to display a GitHub gist. Highlight: to display a highlighted code. Instagram: to display an Instagram post. Param: gets a value from the current Page’s params set in front matter, with a fallback to the site param value.

Meta Modules

Fri, 31 Mar 2023 18:21:35 +0800

The meta modules do not provide any functionalities, they are just a set of modules, to simplify the installation and uninstallation of the modules.

Fri, 31 Mar 2023 17:16:29 +0800

This module shows the related posts below the post content.

Blog Breadcrumb

Fri, 31 Mar 2023 16:50:16 +0800

This module display the breadcrumb for blog layouts.

Docs Breadcrumb

Fri, 31 Mar 2023 16:50:16 +0800

This module display the breadcrumb for docs layout.

Featured Image

Fri, 31 Mar 2023 16:50:16 +0800

This module shows the featured image above the post content if present.

Docs Featured Image Module

Fri, 31 Mar 2023 16:50:16 +0800

This module shows the featured image above the doc content if present.

Doc Navigation

Fri, 31 Mar 2023 16:47:30 +0800

The doc nav module generates the menus for navigating to previous and next docs of same sections.

Blog Post Navigation

Fri, 31 Mar 2023 16:47:30 +0800

The post nav module generates the menus below the post content, to navigate to previous and next posts of same sections.

Heading Sign

Fri, 31 Mar 2023 16:44:00 +0800

The heading sign module shows the section sign (anchor link) when hovering on headings.

Docs Heading Sign

Fri, 31 Mar 2023 16:44:00 +0800

The heading sign module shows the section sign when hovering on headings.

Disqus

Fri, 31 Mar 2023 16:42:09 +0800

This module adds support for the Disqus comments engine.

Docs Disqus

Fri, 31 Mar 2023 16:42:09 +0800

This module adds support for the Disqus comments engine.

Blog Utterances Comments Engine

Fri, 31 Mar 2023 16:28:09 +0800

This module adds support for the Utterances comments engine, which built on top of GitHub issues.

Utterances

Fri, 31 Mar 2023 16:28:09 +0800

This module adds support for the Utterances comments engine, which built on top of GitHub issues.

Blog Giscus Comments Engine

Fri, 31 Mar 2023 16:20:09 +0800

This module adds support for the Giscus comments engine, which powered by GitHub Discussions.

Docs Giscus Comments Engine

Fri, 31 Mar 2023 16:20:09 +0800

This module adds support for the Giscus comments engine, which powered by GitHub Discussions.

Blog Authors

Fri, 31 Mar 2023 15:59:18 +0800

The blog module supports multiple authors by default.

Blog Overview

Fri, 31 Mar 2023 15:45:47 +0800

The blog module provides the basic layouts and templates for blog site.

Docs Overview

Fri, 31 Mar 2023 15:45:47 +0800

The docs module provides the basic layouts and templates for docs site, it’s useful for writing project documentations, digital garden, users guides and tutorials.

Creating Content

Tue, 07 Mar 2023 00:50:54 +0800

Content is the most basic and core part of a site. This article will introduce some basic concepts of content and how to create it.

Deploy on Cloudflare Pages

Sun, 05 Mar 2023 15:13:21 +0800

In this article, you’ll learn how to deploy your site on Cloudflare Pages.

Background Image Module

Sun, 19 Feb 2023 22:11:36 +0800

As literally, this module sets the background image for pages.

No Script Module

Sun, 19 Feb 2023 18:19:29 +0800

The noscript module display a alert message if the user browser doesn’t support JavaScript.

Bigger Picture Module

Sun, 19 Feb 2023 13:39:32 +0800

When clicking any non-linkable image, the bigger picture module shows the original size of the the clicked image.

Footer Menus

Sun, 19 Feb 2023 08:14:04 +0800

This article describes how to configure the footer’s menus.

Base Module

Sat, 18 Feb 2023 19:18:50 +0800

The base module provides several basic layouts and templates for other modules, such as a landing page, a custom 404 page, a header and a footer module.

Search Module

Sat, 18 Feb 2023 18:55:03 +0800

The search module integrates HB with the Hugo Search Module, a powerful, flexible and responsive Hugo client side fuzzy search module.

Multilingual Configuration

Sat, 18 Feb 2023 10:42:27 +0800

Previously, we had a rough understanding of Hugo’s configuration structure, and then we will introduce how to configure multilingual sites.

Menus Configuration

Fri, 17 Feb 2023 23:18:18 +0800

This article describes the properties of the menu entry and how to config the menus.

Configuration Structure

Fri, 17 Feb 2023 23:18:18 +0800

This article will try to briefly introduce Hugo’s configuration structure.

Header Menus

Fri, 17 Feb 2023 00:43:12 +0800

This article describes how to configure the header’s menus.

Footer Overview

Fri, 17 Feb 2023 00:39:18 +0800

This module is a universal footer, which ships with menus and some useful sub modules, i.e. social links.

Socials Module

Fri, 17 Feb 2023 00:20:03 +0800

The socials module is a helper to generate social links.

Header's Language Picker Module