How to Use Post Timeline Shortcodes?

Post timeline Shortcodes are code snippets that you can use to add to pages or post to display Timeline Posts on the web pages.  

Timeline Shortcode

You can either add Shortcode manually or it can be generated automatically through Post Timeline Code Generator. 

To add a shortcode manually, you’ll need to know the different timeline shortcode attributes and values. Here is the following shortcode which could help you in creating your own post timeline shortcode 

[post-timeline layout="vertical" template="3" nav-max="5" anim-type="fadeIn" type="tag" bg-color="#f5f5f5" skin-type="light" nav-type="0" nav-offset="70" sort="ASC" line-style="solid" nav-color="#4285f4" category="23" post-per-page="100" post-desc="full" pagination="off"]

Now let’s take a look at each attribute and value of the post-timeline shortcode

Post-timeline Layout:  #

Post-timeline layout attribute needs values of templates such as vertical timeline, horizontal timeline, or one side timeline 

Template: #

In this attribute, you’ll need to select templates since there are 5 templates available so you need to assign a number to this attribute e.g 0,1,2,3 

 Nav-Max, Anim-type, Type:  #

In the Nav-Max attribute, you can add a limit to stop navigation to increase. E.g 1,2,3

Anim-type attribute gives you the choice to select different animation variations from it. Here is the example below:


Type attribute takes date type or tag-based values to display timeline based on tag types.

.Bg-color, Skin-type, Nav-type: #

Bg-color gives you a wide variety of background colors selection for timelines

In the Skin-type attribute, you can specify light or dark skin variation for post timelines.

There are 4 navigation style options that you can use by Nav-type attribute and assigning it a number. 

Sort, Line-style, Nav-color:  #

There are two ways to Sort your timeline posts either in Ascending or descending order. 

The Line-style attribute can take either Solid, dashed, or dotted line values. 

The Nav-color attribute enables you to add value to navigation elements.

Post-per-page, Post-desc, Pagination: #

The post-per-page attribute indicates how many posts you want to show on the page.

In the Post-desc attribute, you can either add a full-content or excerpt value option to the timeline. 

You can add on and off values to the Pagination attribute.