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