Newsletter
Join the Community
Subscribe to our newsletter for the latest news and updates
Start a GitHub Pages website powered by Jekyll using Foundation/SCSS in under 5 minutes!
Jekyll Foundation 6 Starter is a free boilerplate template for launching a GitHub Pages website powered by Jekyll and styled with the Foundation 6 front-end framework using SCSS, designed to get a site live in under five minutes.
It is a starter repository created by Daigo Fuji that combines the Jekyll static site generator with Foundation 6 (via Bower) and SCSS source files compiled by Gulp. As input, it takes a standard Jekyll project structure with configurable HTML, Markdown, and SCSS files; as output, it produces a static, responsive website that can be deployed directly to GitHub Pages. The template runs on any machine with Ruby, Node.js, and Bundler installed, and it includes a working example site at daigofuji.github.io/jekyll-foundation-6-starter.
scss/_settings.scss and related files into CSS, with a watch task that runs on npm start.username.github.io and use the master branch) and project pages (use a gh-pages branch)._config.yml, HTML and Markdown files, and the _layouts/default.html base layout; the navigation is managed in _include/nav.html.npm install and bundle install, you run npm start to handle SCSS and bundle exec jekyll serve --watch to serve the site at http://0.0.0.0:4000/._config.yml and page content to create a polished landing page or documentation hub for a repo.The workflow splits into two commands: npm start runs the Gulp task that compiles SCSS to CSS and watches for changes, while bundle exec jekyll serve --watch runs the Jekyll site locally. For deployment, you either rename the repository for user/organization pages or create a gh-pages branch for project pages, then push the contents to GitHub.
Yes, the template itself is shared free of charge, and the README notes that most of the included products are MIT-licensed, which allows commercial use.
You need Ruby (with Bundler) and Node.js. The README includes commands to install them via Homebrew on macOS and troubleshooting for common bundle install issues.
Yes, the README provides explicit instructions: create a gh-pages branch, download the repo contents, replace the branch contents, and push to GitHub.
You edit _config.yml for site settings, HTML/Markdown files for content, scss/_settings.scss to change Foundation's Sass variables, and _include/nav.html for the navigation bar.
The README suggests installing Gulp globally with npm install gulp -g and updating Foundation with bower update foundation-sites --save to resolve version issues.
