For projects that are published, the asset function returns the CDN path of the given asset path:
{{ asset('images/header-background.png') }}
{{ asset(some_var) }}
The asset function only resolves files from the public directory in the project folder.
Filters
For convenience, Canvas includes filters that can be used to easily generate img, style, or script HTML tags:
{{ asset('images/logo.png') | image_tag }}
{# outputs: <img src="images/logo.png" /> #}
{{ asset('css/bootstrap.min.css') | stylesheet_tag }}
{# outputs: <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" media="all"> #}
{{ asset('js/jquery.min.js') | script_tag }}
{# outputs: <script src="js/jquery.min.js" type="text/javascript"></script> #}
{{ 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.3/jquery.min.js' | script_tag }}
{# outputs: <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.3/jquery.min.js" type="text/javascript"></script> #}