CoolTimeline
Showcase Your Story!

Step By Step Horizontal Timeline Layout Demo

Horizontal Layout (Flat Design)

Step 1
Getting Started
Basic Knowledge for WordPress dummies

Before Starting we want to tell you that you can install a plugin in WordPress 3 way –

  • Direct WordPress plugin search
  • Upload a plugin inside WordPress
  • By using FTP to upload a plugin.
Step 2
Search & Install Plugin
Install via direct WordPress plugin search

First thing you need to do is go to your WordPress admin area and click on Plugins » Add New. Then search any plugin and click on install button. But from here you can only install free plugins that are available in WordPress plugin directory. Click on image left from more info.

Step 3
Upload a Plugin
Upload a plugin in WordPress

Paid plugins are not listed in WordPress directory so you can upload them via WordPress upload plugin option. First, you need to download the plugin from the source (which will be a zip file). Next, you need to go to WordPress admin area and visit Plugins » Add New page. Then upload plugin & activate it.

Step 4
Manually FTP Upload
Manually FTP Upload A WordPress Plugin

For this first you need to extract plugin zip file. Now Open the FTP client on your computer and connect. Once connected, you need to access the path /wp-content/plugins/ Next, upload the folder you extracted from the zip file to the /wp-content/plugins/ folder on your web server. Then you can activate your plugin from installed plugins list in WordPress dashboard.

Step 5
Final Words!
Final Words!

If you are facing any difficulty in wordpress plugin installation then you can hire our expert developers team. We provide full wordpress support. Contact here – contact@staging2.cooltimeline.com

Shortcode (Above timeline uses this shortcode) :-
				
								
			<div class="ctl-wrapper" role="region" aria-label="Timeline">
								<div id="cool_timeline_3" class="cool-timeline-wrapper ctl-horizontal ctl-horizontal-wrapper ctl-horizontal-timeline ctl-design-2" data-items="2" data-start-on="0" data-autoplay="false" data-autoplay-speed="3000" data-load="" data-nav="" data-line-filling="false" data-nav-pos="right" role="region" aria-label="Timeline">
					<div class="ctl-wrapper-inside">
												<div id="ctl-slider-container" class="ctl-slider-container swiper-container ctl-line-filler swiper-container-horizontal" aria-live="polite">
							
							<div class="ctl-slider-wrapper ctl-timeline-container swiper-wrapper">
								<div id="ctl-story-1513" class="ctl-story ctl-story-icon swiper-slide odd ctl-no-media" data-story-index="1" role="article"><div class="ctl-labels ctl-label-full"><div class="ctl-label-big">Step 1</div><div class="ctl-label-small">Getting Started</div></div><div class="ctl-icon"><i class= "fa far fa-bell" aria-hidden ="true" ></i></div> <div class="ctl-arrow"></div>
			<div class="ctl-content"> <div class="ctl-title story-1513" role="heading" aria-level="2"><a target="_blank" title="Basic Knowledge for WordPress dummies" href="https://staging2.cooltimeline.com/timeline/basic-knowledge-wordpress-dummies/" class="story-link">Basic Knowledge for WordPress dummies</a></div><div class="ctl-description"><p>Before Starting we want to tell you that you can install a plugin in WordPress 3 way &#8211;</p>
<ul>
<li>Direct WordPress plugin search</li>
<li>Upload a plugin inside WordPress</li>
<li>By using FTP to upload a plugin.</li>
</ul>
</div></div></div><div id="ctl-story-15879" class="ctl-story ctl-story-icon swiper-slide even ctl-no-media" data-story-index="2" role="article"><div class="ctl-labels ctl-label-full"><div class="ctl-label-big">Step 2</div><div class="ctl-label-small">Search &amp; Install Plugin</div></div><div class="ctl-icon"><i class= "fa fa-search" aria-hidden ="true" ></i></div> <div class="ctl-arrow"></div>
			<div class="ctl-content"> <div class="ctl-title story-15879" role="heading" aria-level="2"><a target="_blank" title="Install via direct WordPress plugin search" href="https://staging2.cooltimeline.com/timeline/install-via-direct-wordpress-plugin-search/" class="story-link">Install via direct WordPress plugin search</a></div><div class="ctl-description"><p>First thing you need to do is go to your WordPress admin area and click on Plugins » Add New. Then search any plugin and click on install button. But from here you can only install free plugins that are available in WordPress plugin directory. Click on image left from more info.</p>
</div></div></div><div id="ctl-story-15880" class="ctl-story ctl-story-icon swiper-slide odd ctl-no-media" data-story-index="3" role="article"><div class="ctl-labels ctl-label-full"><div class="ctl-label-big">Step 3</div><div class="ctl-label-small">Upload a Plugin</div></div><div class="ctl-icon"><i class= "fa fa-arrow-circle-o-up" aria-hidden ="true" ></i></div> <div class="ctl-arrow"></div>
			<div class="ctl-content"> <div class="ctl-title story-15880" role="heading" aria-level="2"><a target="_blank" title="Upload a plugin in WordPress" href="https://staging2.cooltimeline.com/timeline/upload-plugin-wordpress/" class="story-link">Upload a plugin in WordPress</a></div><div class="ctl-description"><p>Paid plugins are not listed in WordPress directory so you can upload them via WordPress upload plugin option. First, you need to download the plugin from the source (which will be a zip file). Next, you need to go to WordPress admin area and visit Plugins » Add New page. Then upload plugin &amp; activate it.</p>
</div></div></div><div id="ctl-story-1521" class="ctl-story ctl-story-icon swiper-slide even ctl-no-media" data-story-index="4" role="article"><div class="ctl-labels ctl-label-full"><div class="ctl-label-big">Step 4</div><div class="ctl-label-small">Manually FTP Upload</div></div><div class="ctl-icon"><i class= "fa fa-inbox" aria-hidden ="true" ></i></div> <div class="ctl-arrow"></div>
			<div class="ctl-content"> <div class="ctl-title story-1521" role="heading" aria-level="2"><a target="_blank" title="Manually FTP Upload A WordPress Plugin" href="https://staging2.cooltimeline.com/timeline/manually-ftp-upload-wordpress-plugin/" class="story-link">Manually FTP Upload A WordPress Plugin</a></div><div class="ctl-description"><p>For this first you need to extract plugin zip file. Now Open the FTP client on your computer and connect. Once connected, you need to access the path /wp-content/plugins/ Next, upload the folder you extracted from the zip file to the /wp-content/plugins/ folder on your web server. Then you can activate your plugin from installed plugins list in WordPress dashboard.</p>
</div></div></div><div id="ctl-story-15881" class="ctl-story ctl-story-icon swiper-slide odd ctl-no-media" data-story-index="5" role="article"><div class="ctl-labels ctl-label-full"><div class="ctl-label-big">Step 5</div><div class="ctl-label-small">Final Words!</div></div><div class="ctl-icon"><i class= "fa fa-check" aria-hidden ="true" ></i></div> <div class="ctl-arrow"></div>
			<div class="ctl-content"> <div class="ctl-title story-15881" role="heading" aria-level="2"><a target="_blank" title="Final Words!" href="https://staging2.cooltimeline.com/timeline/final-words/" class="story-link">Final Words!</a></div><div class="ctl-description"><p>If you are facing any difficulty in wordpress plugin installation then you can hire our expert developers team. We provide full wordpress support. Contact here &#8211; <a href="mailto:contact@coolplugins.net">contact@staging2.cooltimeline.com</a></p>
</div></div></div>							</div>
							<span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>
						</div>
					</div>
					
					<div class="ctl-button-prev swiper-button-disabled" tabindex="0" role="button" aria-label="Previous slide" aria-disabled="true">
						<i class="fas fa-chevron-left"></i>					</div>
					
					<div class="ctl-button-next" tabindex="0" role="button" aria-label="Next slide" aria-disabled="false">
						<i class="fas fa-chevron-right"></i>					</div>
					
					<div class="ctl-h-line"></div>
									</div>
			</div>
			
				
			

Horizontal Layout (Classic Design)

Step 1
Getting Started
Basic Knowledge for WordPress dummies

Before Starting we want to tell you that you can install a plugin in WordPress 3 way –

  • Direct WordPress plugin search
  • Upload a plugin inside WordPress
  • By using FTP to upload a plugin.
Step 2
Search & Install Plugin
Install via direct WordPress plugin search

First thing you need to do is go to your WordPress admin area and click on Plugins » Add New. Then search any plugin and click on install button. But from here you can only install free plugins that are available in WordPress plugin directory. Click on image left from more info.

Step 3
Upload a Plugin
Upload a plugin in WordPress

Paid plugins are not listed in WordPress directory so you can upload them via WordPress upload plugin option. First, you need to download the plugin from the source (which will be a zip file). Next, you need to go to WordPress admin area and visit Plugins » Add New page. Then upload plugin & activate it.

Step 4
Manually FTP Upload
Manually FTP Upload A WordPress Plugin

For this first you need to extract plugin zip file. Now Open the FTP client on your computer and connect. Once connected, you need to access the path /wp-content/plugins/ Next, upload the folder you extracted from the zip file to the /wp-content/plugins/ folder on your web server. Then you can activate your plugin from installed plugins list in WordPress dashboard.

Step 5
Final Words!
Final Words!

If you are facing any difficulty in wordpress plugin installation then you can hire our expert developers team. We provide full wordpress support. Contact here – contact@staging2.cooltimeline.com

Shortcode (Above timeline uses this shortcode) :-
				
								
			<div class="ctl-wrapper" role="region" aria-label="Timeline">
								<div id="cool_timeline_4" class="cool-timeline-wrapper ctl-horizontal ctl-horizontal-wrapper ctl-horizontal-timeline ctl-design-3" data-items="2" data-start-on="0" data-autoplay="false" data-autoplay-speed="3000" data-load="" data-nav="" data-line-filling="false" data-nav-pos="right" role="region" aria-label="Timeline">
					<div class="ctl-wrapper-inside">
												<div id="ctl-slider-container" class="ctl-slider-container swiper-container ctl-line-filler swiper-container-horizontal" aria-live="polite">
							
							<div class="ctl-slider-wrapper ctl-timeline-container swiper-wrapper">
								<div id="ctl-story-1513" class="ctl-story ctl-story-dot-icon swiper-slide odd ctl-no-media" data-story-index="1" role="article"><div class="ctl-labels ctl-label-full"><div class="ctl-label-big">Step 1</div><div class="ctl-label-small">Getting Started</div></div><div class="ctl-icondot"></div> <div class="ctl-arrow"></div>
			<div class="ctl-content"> <div class="ctl-title story-1513" role="heading" aria-level="2"><a target="_blank" title="Basic Knowledge for WordPress dummies" href="https://staging2.cooltimeline.com/timeline/basic-knowledge-wordpress-dummies/" class="story-link">Basic Knowledge for WordPress dummies</a></div><div class="ctl-description"><p>Before Starting we want to tell you that you can install a plugin in WordPress 3 way &#8211;</p>
<ul>
<li>Direct WordPress plugin search</li>
<li>Upload a plugin inside WordPress</li>
<li>By using FTP to upload a plugin.</li>
</ul>
</div></div></div><div id="ctl-story-15879" class="ctl-story ctl-story-dot-icon swiper-slide even ctl-no-media" data-story-index="2" role="article"><div class="ctl-labels ctl-label-full"><div class="ctl-label-big">Step 2</div><div class="ctl-label-small">Search &amp; Install Plugin</div></div><div class="ctl-icondot"></div> <div class="ctl-arrow"></div>
			<div class="ctl-content"> <div class="ctl-title story-15879" role="heading" aria-level="2"><a target="_blank" title="Install via direct WordPress plugin search" href="https://staging2.cooltimeline.com/timeline/install-via-direct-wordpress-plugin-search/" class="story-link">Install via direct WordPress plugin search</a></div><div class="ctl-description"><p>First thing you need to do is go to your WordPress admin area and click on Plugins » Add New. Then search any plugin and click on install button. But from here you can only install free plugins that are available in WordPress plugin directory. Click on image left from more info.</p>
</div></div></div><div id="ctl-story-15880" class="ctl-story ctl-story-dot-icon swiper-slide odd ctl-no-media" data-story-index="3" role="article"><div class="ctl-labels ctl-label-full"><div class="ctl-label-big">Step 3</div><div class="ctl-label-small">Upload a Plugin</div></div><div class="ctl-icondot"></div> <div class="ctl-arrow"></div>
			<div class="ctl-content"> <div class="ctl-title story-15880" role="heading" aria-level="2"><a target="_blank" title="Upload a plugin in WordPress" href="https://staging2.cooltimeline.com/timeline/upload-plugin-wordpress/" class="story-link">Upload a plugin in WordPress</a></div><div class="ctl-description"><p>Paid plugins are not listed in WordPress directory so you can upload them via WordPress upload plugin option. First, you need to download the plugin from the source (which will be a zip file). Next, you need to go to WordPress admin area and visit Plugins » Add New page. Then upload plugin &amp; activate it.</p>
</div></div></div><div id="ctl-story-1521" class="ctl-story ctl-story-dot-icon swiper-slide even ctl-no-media" data-story-index="4" role="article"><div class="ctl-labels ctl-label-full"><div class="ctl-label-big">Step 4</div><div class="ctl-label-small">Manually FTP Upload</div></div><div class="ctl-icondot"></div> <div class="ctl-arrow"></div>
			<div class="ctl-content"> <div class="ctl-title story-1521" role="heading" aria-level="2"><a target="_blank" title="Manually FTP Upload A WordPress Plugin" href="https://staging2.cooltimeline.com/timeline/manually-ftp-upload-wordpress-plugin/" class="story-link">Manually FTP Upload A WordPress Plugin</a></div><div class="ctl-description"><p>For this first you need to extract plugin zip file. Now Open the FTP client on your computer and connect. Once connected, you need to access the path /wp-content/plugins/ Next, upload the folder you extracted from the zip file to the /wp-content/plugins/ folder on your web server. Then you can activate your plugin from installed plugins list in WordPress dashboard.</p>
</div></div></div><div id="ctl-story-15881" class="ctl-story ctl-story-dot-icon swiper-slide odd ctl-no-media" data-story-index="5" role="article"><div class="ctl-labels ctl-label-full"><div class="ctl-label-big">Step 5</div><div class="ctl-label-small">Final Words!</div></div><div class="ctl-icondot"></div> <div class="ctl-arrow"></div>
			<div class="ctl-content"> <div class="ctl-title story-15881" role="heading" aria-level="2"><a target="_blank" title="Final Words!" href="https://staging2.cooltimeline.com/timeline/final-words/" class="story-link">Final Words!</a></div><div class="ctl-description"><p>If you are facing any difficulty in wordpress plugin installation then you can hire our expert developers team. We provide full wordpress support. Contact here &#8211; <a href="mailto:contact@coolplugins.net">contact@staging2.cooltimeline.com</a></p>
</div></div></div>							</div>
							<span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>
						</div>
					</div>
					
					<div class="ctl-button-prev swiper-button-disabled" tabindex="0" role="button" aria-label="Previous slide" aria-disabled="true">
						<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512">
				<path d="M34.52 239.03L228.87 44.69c9.37-9.37 24.57-9.37 33.94 0l22.67 22.67c9.36 9.36 9.37 24.52.04 33.9L131.49 256l154.02 154.75c9.34 9.38 9.32 24.54-.04 33.9l-22.67 22.67c-9.37 9.37-24.57 9.37-33.94 0L34.52 272.97c-9.37-9.37-9.37-24.57 0-33.94z"/>
				</svg>					</div>
					
					<div class="ctl-button-next" tabindex="0" role="button" aria-label="Next slide" aria-disabled="false">
						<svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512">
				<path d="M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z"/>
				</svg>					</div>
					
					<div class="ctl-h-line"></div><style id="cool_timeline_4-styles" type="text/css">.ctl-wrapper .cool-timeline-wrapper.ctl-horizontal-wrapper.ctl-design-3 {--ctw-cbx-title-color: #666666;}							/* Specific Story Style Start *//* Specific Story Style End */</style></div>
			</div>
			
				
			
Christmas & New Year Sale

SALE

Christmas
& New Year

Upto

80%

OFF

Ends in

Days
Hours
Min
Sec