Low commit activity in last 3 years
A long-lived project that still receives updates
Jekyll include_sass tag is a shorthand tag for including SASS/SCSS file inside head tag. It's useful when you don't want to reference external CSS, for example, in AMP.
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
 Dependencies

Runtime

>= 3.9
 Project Readme

Gem Version CI

Jekyll::IncludeSass

Jekyll include_sass tag which includes and converts SASS/SCSS file. This is useful for Google AMP HTML.

Supported CSS in AMP

Like all web pages, AMP pages are styled with CSS, but you can’t reference external stylesheets.

All styles must live in the head of the document.

via. Supported CSS

Installation

  1. Add the following to your site's Gemfile:
gem 'jekyll-include_sass'
  1. Add the following to your site's _config.yml:
gems:
  - jekyll-include_sass

Usage

Put your style.scss in Jekyll's _includes directory.

for HTML

Add the following inside <head> in your site's template(s):

<style type="text/css">
{% include_sass style.scss %}
</style>

for AMP

<style amp-custom>
{% include_sass style.scss %}
</style>

SASS/SCSS Supported

You can include either SASS or SCSS with include_sass depending on extension.

Contributing

Bug reports and pull requests are welcome on GitHub at https://github.com/toshimaru/jekyll-include_sass.

License

The gem is available as open source under the terms of the MIT License.