teamnovu/statamic-image-placeholder

A Statamic Addon that creates blurred image placeholders for headless use

1.1.3 2021-03-29 11:04 UTC

This package is auto-updated.

Last update: 2024-06-29 05:07:34 UTC


README

Statamic-Image-Placeholder

This statamic 3 add-on generates tiny, blurred svg placeholders for images when they are uploaded. These placeholders can be retrieved from the api when using statamic as a headless cms.

Use this together with vue-statamic-image or nuxt-statamic-image to display responsive images with a fast, tiny and blurred placeholder.

Installation

composer require teamnovu/statamic-image-placeholder

Setup

For this add-on to work correctly you need to set the following settings in your statamic config

  • config/assets.php -> 'secure' => false
  • config/assets.php -> 'cache_meta' => true

How it works

This add-on generates tiny, blurred svg versions of an image as soon as it is uploaded. It then saves a placeholder property with the svg contents encoded as a base64 string in the asset's metadata.