We appreciate your decision of using our Timeline Designer Plugin.
This document has been written in such a way that it can be easily understood by beginners as well as advanced users or developers.
If you have an any query that is beyond the scope of document, please feel free to contact us at firstname.lastname@example.org
1. Installation Via WordPress Admin area
- Step 1. Log into your WordPress admin area.
- Step 2. Click on the left side plugin menu.
- Step 3. Now at the top you can see the Add New button, click the button.
- Step 4. Again at the top you can see/view Upload Plugin button, click the button.
- Step 5. Extract that timeline-designer.zip file in your local pc and find there another plugin file (timeline-designer.zip) that you have downloaded from wordpress.org.
- Step 5. Now upload the plugin zip file (timeline-designer.zip). After upload, click on "Install" button and click on "Activate Plugin".
2. Installation Via FTP
- Step 1. Extract the above selected zip file (timeline-designer.zip). It will create 'timeline-designer' folder with all plugin files & folder inside it. (Remember this extracted folder path)
- Step 2. Using your FTP program like Filezilla or cPanel, upload the non-zipped plugin folder into the /wp-content/plugins/ folder on your server.
- Step 3. Go to Dashboard » Plugins » Installed Plugins page and find 'Timeline Designer' from plugin list.
- Step 4. Click on Activate to activate Timeline Designer plugin.
Quick guide will help you to easily create timeline posts on your website in a few easy steps within 5 to 10 minute. However, you can set it up in only a few steps. We provide you easily understandable settings in the admin panel of your wordpress.
Please follow below quick steps.
Step 1 :
Create a new Layout
First you have to create a timeline Layout which contain settings of timeline post layout.
Create custom post type.
Create a new Layout
- Step 1. Login in to wordpress admin and got WP Timeline Menu.
- Step 2. Now click on ‘Create New Layout’ Button.
- Now you can see the Layout Option panel and vertical settings menu where you have different settings related to Layout.
- Step 1. First select a template which you want to show in your timeline layout from General Settings.
- NOTE: Few settings depend on the selected template and only work with that particular settings, so it may not show when you select a template.
- Step 2. Give a Layout Name, add timeline headings, sub-headings and select ‘Post Type’ which you want to show on the timeline layour. You also have the option to select a custom post type as well as create a new post type for timeline layout.
- Step 3. Select a page to show the timeline layout although you also have the option to copy shortcodes and paste in your designer page.
- Step 4. Select the number of posts you want to show in a timeline layout at a time.
- Step 5. Display settings provide you to show post meta fields such as post category, tags, author, date, comment, etc. in timeline posts, as well as you can disable/enable links to those particular meta fields.
- Step 6. Add Custom CSS in Timeline Layout.
- Step 1. Set ‘Template Background Color’ which appears on the whole background of the timeline layout.
- Step 2. Set default link color and link hover color example: meta link color. By default, it's disabled but if you are using the WP Timeline Designer PRO Plugin then it will be active.
- Step 3. Set number of post offset.
- Step 4. Set post meta typography settings where you able to select font-family, font-size, font-style etc.
- Step 5. Set date typography settings where you able to select font-family, font-size, font-style etc.
In timeline settings there are layout base options which depend on the selected layout mostly are colors, text, animation, layout type. Few layouts support horizontal as well as vertical. So those settings impact on timeline layout elements such as border color, border radius, alignment of layout’s post etc.
- Step 1. To change the line width of the timeline use ‘Timeline Line Width’.
- Step 2. To change the style of the timeline use ‘Timeline Style’. To change or set the style view of the timeline use ‘Timeline Style View’. By default, it's disabled but if you are using the WP Timeline Designer PRO Plugin then it will be active.
- Step 3. To change the animation of the timeline use ‘Timeline Animation’.
- Step 4. To change the icon border radius of the timeline use ‘Timeline Icons Border Radius’.By default, it's disabled but if you are using the WP Timeline Designer PRO Plugin then it will be active.
- Step 5. To change the layout color use ‘Template Color’. If you want show vertical or horizontal post so there is option ‘Layout Type’.
Post Title Settings
- Step 1. In ‘Post Title Settings’ you have the option to change post title link, title alignment, color, and hover color option.
- Step 2. In ‘Typography Settings’ you have the option to change Font-Family, Font-Size, Font-Weight, Line-Weight, Italic Font-Style, Text Transform, Text Decoration, Letter Spacing. By default, it's disabled but if you are using the WP Timeline Designer PRO Plugin then it will be active.
Post Content Settings
- Step 1. Setting ‘For Each Article In A Feed, Show’ you able show summary or full content of post.
- Step 2. ‘Show Content From’ option allows you to select show content from post excerpt or from post content.
- Step 3. If you want to ‘Display HTML tags with Summary’ then you have option to display it or not.
- Step 4. If you want to show dropcap letter in post content then you have option with typographic settings
- Step 4. To limit post content in timeline posts there is the option ‘Enter Post Content Length’, you just have to adjust how many words show at a time in each post.
- Step 5. ‘Advance Post Contents’ allow you to end post content after paragraph or after a special character.
- Step 6. Set ‘Post Content Color’
- Step 7. Under Post Content Typography Settings tab there is option for full customization of content typography
- Step 8. Next option to show ‘Read More’ link or button, there is a full customizable option like text color of read more, alignment, background color, border, border style, border radius, hover, margin, padding of button, text-decoration and full customizable typography.
Content Box Settings
- NOTE: All content box settings applied on post content box but in a few templates it applied for all post containers including post title depending on layout.
- Step 1. For the content box there is borde settings, border radius, background color of content box, box shadow settings and padding settings.
- Step 1. ‘Media Settings’ you have to option ‘Enable Media’ in timeline posts or you can disable it if you don’t want to show, ‘Post Image Link’ if you want to add a link over image.
- Step 2. In ‘Post Image Hover Effect’ you can enable to show the hover effect on image otherwise, you can disable it if you don’t want to show the hover effect and set default image in case posts don’t have an image. You also can configure post media size using the ‘Select Post Image Hover Effect’ option to select the hover effects.
- Step 3. ‘Select Post Default Image’ option to select the default image or browse from you computer. ‘Select Post Media Size’ option to set the media size of post. ‘Add Custom Size’ option is use to give custom size to your post.
Horizontal Timeline Settings
- Default all layout template set to vertical timeline post show, but we provide same design layout in horizontal, for horizontal timeline there few customization settings, display timeline bar (icons), auto slide, scrolling speed(ms), number of navigation item, number of slide etc. few settings not apply for few templates because it depend on layout design.
- Pagination Type: Paged Option allow you to show traditional pagination in your posts. There is Pagination Template option comes with a few preloaded templates and pagination color settings where you are able to set text color, background color, border color, hover color etc.
Timeline Designer Features
- Create Layout You have the option to create unlimited layouts with a built-in template.
- Select Template There are various build-in templates which are fully customizable , Select a page where you want to show posts' timeline layout. Meta settings and custom css. A template has vertical options or horizontal or both you have choice how you want to show timeline.
- Meta Settings You have a full post meta option to show, hide, and add links or not as well as there is also an option to limit the number of posts to show on timeline layout.
- Standard Options In the standard option you can set background color of template and typography option for meta, there are also few more color options which are only for particular template.
- Post Title Options Post title in the timeline layout is fully customizable where you can set color, alignment etc.
- Post Content Settings In the post content option you have the option to set post excerpt, dropcap, content color, read more text and button, typography.
- Content Box Content box of a timeline layout, there is an option for border, shadow, border radius, background color, padding.
- Timeline Setting In timeline layout there icons, or custom image so you can setup radius of those icon, timeline style, template color, layout type (Vertical and Horizontal)
- Media Option Enable media for timeline’s posts, link on media, hover effect on images, option to add default image, set particular size post images or add custom size.
- Horizontal Options With the horizontal option you can customize horizontal timeline sucha enable auto slide, scrolling speed, number item in navigation, number of slide etc.
- Pagination There are 1 types of pagination: paged (with few customizable build-in template)
- Social Media Icons Enable social media icons on timeline post with customizable option like social icon style, shape of icons, size of icons etc.
- Custom post type option In particular case you don’t need to add custom code or install a plugin for custom post type, plugins have built in features to create custom post type with custom taxonomy which you can use with timeline easily.
- Responsive Compatibility You not need to worry about responsive issue with various devices, Timeline Designer plugin design such way it auto adjust with your blog posts layout and look perfect in all devices.
- Simple and Easy configuration Plugin provides easy configuration.
- 3rd Party Builder Support Such as WPBakery Page Builder, Elementor, KingComposer, Page Builder by SiteOrigin, Beaver Builder and divi with shortcode.
Timeline Designer plugin is language compatible, thus can be translated into multiple languages. You can use POEdit plugin for translation.
Step 1. Install Poedit
tool and open it
Step 2. Open .POT file from /wp-content/plugins/timeline-designer/languages/
that you want to translate
- Step 3. Now, click on "Save"
Step 4. A popup will appear, enter your Language code ( Ex :-
"ca_CA" for English (Canada)) in language option
Step 5. Then select source path tab and you have to modify this
path to full path of your plugin that you want to translate.
Step 6. Then press ok button.
- Step 7. Then give file name like this wp-timeline-designer-ca_CA.po for English (Canada) language.
- Step 8. Then save file inside language folder in plugin that you want to translate and all strings are appear in your poedit editor
- Step 9. Select your string that you want to translate and in bottom side there are two options one is Source Text and another one is Translation
- Step 10. Source Text keep as it is and in Translation section enter your translated string of selected string that you want to translate and then save it.
- Step 11. Repeat step 10 untill your all strings to be translate.
Step 12. Now you will get two separate files – a .po file and a
Note : When you save the files, you must name them according to your language code. Find a list of language codes at WordPress in your Language. For example, the language code for English (Canada) is ca_CA, so you would save the translated files as ca_CA.po and ca_CA.mo.
Step 13. Then go to wp-config.php file then enter the below code.
define('WPLANG', 'Your language code');for Ex.(ca_CA for English (Canada)) then save it.
Step 14. Select language from admin side, Go to Dashboard
» Settings » General in that check Site Language options.
Step 15. Check language prefix in front end, view HTML.
1. Does plugin support custom post type?
Yes, the plugin supports custom post type and custom post type taxonomy and custom tag as well.
2. Is template layout responsive?
Yes, all layouts are fully device ready and no need worry about responsiveness.
3. I don’t want to show featured images, how to hide featured images?
There is an option for disable media in that particular layout, you can click disable from there and all posts' images will hide.
4. How to add a social share icon in a timeline post?
The plugin has an option for social share icons where you enable/disable icons to show on front. You also set up the size of icons, type and style of icons as well as config Facebook access code and mail content.
5. I have a woo store, can I add my products in timeline?
Yes, you add a product in timeline plugins has fully supported woo commerce and you can easily add products to any layout. It will show rating, price, add to cart button, product tags and category.
6. Can I customize pagination of timeline according to my current theme?
Yes, You can you as plugin already has an in-build template which is customizable. You can easily change pagination color.
7. Is there an option to customize design other than inbuilt options?
Yes, you can also customize design using custom CSS or you can add CSS in your own theme using template classes.
8.How to show same layout on multiple pages as well as on a specific portion of my layout?
You can copy shortcode of layout and paste of in any page or inside page template content. You can use same shortcode multiple time.
9. I just want to show a plain post without any other meta content like date, author etc.?
You have the option to show and hide post meta, such date, post author, comment, category, tag form general settings.
10. How to show limited posts in timeline?
There is an option under general tab to limited posts as well as you can select the specific post type or product.
11. How to add timeline in Divi Module?
Divi not support any wp widget in divi module so you have to copy code of a timeline, add divi text module or content module past shortcode and save, now you can see the timeline on the front-end.
Thanks for using Timeline Designer Plugin!
We would like to thank you for using our Timeline Designer Plugin! If you have any difficulties with Timeline Designer Plugin or need any additional service, do not hesitate to contact us. We provide priority support with all our premium WordPress themes and plugins.
Just contact us on support.solwininfotech.com
We will be happy to assist you!