Marcus - Multipurpose WooCommerce and Magento Html5 and Bootstrap Template


Thank you for your purchasing this template. If you have any questions that are beyond the scope of this help file, please feel free to email us via ...

Page Head
	  
	  
	   <head>
	 <meta charset="utf-8">
	 <meta http-equiv="X-UA-Compatible" content="IE=edge">
	 <meta name="viewport" content="width=device-width, initial-scale=1">
	 <title>marcus Ecommerce Bootstrap Html Page  </title>
	 <!-- Standard -->
	 <link rel="shortcut icon" href="assets/images/ficon.png">
	 <!-- Latest Bootstrap min CSS -->
	 <link rel="stylesheet" href="assets/css/bootstrap.min.css" type="text/css">
	 <!-- Dropdownhover CSS -->
	 <link rel="stylesheet" href="assets/css/bootstrap-dropdownhover.min.css" type="text/css">
	 <!-- latest fonts awesome -->
	 <link rel="stylesheet" href="assets/font/css/font-awesome.min.css" type="text/css">	
	 <!-- simple line fonts awesome -->
	 <link rel="stylesheet" href="assets/simple-line-icon/css/simple-line-icons.css" type="text/css">
	 <!-- stroke-gap-icons -->
	 <link rel="stylesheet" href="assets/stroke-gap-icons/stroke-gap-icons.css" type="text/css">
	 <!-- Animate CSS -->
	 <link rel="stylesheet" href="assets/css/animate.min.css" type="text/css">
	 <!-- Style CSS -->
	 <link rel="stylesheet" href="assets/css/style.css" type="text/css">
	 <!-- Style CSS -->
	 <link rel="stylesheet" href="assets/css/jcarousel.connected-carousels.css" type="text/css">
	 <!--  baguetteBox -->
	 <link rel="stylesheet" href="assets/css/baguetteBox.css">
	 <!-- Owl Carousel Assets -->
	 <link href="assets/owl-carousel/owl.carousel.css" rel="stylesheet">
	 <link href="assets/owl-carousel/owl.theme.css" rel="stylesheet">
	 <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
	 <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	 <!--[if lt IE 9]>
       <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"> </script>
       <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"> </script>
       <![endif]-->
 </head>
	  

     
      
Page Body
	  
	  
	  <body>
	<!--  Preloader  -->
	<div id="preloader" class="loader-wrapper">
		<div id="loading" class="loader"></div>
	</div>
	<header>
		<!-- header-outer -->
		<section class="header-outer">
			<!-- header-slider -->			
			<!-- /header-slider end -->
		</section>
		<!-- /header-outer -->
		<section class="top-md-menu">			
				
		</section>
	</header>
	<!-- banner -->
	<section class="banner homebanner">
		
	</section>
	<!-- /banner -->
	<!-- deal-outer -->
	<section class="deal-section">
		
	</section>
	<!-- /deal-outer -->
	<!-- parallax_banner -->
	<section class="parallax_banner">		
	</section>
	<!-- parallax_banner -->
	<!-- best-on-top -->
	<section class="best-on-top">		
	</section>
	<!-- /best-on-topr -->
	<!-- last-news -->
	<section class="last-news">		
	</section>
	<!-- /last-news -->
	<footer>		
	</footer>
	<!-- Get Our Email Letter popup -->
	<div class="modal fade modal-popup" id="modal1" data-open-onload="true" data-open-delay="1500" tabindex="-1" role="dialog">		
	</div>
	<!-- /Get Our Email Letter popup -->
	 <!--  quick popup  -->
         <div class="modal fade bwidth" id="quickModal" tabindex="-1" role="dialog">            
         </div>
         <!-- /.modal -->
	<p id="back-top" style="display: block;">
		<a href="#top"><i class="fa fa-chevron-up" aria-hidden="true"></i></a>
	</p>
	<script src="assets/js/jquery.js"></script>
	<!-- Bootstrap Core JavaScript -->
	<script src="assets/js/bootstrap.min.js"></script>
	<script src="assets/js/bootstrap-dropdownhover.min.js"></script>
	<!-- Plugin JavaScript -->
	<script src="assets/js/jquery.easing.min.js"></script>
	<script src="assets/js/wow.min.js"></script>
	<!-- owl carousel -->
	<script src="assets/owl-carousel/owl.carousel.js"></script>
	<!--  Custom Theme JavaScript  -->
	<script src="assets/js/custom.js"></script>
	<!--  jcarousel Theme JavaScript  -->
	<script type="text/javascript" src="assets/js/jquery.jcarousel.min.js"></script>
	<script type="text/javascript" src="assets/js/jcarousel.connected-carousels.js"></script>
	
</body>

      
      
      

This template uses CSS for stylesheets.

CSS files are located in the assets/css directory.

This template imports several JS files.

The Javascript  files are loaded in the footer to increase the site speed and rendering.

The Javascript files used in this template are the following:

  1. jQuery
  2. Bootstrap
  3. Other Javascript plugins (Check details in the Sources section)
  4. Cstom scripts (custom.js) - It contains the global scripts we are using for every pages in the template. To get a detailed understanding of this, please have a look at this file that contains an explanation written in comment.
  5. Custom plugins to use in some specified pages.

You just need to add attribute data-[plugin Name] to any place where you want to initialize plugin.

Owl Carousel

We use owl carousel for all sliders and carousels in this template.

We can make responsive image carousel using Owl Carousel. http://owlgraphic.com/owlcarousel

                        <div id="owl-demo" class="owl-carousel">
                              <div class="item">
                                 <div class="imghover" data-toggle="modal" data-target="#exampleModal" data-whatever="@mdo">
                                    <img src="assets/img/gallery/gallery1.jpg" alt="Owl Image"/>         
                                    <a href="#" class="link-img"><i class="fa fa-expand"></i></a>                              
                                 </div>
                              </div>                              
                           </div>
        

Homepage

Homepage 02

Homepage 03

Homepage 04

Homepage 05

Homepage 06

There are 6 types of home pages: Grid, Grid sidebar, Single page and Single page fullwidth.

About

Grid 4 columns

Grid 3 columns

Grid sidebar left

Product list

Shop Detail

There are 2 types

Shop Detail

Shop Detail 02

List Product

There are 2 types

List Product

List Product 02

Shopping cart

Checkout

Wishlist

Blogs

There are 3types of blog pages: About us, Company history, Career, Partners and Our team.

Blog Columm2 Masonry

Blog Columm2

Blog Columm3

Blog Columm3 Masonry

Contact

Contact

404 ERORR

Scripts

CSS

Free fonts

Images

Any Images or logos used in previews are not included in this item or final purchase and you need to contact authors to get permission in case you want to use them in your commercial or non-commercial projects.

We used http://placehold.it/ for placeholders.