Instructions

Instructions to get you started off on the right foot with your new Webflow template.

Instructions for Momentum Designs Webflow Template.

12 Column System Layout

The 12 column system is based on Bootstrap’s 12 column grid system. Using this system has more flexibility to create dynamic layouts and easily made to be fully responsive across all screen sizes.

The width of the screen is split into 12 equal columns covering 100% width. Learn more about the 12 column grid system

Animations

Easy to use animations. Animations effect the classes. If an item has the animation trigger icon that looks like a lightening bolt, attached to it then there is an animation that effects all the other items with the same class.(Image 1)To learn more about animations visit Webflows easy and clear guide to interations and animations.

You won't need to do anything to the animations if you like how they are now.

Image 1

Parallax Images

Parallax images slightly move when User scrolls creating a unique effect. Good news is that the parallax animation is already setup with one animation trigger and all you have to do is replace the image with your image.

Just click on the image and it should have a class name of 'Parallax Image'. Not all images have a parallax animation and can be replaced just as easily by clicking on the image.

Once the parallax image is highlighted, you should see a tag at the top with the class name and a settings icon. (Image 1) Click on that settings icon and a window will pop up (Image 2)

Click on 'replace iamge' and pick a photo from the assets panel. (Image 3) Keep in mind you need to upload images into the assets before replacing an image on the website.

Image 1
Image 2
Image 3

Buttons

The Primary Link has a unique design where in order to change the text you need to do it twice. There is a video tutorial on how to change the text in the Primary Link.