jasfordadobe/pagebuilder-animate

Page Builder content type for Animate.

0.0.1 2021-01-22 16:48 UTC

Requires

• php: ~7.3.0||~7.4.0
• magento/framework: *
• magento/module-page-builder: *

proprietary

README

Adding CSS animations to Page Builder. The aim is to make pages and content more engaging through the use of movement. Using CSS animations is preferred over JS animations as it's repeatable and well supported.

This also includes JS which will trigger the animation when it comes into viewport.

Installation

Composer instructions to go here.....

Usage

Once installed, it will show within your Page Builder CMS interface under Layout.

Drag the element on to screen, within a row or column. Drag other content elements into the animation area, and use the settings option to adjust the Animation Name, Animation Duration, Animation Delay and Animation Iteration.

To do

• Test thoroughly
• Add defaults to Animation settings
• Make the "scroll to viewport" offset adjustable
• Make it easier to add/remove animations

Boring stuff

This code is provided "as is" and not intended for production use. It is created to improve my own personal workflow and is not endoresed or supported by myself, my employer or anyone else associated with the code. If you use this, you do so at your own risk, and with full knowledge of what you're doing.

Animate.css

This component makes use of the Animate.css library which is available on an Open Source MIT license.

Josh.js

This component makes use of the Josh.JS library whihc is available on an Open Source MIT license.