How to Configure and Style Posts/Story Timeline #

Posts/Story Timeline lets you build a vertical timeline for the contents of your website. As a result, this massively helps users to easily navigate through all your blog posts.

How to Activate Posts/Story Timeline #

First, you have to install Sastra Addons. To use this Sastra Addons element, find the ‘Posts/Story Timeline’ element from the Search option under the ‘ELEMENTS‘ tab. Simply just Drag & Drop the ‘Posts/Story Timeline’ into the ‘Drag widget here‘ or the ‘+’ section.

After you are successfully done with this step, this is how the element is going to look like.

How to Configure the Content Settings #

Under the ‘Content’ tab, you will be able to configure ‘Layout’, ‘Timeline Items’ & ‘Content’.

Layout #

From this section, you can use the drop-down to select one of these as your timeline content: Custom & Dynamic. You can use the drop-down to select layout: Zig-Zag, Line Left, Line Right & Line Top – Carousel. Use toggle for enable / disable for fill main line.

Moreover, you can change entrance animation, animation offset and animation duration as well.

Timeline Items #

From this section, you have to see Content and Style two sub-sections. You can use toggle for display or hide main line label and extra label, select main line icon, change main line label text, change extra primary label and change extra secondary label.

Besides, you can use the drop-down to select one of these as your display media type: Image, Icon & Video and change image size. You set item description and title with which you can redirect your visitors to any page on your site.

To add more elements, simply click on the ‘+ ADD ITEM’ button from the bottom.

Content #

From this section, you can use the toggle for show or hide image overlay, title and description. Also you can change left & right aligned content as well.

Click to see Live Demo #

How to Style Posts/Story Timeline #

To customize Posts/Story Timeline, click on the ‘Style’ tab, and you will find many different options here.

Timeline Items #

From here, you can set background color, border color for left & right aligned, change distance from main line, vertical distance, shadow and container & item padding.

Moreover, you can styling to border and border radius as well.

Media #

From here, you can change image width, padding, styling to border and border radius as well.

Others #

From the ‘Content’ settings, you can you can change padding and styling to border with border radius. On the other hand, customize your ‘Title’, ‘Description’, ‘Main Line’, ‘Main Line Label’, ‘Main line Icon’ and ‘Extra Label’ from these settings.

Besides, you can also customize your ‘Triangle’ from these settings.

Final Outcome #

By following the basic steps and a bit more modifying, you can style your Posts/Story Timeline content as per your preference.

This is how you can design a beautiful post layout in an eventful manner on the website using Posts/Story Timeline.

Getting stuck? Feel free to contact our support team for further assistance.