Concrete5 add-ons
Installation Instructions
1. Unzip this file in your site's packages/ directory.
2. Login to your site as an administrator.
3. Find the "Add Functionality" page in your dashboard.
4. Find this package in the list of packages awaiting installation.
5. Click the "install" button.
Animation Settings
1. Login to your site as an administrator.
2. Find the "Add animation Settings" page in your dashboard.
3. Click "question-circle".
4. Click "Launch Guide"
5. Check out the guide
For more information, please visit - AOS
Generate animation code
After setting parameters such as:
- animation type
- Anchor placement
- Easing functions
- Offset
- Duration
- Delay
- Anchor
- Once
click red button "Generate".
Press Ctrl +C to copy OR click button below " Copy & Close"
Add animation to the block
- click "Edit This Page" in the upper right corner (Pencil icon).
- click left mouse button the block, to which you want to add the animation
- from the pull-down menu select "Design & Custom Template"
- click "Cog" icon
- paste the previously obtained code into the field under the label "Custom Element Attribute"
- click "Save"
For more information, please visit - Concrete5 Design.
Add animation to content
- click "Edit This Page" in the upper right corner (Pencil icon)
- click block "Content" and select "Edit Block"
- select the text you want to animate (Heading, paragraph, etc.)
- click red icon "cog" (Insert Animation)
- in the modal window, in the "code" field, paste the previously received code. Click "OK".
- close edit block - click Save.
Animation Demo

Fade

Fade-left

Fade-up-left

Fade-up

Fade-right

Fade-down-right

Fade - down

Fade-up-right

Fade-down-left
Flip animations

Flip-up

Flip-right

Flip-down

Flip-left
Slide animations

Slide-up

Slide-right

Slide-down

Slide-left
Zoom animations

Zoom-in

Zoom-in-left

Zoom-out-up

Zoom-out-right

Zoom-in-up

Zoom-in-right

Zoom-out-down

Zoom-in-down

Zoom-out
