Kirik
6269d3323c
- Add desktop.webp (2732x1535) for desktop devices and mobile.webp (556x1535) for mobile - Create adaptive-background.css with media queries (max-width: 736px for mobile) - Update config.toml to use desktop.webp as default background - Modify htmlhead.html to include adaptive-background.css - Update preload-images.html for responsive image preloading - Optimize background loading based on device screen width Both images include overlay.png and gradient overlay for consistent design. Mobile version (124 KB) is 5.8x lighter than desktop version (716 KB).
Hugo Theme Massively
Massively theme ported from HTML5 UP for use with the Hugo static site generator.
Demo
https://hugo-theme-massively.netlify.com/
Setup
Configuration
See the demo's configuration as an example:
https://github.com/curtiscde/hugo-theme-massively/blob/master/exampleSite/config-prod.toml
Hugo Internal Templates
The theme currently also supports the following "internal templates" supplied by Hugo
Cover Image
The cover image URL is hard-coded, therefore to replace this add an image to the following location in your Hugo application:
/static/images/bg.jpg
Supported Languages
Custom Front Matter
disableComments- If set totruethis will disable comments on the post when Disqus is enabled.
Custom <head>
If you wish to add custom CSS overrides, or other elements in the <head>, then this can be done by adding the following to the root of your Hugo app: layouts/partials/htmlhead.custom.html. Any content added to this file will then be injected at the end of the <head>.
Development
Example Site Production Deployment
Production Deployment
$ cd exampleSite
$ hugo --config config-prod.toml
Running Locally
$ npm i
$ npm run hugo-dev
OR
$ cd exampleSite
$ hugo server --themesDir ../..
Original Theme Credits
License
This hugo theme is licensed under the Creative Commons Attribution 3.0 License.
Read More - LICENSE