Before After Repeater Block

A before/after image comparison repeater block for Dewsign's Nova Repeater Blocks.

Installation & Usage

This package requires on two installations, a composer package for the Laravel side of things, and a npm package for the Vue.js component.

composer require dewsign/before-after-repeater

npm i vue-before-after-slider

php artisan migrate

Register the Vue component:

//resources/js/app.js
//...
 
import BeforeAfter from 'BeforeAfter'
 
Vue.use(BeforeAfter)

You can change the image sizes in the before-after-repeater.php config file.

To use, add this repeater to a page and set the original and overlay images. If required, you can set a title and a subtitle which will output above the block.