@notiz/scully-plugin-medium-zoom

scully plugin to add medium zoom to images

Usage no npm install needed!

<script type="module">
  import notizScullyPluginMediumZoom from 'https://cdn.skypack.dev/@notiz/scully-plugin-medium-zoom';
</script>

README

scully-plugin-medium-zoom

npm version

scully-plugin-medium-zoom is a postRenderer plugin for Scully adding a medium style zoom to your images using medium-zoom. This plugin adds data-zoomable attribute to each img tag in your route.

📦 Installation

To install this plugin with npm run

$ npm install @notiz/scully-plugin-medium-zoom --save-dev

Usage

Add the plugin to the defaultPostRenderers in your scully.config:

require('@notiz/scully-plugin-medium-zoom');

exports.config = {
  projectRoot: './src/app',
  defaultPostRenderers: ['mediumZoom'],
  routes: {},
};

If you want to use the plugin for a specific route do:

require('@notiz/scully-plugin-medium-zoom');

exports.config = {
  ...
  routes: {
    '/blog/:slug': {
      type: 'contentFolder',
      slug: {
        folder: './content/blog'
      },
      postRenderers: ['mediumZoom']
    }
  }
  ...
};