What's on this page

CSS, JavaScript and processing

fingerprint

Add the file content finger print to the file name.

{{ asset(path)|fingerprint }}
{{ path|fingerprint }}

Examples:

{{ asset('styles.css')|fingerprint }}

Minifying a CSS or a JavaScript file.

{{ asset(path)|minify }}

Examples:

{{ asset('styles.css')|minify }}
{{ asset('scripts.js')|minify }}

Minifying a CSS string.

{{ variable|minify_css }}

{% apply minify_css %}
{# CSS here #}
{% endapply %}

Examples:

{% set styles = 'some CSS here' %}
{{ styles|minify_css }}

<style>
{% apply minify_css %}
  html {
    background-color: #fcfcfc;
    color: #444;
  }
{% endapply %}
</style>

Minifying a JavaScript string.

{{ variable|minify_js }}

{% apply minify_js %}
{# JavaScript here #}
{% endapply %}

Examples:

{% set script = 'some JavaScript here' %}
{{ script|minify_js }}

<script>
{% apply minify_js %}
  var test = 'test';
  console.log(test);
{% endapply %}
</script>

Compiles a Sass string to CSS.

{{ variable|scss_to_css }}

{% apply scss_to_css %}
{# SCSS here #}
{% endapply %}

Alias: sass_to_css.

Examples:

{% set scss = 'some SCSS here' %}
{{ scss|scss_to_css }}

<style>
{% apply scss_to_css %}
  $color: #fcfcfc;
  div {
    color: lighten($color, 20%);
  }
{% endapply %}
</style>

Compiles a Sass file to CSS.

{{ asset(path)|to_css }}
{{ path|to_css }}

Examples:

{{ asset('styles.scss')|to_css }}

Outputs the content of an Asset.

{{ asset(path)|inline }}

Example:

{{ asset('styles.css')|inline }}

Returns the data URL of an asset.

{{ asset(path)|dataurl }}
{{ asset(image_path)|dataurl }}

What's on this page