Web Developer Guidelines
This document is for website developers only for changing the Nuevo Foundation workshop project templates and style.
Before getting started
Before adding/updating the website, ensure you have synced with the project team and the existing work in the Project Backlog .
Follow the instructions in the Getting Started page to install Git and Hugo to test the project locally.
Web design styles and structure
- Images: Website images should be
- CSS Ignore the SCSS files and just use CSS files in
/themes/docdock/static/css/Make sure to add a reference to the CSS you want to include in the
Dissecting a Workshop Page
- Full page template: To see all of the components of a page including header, menu, body, footer, see
- Head: Meta, CSS, and JS files
- Top / Menu Navigation: Don’t use docDock config.toml values, instead add/edit HTML in:
- Left Menu:
- Footer Navigation:
- Metadata Box:
Help, the CSS is gone
One challenge with Hugo is that a key parameter in the build is the
baseURL variable. If the content is loading, and the CSS is not, it’s likely an issue with the
You can change the
baseURL when building content instead of changing the config.toml file. The example below will minify the CSS and JS, set the baseURL to the production .org URL and copy the results to the
hugo --minify --baseURL "https://workshops.nuevofoundation.org/"
Tips and Tricks
- Ignore Public: By default, running
hugowith no parameters will build the site to the public directory. Make sure you do not add the public directory to source control (it’s in gitignore now).
- Left Nav: You can hide content from the left nav by setting metadata on the file hidden: true (like this workshop’s index.md markdown!)
- Partials: For reusable components to a page, create a new partial under