CSS not rendering Liquid properly

Help
1

Hello,

I’ve been trying to use a YAML files in order to allow easy customization for the sites colors/fonts/etc. When creating custom headings and such, I want to use Liquid to specify the color for different classes. However, when the site loads, the liquid does not change to the CSS. The CSS works as expected if I change the #{{ site.data.template.color.primary }} to a normal hex color such as #323232. I do not know if it is an issue with the interpretation order, as I could not find why it would conflict from the jekyll website, but if i’m wrong, please point me out.

jekyll
jekyll.png1152×648 20.6 KB

Thanks

2

Jekyll does not process Liquid in Sass partials out-of-the-box. You’ll have to predefine Sass variables in your loader file (usually assets/css/styles.scss) and then use those Sass variables in your partials.

Alternatively, you may want to checkout third-party plugins such as jekyll-assets…

3

Hello,

I fixed the issue by adding
image
empty YAML to the top of the CSS file. I wanted to post this so if anyone is browsing the forums for the same issue as me, they can view my solution.