Enable Animation

This option will cause your column to animate in when it reaches the users view on screen. The animation will only trigger one time unless you’re using the page full screen rows option, then it will trigger every time you switch rows. There are many options to select from for animating, scroll down this page slowly so you can pay attention to each one firing

Fade In

Fade In From Left

Fade In From Right

Fade In From Bottom

Grow In

Flip In Horizontal

Flip In Vertical

Reveal From Right

Reveal From Bottom

Reveal From Left

Reveal From Top

Animation Delay

The animation delay input allows you to delay the column animation by a specified duration in milliseconds. E.g. “500” would delay the animation by 500ms, or 0.5 seconds. Make sure to enter the delay in milliseconds, if you try using seconds it will not parse correctly. This field is extremely useful for creating staggered animations with your columns. See an example below (the value used is written in the column)

0

200

400

600

800

1000

Boxed Column

Checking the box to enable this option will add a white BG color to your column and give a slight hover effect

Centered Content Alignment

Similar to setting the row text align to center, but allows you to choose this on a column by column basis. It also is more powerful than regular centered text alignment since it will center most html elements inside of it as well.

Column Padding

Allows you to define how much padding you would like from a percentage dropdown. Percentage values are used to keep everything responsive. You have the option to choose between 0%-15% for any column in your website. See below how much different values will affect the layout.

Note: You can also change what sides the padding to effect – the below example shows an even distribution on all sides, however you can specify for it to limited to one side or a combination of sides. 

0%

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque venenatis leo sed felis tincidunt suscipit. Nulla elementum quis justo ut consectetur. Ut sagittis libero et augue euismod maximus. Ut vitae lorem lacus. Donec nec odio in justo tristique interdum. Nunc vel dolor sed ipsum tempor aliquet.

4%

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque venenatis leo sed felis tincidunt suscipit. Nulla elementum quis justo ut consectetur. Ut sagittis libero et augue euismod maximus. Ut vitae lorem lacus. Donec nec odio in justo tristique interdum. Nunc vel dolor sed ipsum tempor aliquet.

6%

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque venenatis leo sed felis tincidunt suscipit. Nulla elementum quis justo ut consectetur. Ut sagittis libero et augue euismod maximus. Ut vitae lorem lacus. Donec nec odio in justo tristique interdum. Nunc vel dolor sed ipsum tempor aliquet.

8%

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque venenatis leo sed felis tincidunt suscipit. Nulla elementum quis justo ut consectetur. Ut sagittis libero et augue euismod maximus. Ut vitae lorem lacus. Donec nec odio in justo tristique interdum. Nunc vel dolor sed ipsum tempor aliquet.

Background Color

Sets the background color of your column to any color of your choosing

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Background Color Opacity

Setting the background opacity to anything other than 1 will have it overlay on top of the BG image set on the column or anything behind the column.

Background color set to a blue with the background opacity set to 0.6

Background color set to black with the background opacity set to 0.3

Background color set to pink with the background opacity set to 0.8

Background Hover Color/Opacity

You can also change the background color and opacity of the background color of any column when hovering over it. See some examples below

Setting the background hover color to the same as the background color and changing the opacity to 1

Setting the background hover color to the same as the background color and changing the opacity slightly

Keeping the opacity the same for the background and the hover but changing the color

Can't find what you need?

Open a ticket