Hugo Themes

Prev/Next: All Themes

Hugo W3 Simple

A simple theme for Hugo, powered by W3.css

Download
Hugo W3 Simple

Hugo W3 SIMPLE

Demo | Live | 中文说明

Hugo W3 Simple is a Hugo theme written by Jesse Lau . The main motivation for writing this theme was to provide a really minimal theme with W3 CSS included.

Features:

  • W3.css - small and fast
  • Responsive
  • W3 code color js - small and fast code highlight solution.
  • Twitter Card
  • Google Analytics
  • Disqus or isso comment system
  • One Signal Push
  • Social share & Bookmark bar
  • Shortcodes:Info, Warning, Colorcode, quote. Demo Here
  • Sphinx or Manticore search supported. Output xml file which can be indexed by sphinx and manticore search. Example site can not include search function because it need server-side setting. Live Search function Demo Here
  • Table of content and back to top button on scroll.
  • Alllist, Grid style and simple list style.
  • All posts in one page. With a filterable, sortable and responsive table powered by w3.js. Live Demo Here.
  • Google translate.
  • Social icon.
  • Multilingual.
  • Glowing style logo
  • Scroll indicator
  • Google Adsense autoads
  • Detect adblock and display allow ads notice on scrolling over 2000px if the users have adblock installed.
  • Cookie law support.
  • Lazy Load images - loading images on websites asynchronously — that is, after the above-the-fold content is fully loaded, or even conditionally, only when they appear in the browser’s viewport. This means that if users don’t scroll all the way down, images placed at the bottom of the page won’t even be loaded. Enable this function to make the page load very fast if it has lots of images. Live Demo Here. This page includes 21 images. Before lazy load the page size is 854kb and load time is 3.5s.Before lazy loadAfter lazy load the page size is 524kb and load time is 2.8s After lazy load

Screenshot

Grid style

HUGO W3 SIMPLE

Simple list style

HUGO W3 SIMPLE DEVICE

All posts in one page. With a filterable, sortable and responsive table

HUGO W3 SIMPLE all posts

Install: 

cd themes
git clone https://github.com/jesselau76/hugo-w3-simple.git

How to configure?

It is very simple. You can edit the example config. toml file from examplesite.

Multilingual

Hugo W3 Simple supports multilingual. example site includes both English and Chinese version. You should put your posts on ./content/{langcode}/ folder.

Search Page

To use search function, you need create ./content/{langcode}/search/index.md file. Please see exampleSite folder.

All posts

To use all posts function, you need create ./content/{langcode}/allposts/_index.md file. Please see exampleSite folder.

Favicon

In order to customize the favicon you need to place the favicon.ico file in the static folder at the root of your site, which will overwrite those files in the themes/even/static/ folder.

Update Theme 

cd  themes/hugo-w3-simple/
git pull

License

Released under the MIT License.

Acknowledgements

See Also