This is a simple, minimalistic theme, which is inspired by Apple's Newsroom page. It uses grid css, flexbox & js (no jQuery, or related libraries).
- Blog
- Modern
- Responsive
- Deeplinks
- Dark Mode
- Supports native lazy loading of images & iframes
- Syntax highlighting
For all content published using markdown, deeplinks will be added to the pages so that you can share with precision 😃 Just hover on a heading and the link button will pop. Click it to copy.
Add this theme as a Git submodule inside your Hugo site folder:
git submodule add https://github.com/onweru/newsroom.git themes/newsroom
Theme hugo sass and hugo-extended version.
You can configure the site as follows:
-
General Information
Use
config.toml
file. -
menu, footer
See the yaml files inside the
data/
directory.
Follow the exampleSite/
; specifically, the content directory
Today, operating systems have a system-wide light ~ dark mode switch. Your website will adapt to the user's preferred lighting mode. Still, if the user wants to opt in or out of darkmode, there's a UI control for that too in the menu 😊.
Under params
add disableDarkMode = true
to your config.toml
file. If your site is based on the exampleSite, the value is already included; you only need to uncomment it.
⚠️ If you disable darkmode, the UI control for toggling darkmode will remain in place. This way, the user can decide which mode they would like to use while browsing your website
If you wish, you can opt to use Chroma.
If you like, you could use disqus on your site. To enable disqus on your site, simply, add the line below to you config.toml
file. If you're working off the exampleSite, the line is already there; just uncomment it.
disqusShortname = "yourdiscussshortname"
Remember to edit the
yourdiscussshortname
appropriately.
From your disqus dashboard, set your scripts color scheme
to auto. See screenshot below
This theme ships with 2 custom shortcodes (they both use positional parameters):
-
Video This shortcode can be used to embed a youtube video with custom styling. It takes a solo positional parameter.
... {{< video "youtubeVideoID" >}} ...
-
Picture You want to use darkmode images when darkmode is enabled on a device and a regular image on lightmode? It takes 3 positio