Skip to content
Martin Svoboda edited this page Sep 26, 2018 · 9 revisions

There exists two ways how to use this template:

  • Direct use - the most straightforward is fork this repo and directly edit files in it.
  • Theme use - more flexible way is use this repository as theme for your own design system. This approach enable to split appearance of DS from its content. More suitable for agencies who delivers different design systems for several clients.

Direct use

  1. Install Ruby
  2. In console install Ruby bundler by gem install bundler
  3. In console go to forked repository and install all requirements bundle install
  4. In console run bundle exec jekyll serve to startup your design system locally.
  5. Visit http://localhost:4000/design-system-template/ in your browser to see the design system. You can open it in your browser on address http://localhost:4000/design-system-template/

Use as Jekyll theme

You can use Design System Template as Jekyll theme. Future propagation of changes and bugfixes from theme to your site will be easier. You can override any of the theme defaults with your own site content. To replace any part of theme just make a copy of the specific file you wish to modify, or create the file from scratch giving it the same name as the file you wish to override.

  1. Install Ruby
  2. In console install Ruby bundler and Jekyll by gem install bundler jekyll
  3. At the end of Gemfile add following line
gem "jekyll-remote-theme"
  1. Copy _config.yml file from this repository and uncomment line with remote_theme: lundegaard/design-system-template. Note: You may also specify a branch, tag, or commit to use by appending an @ and the Git ref (e.g., lundegaard/[email protected]). If you don't specify a Git ref, the master branch of the theme will be used.

  2. In console run bundle install to install the plugin

  3. In console run bundle exec jekyll serve to startup your design system locally.

  4. Visit http://localhost:4000/design-system-template/ in your browser to see the design system. You can open it in your browser on address http://localhost:4000/design-system-template/