Timeline Widget Tutorial

Essential Classy Tab from Dashboad -> Widgets then enable Timeline

Image

Now Drag and Drop Timeline widget

Image
Timeline
2 type of Predefine Layout
Image
Timeline Loop Content List
In this repeater, We have Icon/Image/Text selection option.
Image
Timeline Content Repeater
In this repeater, We have Image, Title with Tag, Description and Link Options.
Image
Repeater Styling
Image
Using this option, You can manage Gap and Alignment.
Image
Manage Animation based on Viewport
Image
Disable Animation
Image
Timeline – Style Tab
In this style tab, We have Info, Label, Progress and Content styling option.
Image
Info – Style Tab
In this tab, You can manage Width/Height of Circle.
Also, You can manage Text Typography and Normal and Active Color.
Image
In this tab, You can manage Icon size and Color of Normal and Active state.
Image
In this tab, You can manage Image size with it’s Border radius.
Image
For general styling, You can manage Background, Border, Shadow and Transition CSS for Normal and Active state.
Image
Label – Style Tab
In this tab, You can manage Margin, Width, Typography and Normal and Hover Color of Label.
Image
Progress – Style Tab
In this tab, You can manage Progress Line Size and It’s Color.
Image
Content Image – Style Tab
In this tab, You can manage Margin and Border Radius of Image.
Image
Content Title – Style Tab
In this tab, You can manage Padding, Margin and Typography.
Also, You can manage Color, Background, Border, Shadow, Transition and Transform CSS for Normal and Hover state.
Image
Content Description – Style Tab
In this tab, You can manage Padding, Margin, Typography and It’s Alignment.
Also, You can manage Color, Background, Border, Shadow, Transition and Transform CSS for Normal and Hover state.
Image
Content Button – Style Tab
In this tab, You can manage Padding, Margin and It’s Typography.
Also, You can manage Color, Background, Border and Shadow for Normal and Hover state.
Image
Content Arrow – Style Tab
In this tab, You can manage Arrow Offset and It’s Color for Normal and Hover State.
Image
Content Box – Style Tab
In this tab, You can manage Padding and Margin of Content Box.
Also, You can manage Background, Border and Shadow for Normal and Hover state.
Image