Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/jhvanderschee/hugobricks


https://github.com/jhvanderschee/hugobricks

Last synced: about 2 months ago
JSON representation

Awesome Lists containing this project

README 

        
[![](/hugobricks.jpg)](https://vimeo.com/862118474)



# What is Hugobricks?



[View DEMO website](https://www.hugobricks.preview.usecue.com/)



Hugobricks is a free website theme for Hugo. It makes building Hugo websites child’s play due to its stackable (LEGO-like) content bricks. Stack an intro brick on top of some image bricks and a pricing table and build a complete website in seconds!



In the past you may have chosen a Wordpress theme and adjusted the images, colors and fonts to the needs of your client. In combination with tools like Gutenberg blocks and page builders like Elementor there was little that could compete with the development speed and flexibility that Wordpress offered. With Hugobricks we bring these advantages to the Jamstack eco-system. If you choose for the Hugobricks theme you get not just a head start, tremendous flexibility and lots of ready to use and reusable components, but also a lightning fast and unbreakable architecture. What are you waiting for? The future is here!



## What’s included in Hugobricks?



Hugobricks is a comprehensive starter theme that includes everything you need to get started with your Hugo project.



- 10+ Pre-build pages

- 99+ Google Pagespeed Score

- Built with Hugo and CSS variables for easy styling

- Fully responsive on all devices

- SEO-optimized for better search engine rankings



##  Hugobricks that are available:



## Hugobricks theme features



See follow-up / [discuss here](https://github.com/jhvanderschee/hugobricks/issues/72)



[View roadmap](./DOCUMENTATION.md)



[View Online Documentation](https://www.hugobricks.preview.usecue.com/docs/)



## Hugobricks workflow



Hugobricks aims to enhance the Hugo web framework by providing a variety of pre-made bricks for straightforward website-building. Our companion project, [hugocodex](https://hugocodex.org), guides beginners in starting a Hugo project from scratch. For those who already have experience with Hugo and want to use it for rapid prototyping and iterating, Hugobricks offers premade websites and customizable components powered by Hugo. Cloning this repository allows you to start building lightning-fast static sites with flexibility and ease with and already working website. Here is an example of two bricks (title and cta):



```

---

title: Page title

---

{{< brick_title >}}



# Title 1

Your first paragraph with some lorem ipsum dolor sit amet.



{{< /brick_title >}}

{{< brick_cta >}}



{{< /brick_cta >}}

```



## Get started with Hugobricks



In order to get a working website you should:



- clone our repository and start building with stackable content bricks

- enjoy your already working hugo website, plan your changes/iterations

- re-use default hugobricks

- and/or customise them !



## Hugobricks under the Hood



Hugobricks is build with the regular [Hugo](https://gohugo.io/overview/introduction/) building blocks, like [shortcodes](https://gohugo.io/content-management/shortcodes/#what-a-shortcode-is), [partials](https://gohugo.io/templates/partials/) and [layouts](https://gohugo.io/templates/base/). Hugobricks takes advantage of these things to allow content re-use, pivot around content and layouts, and calling the required styling and functional logic.



## Hugobricks Feedback 



Make your wishlist. Missing a given Hugobrick? [Let us know.](https://github.com/jhvanderschee/hugobricks/issues/5)



## Credits and licenses



The functionality is inspired by the many [Gutenberg Block Plugins](https://wpastra.com/plugins/wordpress-gutenberg-block-plugins/) that are available online. The design is based on the MIT licensed [Hugoplate from Zeon Studio](https://github.com/zeon-studio/hugoplate.git). The fonts and icons are Apache Licensed and come from [Google Fonts](https://fonts.google.com) and [Google Material Symbols](https://fonts.google.com/icons). The illustrations are free to use but require [an attribution to Storyset](https://storyset.com/terms). The avatars are CC0 licensed and come from [Pravatar](https://www.pravatar.cc/images). The paragliding photos are provided by and property of the [Flyspot Airsports & Travel Agency](https://flyspot.com.tr/) and cannot be used elsewhere without written permission of Flyspot. All other photos come from [Unsplash](https://unsplash.com/license) and are free to use. The social media icons (Facebook, Instagram, etc) belong to the respective social networks/their owners.