TRAFFICMarketing HTML5 Template

This is Clean Minimal Marketing html5 template.

Created:18/08/2017
Latest Update: 18/08/2017
By: RRFonline
Email: info-rrfonline.net@gmail.com

Thank you for purchasing our theme. "TRAFFIC" Minimal Multipurpose html5 template. If you have any question, please feel free to contact us, given above email address.

Main File Structure

All the file are well organized, its so easy to work with the template.
1. Unzip the files.
2. Open "TRAFFIC" folder.
You will find the all html file (Ex: index.html / **.html) on the root that will be edited.
Also you will see "assets" directorie.
Open "assets" directory and you will see directories, css, js, fonts, img.
In the css folder Content you will find style.css and other styling files the all the other files expect the htmls.
Js folder contain the jquery library and other js file. Fonts folder contain essetial font files for fonts.


    ├── TRAFFIC
         |__assets
             |__css
                   └── bootstrap.min.css
                   └── colornip.min.css
                   └── font-awesome.min.css
                   └── magnific-popup.css
                   └── animate.css
                   └── owl.carousel.min.css
                   └── slicknav.min.css
                   └── responsive.css
              |__img
                   └── .png
                   └── .jpg
              |__fonts
                   └── fontawesome-webfont.eot
                   └── fontawesome-webfont.svg
                   └── fontawesome-webfont.ttf
                   └── fontawesome-webfont.woff      
              |__js
                   └── bootstrap.min.js
                   └── colornip.min.js
                   └── custom-map.js
                   └── gmap3.min.js
                   └── owl.carousel.min.js
                   └── jquery.slicknav.min.js
                   └── jquery.magnific-popup.min.js
                   └── jquery.min.js
                   └── main.js
    
    |__index.html
    |__home-2.html
    |__home-3.html
    |__home-4.html
    |__about-us.html
    |__blog.html
    |__blog-single.html
    |__casestudy-1.html
    |__casestudy-2.html
    |__casestudy-detail.html
    |__contact-1.html
    |__contact-2.html
    |__faq.html
    |__quote.html
    |__services-1.html
    |__services-2.html
    |__services-details.html
    |__team.html
    |__style.css
    
     
	

HTML Structure

The base structure was organized by row, col-** class

		
		
		<section class="Testimonial-area">
			<div class="container">
				<div class="row">
					<div class="col-md-12">
						<div class="content"></div>
					</div>
				</div>
			</div>
		</section>
		
		<section class="blog-area">
			<div class="container">
				<div class="row">
					<div class="col-md-12">
						<div class="content"></div>
					</div>
				</div>
			</div>
		</section>
		

CSS Structure

All css file
    
    

        <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900" rel="stylesheet"> 
                <!--Favicon Icon-->
    <link rel="shortcut icon" href="assets/img/favicon.png" type="image/png"/>
            <!--bootstrap CSS-->
    <link href="assets/css/bootstrap.min.css" rel="stylesheet">
            <!--font-awesome CSS-->
    <link href="assets/css/font-awesome.min.css" rel="stylesheet">
      <!-- magnific-popup CSS=-->
<link rel="stylesheet" href="assets/css/magnific-popup.css">
             <!--owl.carousel CSS-->
    <link href="assets/css/owl.carousel.css" rel="stylesheet">
             <!--slicknav CSS-->
    <link href="assets/css/slicknav.min.css" rel="stylesheet">
             <!--style CSS-->
    <link href="style.css" rel="stylesheet">
    <!-- Colortheme CSS -->
        <link id="theme" href="assets/css/theme/theme-red.css" rel="stylesheet">
             <!--responsive CSS-->
    <link href="assets/css/responsive.css" rel="stylesheet">
      <!-- Main jQuery -->
        <script src="assets/js/jquery.min.js"></script>
    
		
    

JavaScript Structure

All javascript file
    
	
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="assets/js/bootstrap.min.js"></script>
     <!-- magnific-popup js -->
    <script src="assets/js/jquery.magnific-popup.min.js"></script>
     <!-- owl.carousel js -->
    <script src="assets/js/owl.carousel.min.js"></script>
     <!-- slicknav js -->
    <script src="assets/js/jquery.slicknav.min.js"></script>
    <!-- main js -->
    <script src="assets/js/main.js"></script>
	
	
    

Menu & Caroucel Structure

Main menu and owl-caroucel
    
    
                    <!--  main menu start-->
                    <div class="mainmenu">
                        <ul id="traffic-menu">
                            <li><a class="active" href="index.html">Home</a>
                                <ul>
                                    <li><a href="index.html">Home-1</a></li>
                                    <li><a href="home-2.html">Home-2</a></li>
                                    <li><a href="home-3.html">Home-3</a></li>
                                    <li><a href="home-4.html">Home-4</a></li>
                                </ul>
                            </li>
                            <li><a href="free-seo-analysis.html">About</a>
                                <ul>
                                    <li><a href="team.html">Team</a></li>
                                    <li><a href="quote.html">Quote</a></li>
                                    <li><a href="faq.html">FAQ</a></li>
                                </ul>
                            </li>
                            <li><a href="services-1.html">Services</a>
                                <ul>
                                    <li><a href="services-1.html">Service-1</a></li>
                                    <li><a href="services-2.html">Service-2</a></li>
                                    <li><a href="services-detail.html">Service-Details</a></li>
                                    <li><a href="pricing-table.html">Pricing-Table</a></li>
                                </ul>
                            </li>
                            <li><a href="casestudy-1.html">Case Studies</a>
                                <ul>
                                    <li><a href="casestudy-1.html">casestudy-1</a></li>
                                    <li><a href="casestudy-2.html">Casestudy-2</a></li>
                                    <li><a href="casestudy-detail.html">Case Details</a></li>
                                </ul>
                            </li>
                            <li class="mega-menu"><a href="#">Pages</a>
                                <ul>
                              
                                    <li class="row">
                                         
                                        <div class="col-md-3">
                                            <div class="menu-cta">
                                                <h4>Traffic is an<strong> AWESOME</strong> template</h4>
                                                <p>Conveniently whiteboard ubiquitous niche markets and accurate.Holisticly supply client-focused models B2B processes.</p>
                                                <a href="quote.html" class="boxed-btn home-1">Purchase Now</a>
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <ul>
                                                <li><a href="index.html">Home-page</a></li>
                                                <li><a href="about-us.html">About</a></li>
                                                <li><a href="services-1.html">Services</a></li>
                                                <li><a href="casestudy-1.html">Casestudy</a></li>
                                                <li><a href="blog.html">Blog</a></li>
                                            </ul>
                                        </div>
                                        <div class="col-md-3">
                                            <ul>
                                                <li><a href="FAQ.html">FAQ</a></li>
                                                <li><a href="pricing-table.html">Pricing</a></li>
                                                <li><a href="team.html">Team</a></li>
                                                <li><a href="quote.html">Quote</a></li>
                                                <li><a href="contact.html">Contact</a></li>
                                            </ul>
                                        </div>
                                        <div class="col-md-3">
                                            <ul>
                                                <li><a href="services-2.html">Service-2</a></li>
                                                <li><a href="casestudy-2.html">Casestudy-2</a></li>
                                                <li><a href="contact-2.html">Contact-2</a></li>
                                                <li><a href="services-detail.html">Service-Detail</a></li>
                                                <li><a href="casestudy-detail.html">Casestudy-Detail</a></li>
                                            </ul>
                                        </div>
                                    </li>
                                 
                                    </ul>
                            </li>
                            <li><a href="blog.html">Blog</a>
                                <ul>
                                    <li><a href="blog.html">Blog-1</a></li>
                                    <li><a href="blog-single.html">Blog-Single</a></li>
                                </ul>
                            </li>
                            <li><a href="contact-1.html">Contact</a>
                                <ul>
                                    <li><a href="contact-1.html">Contact-1</a></li>
                                    <li><a href="contact-2.html">Contact-2</a></li>
                                </ul>
                            </li>
                        </ul>
                        <div>
                        </div>
                    </div>
                    <!-- main menu end -->
          <!-- testimonial-carousel start-->
    <div class="section-padding">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <!-- Testimonial carousel start-->
                    <div class="testimonial-carousel">
                        <!-- testimonial Item -->
                        <div class="single-testimonial-item text-center">
                            <div class="testimonial-content">
                                <h3>“Ridiculously easy to use. We have been looking for an <br/> intuitive tool like this for a while and this is just <br/> what we needed.”</h3>
                            </div>
                            <div class="testimonial-meta">
                                <img src="../exam-1/assets/img/testimonial/testimonial-img.png" alt="testimonia-img" />
                                <h4>Mark McClendon</h4>
                                <p>Partner &amp; Executive Director, VML</p>
                            </div>
                        </div>
                        <!-- testimonial Item -->
                        <!-- testimonial Item -->
                        <div class="single-testimonial-item text-center">
                            <div class="testimonial-content">
                                <h3>“Ridiculously easy to use. We have been looking for an <br/> intuitive tool like this for a while and this is just <br/> what we needed.”</h3>
                            </div>
                            <div class="testimonial-meta">
                                <img src="../exam-1/assets/img/testimonial/testimonial-img.png" alt="testimonia-img" />
                                <h4>Mark McClendon</h4>
                                <p>Partner &amp; Executive Director, VML</p>
                            </div>
                        </div>
                        <!-- testimonial Item -->
                        <!-- testimonial Item -->
                        <div class="single-testimonial-item text-center">
                            <div class="testimonial-content">
                                <h3>“Ridiculously easy to use. We have been looking for an <br/> intuitive tool like this for a while and this is just <br/> what we needed.”</h3>
                            </div>
                            <div class="testimonial-meta">
                                <img src="../exam-1/assets/img/testimonial/testimonial-img.png" alt="testimonia-img" />
                                <h4>Mark McClendon</h4>
                                <p>Partner &amp; Executive Director, VML</p>
                            </div>
                        </div>
                        <!-- testimonial Item -->
                    </div>
                    <!-- Testimonial carousel end-->
                </div>
            </div>
        </div>
    </div>
    <!-- testimonial-carousel end-->
    

Sources & Credits

Supports

Thank you for reading the documentaion. If you have any question or any problem about this themplte, please contact with us. We will give you support within 24 hour. Thanks.

RRFonline

Sliders Structure

The base structure was organized by row, col-** class
    
    <!-- code will be here -->