Inline assets for Statamic
Require it using Composer.
composer require octoper/statamic-inline-assets
Inline assets will inline your CSS or JS file to your HTML, or inline a file encoded with base64.
Inline assets can help you speed of your Statamic website by inlining critical CSS you can check more about that by reading this article Extract critical CSS
Pass a path to your file from the public directory to inline_assets tag.
<style>
{{ inline_assets:css src="css/site.css" }}
</style>or
<script>
{{ inline_assets:js src="js/site.js" }}
</script>You can also minify your js or css assets.
<script>
{{ inline_assets:js minify="true" src="js/site.js" }}
</script>You usually got a chicken or the egg problem with critical css, so you can ignore if missing
<script>
{{ inline_assets:css ignore-missing="true" src="css/site.css" }}
</script>You can also inline your file as an base64 encoded data stream, for example taking your favicon and including it inline.
<link rel="icon" type="image/x-icon" href="data:image/x-icon;base64,{{ inline_assets:base64 src="favicon.ico" }}"/>You usually got a chicken or the egg problem with critical css, so you can ignore if missing
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml;base64,{{ inline_assets:base64 ignore-missing="true" src="favicons/favicon.svg" }}">If you discover any security related issues, please email [email protected] instead of using the issue tracker.
The MIT License (MIT). Please see License File for more information.