Permalink
Browse files

Adding script and instructions for creating zen sub themes. (Supporte…

…d in Hugo 0.42.)
  • Loading branch information...
frjo committed Jul 8, 2018
1 parent 1424e30 commit b1f724e898882882430eaeec7e924a27dbc5211e
Showing with 54 additions and 1 deletion.
  1. +21 −0 README.md
  2. +32 −0 create_sub_theme.sh
  3. +1 −1 theme.toml
View
@@ -8,6 +8,7 @@ This is a port of the [Zen](https://www.drupal.org/project/zen) theme by [JohnAl
The [old branch](https://github.com/frjo/hugo-theme-zen/tree/old) has the original Zen grid system that uses floats and clearfixes like they did in the stone age.
## Features
* A mobile menu
@@ -27,6 +28,8 @@ The [old branch](https://github.com/frjo/hugo-theme-zen/tree/old) has the origin
* Responsive design
* RSS and JSON feeds with full content
* Search with DuckDuckGo
* Sub theme support (Theme Components)
## Sites using the Hugo Zen theme
@@ -35,6 +38,7 @@ The [old branch](https://github.com/frjo/hugo-theme-zen/tree/old) has the origin
* [Helmer Grundström](https://www.helmergrundstrom.se/)
* [xdeb.org](https://xdeb.org/)
## On the large screen
![screenshot](https://raw.githubusercontent.com/frjo/hugo-theme-zen/master/images/tn.png)
@@ -60,6 +64,23 @@ $ git clone https://github.com/frjo/hugo-theme-zen.git zen
[Hugo - Installing Hugo](https://gohugo.io/getting-started/installing/)
## Create a zen subtheme
Since Hugo 0.42 there is sub them support via [Theme Components](https://gohugo.io/themes/theme-components/). This makes it easy to update the base theme without overwriting customisation.
Navigate to the theme folder where you have placed the zen base theme. Run the included "create_sub_theme.sh" script like this.
```
$ ./zen/create_sub_theme.sh
```
Enter a name for your sub theme when asked for. In the site config file add your sub theme name first and "zen" after it. Hugo will now first look in the sub theme for files and if they are not there look in the zen base theme.
Edit all css/sass only in the sub theme and add any custom layouts etc. If there is a need to edit e.g. layouts from the zen base theme make sure to copy them over to the sub theme and edit them there.
This way all customisation are in the sub theme, making it easy to update the base theme.
## config.yaml example
All the "params" are optional.
View
@@ -0,0 +1,32 @@
#!/usr/bin/env bash
# shell script hardening
set -euo pipefail
# This script creates a new sub them from the zen base theme.
# (Run chmod 700 on this file to make it executable)
if [[ ! -d "zen" || "${PWD##*/}" != "themes" ]]; then
echo "Error: This script must be run from the theme folder."
echo "Usage: ./zen/create_sub_theme.sh"
fi
if [[ -z "${1-}" ]]; then
echo -n "Enter a human-readable subtheme name: "
read -e inputname
else
inputname="$1"
fi
human=`echo $inputname | sed -e 's/"/\\"/g'`
themename=`echo $inputname | tr [:upper:] [:lower:] | sed -e 's/[\-\ ]/_/g' -e 's/[^a-z0-9_]//g'`
mkdir "$themename"
cp -p zen/.eslintrc zen/.gitignore zen/.sass-lint.yml $themename/
cp -p zen/gulpfile.js zen/package-lock.json zen/package.json zen/theme.toml $themename/
cp -pr zen/sass $themename/
cp -pr zen/static $themename/
sed -e 's/^\(name = \).*$/\1"'"$human"'"/g' -e 's/^\(description = \).*$/\1"A Zen sub-theme"/g' $themename/theme.toml > $themename/theme.toml.temp
mv -f $themename/theme.toml.temp $themename/theme.toml
View
@@ -4,7 +4,7 @@ homepage = "https://github.com/frjo/hugo-theme-zen"
license = "GPLv2"
licenselink = "http://www.gnu.org/licenses/old-licenses/gpl-2.0.html"
tags = ["multilingual", "responsive", "blog", "search", "micro"]
features = ["multilingual", "responsive", "grid", "sass", "gulp", "search", "matamo", "jsonfeed"]
features = ["multilingual", "responsive", "grid", "sass", "gulp", "search", "matamo", "jsonfeed", "subtheme"]
min_version = 0.28
[author]

0 comments on commit b1f724e

Please sign in to comment.