Bewear

Responsive eCommerce Theme


Hello and thank you for purchasing this website template! Bewear is the perfect high-quality solution for those who want a beautiful eCommerce website in no time. It‘s fully responsive and will adapt itself to any mobile device. iPad, iPhone, Android, it doesn‘t matter. Your content will always looks its absolute best. This documentation guides you through the main features of this template and shows you how to use and customize them. If you have any further questions just drop us a line to support@transvelo.freshdesk.com

1.1 HTML Files (alphabetical order)

1.2 PHP Files (Folder wise alphabetical order)

If you are comfortable with PHP We've provided PHP files. These files have been broken into smaller parts keeping in mind the DRY (Do not repeat yourself) principle. Repeatable blocks and individual blocks have been broken down into smaller files and have been included wherever required.

All pages are loaded from index.php file.

1.2.1 Main Pages
1.2.2 Parts
1.2.2.1 General
1.2.2.2 Navigation
1.2.2.3 Product Extended
1.2.2.4 Product Simple
1.2.2.5 Products
1.2.2.6 Section
1.2.2.6.1 Home
1.2.2.6.2 Home-2
1.2.2.6.3 Product Simple
1.2.2.7 Sliders
1.2.2.8 Widgets
1.2.2.8.1 Sidebar

1.3 CSS

CSS files – with usage details (order of importance):

1.4 LESS

Less extends CSS with dynamic behavior such as variables, mixins, operations and functions. If you are not experienced or not aware of what LESS files is you don't have to worry, these files are not required for the template. Instead LESS files are compiled as CSS files. You can either edit LESS files and compile it to CSS or directly edit the LESS files

1.4.1 Components
1.4.2 Product

1.5 Images

Template images – with usage details (order of importance):

1.6 Javascript

JavaScripts and integrated jQuery scripts – with usage details (order of importance):

  • jquery-1.11.2.min.js – Script (minified) for jQuery script usage
  • bootstrap.min.js – Script (minified) for Bootstraps front-end framework
  • jquery-ui.min.js – Script (minified) for Range Slider
  • bootstrap-hover-dropdown.min.js – Script (minified) for enabling Bootstrap dropdown menus on hover
  • jquery.customSelect.min.js – Script (minified) for Custom Selct
  • jquery.easing-1.3.min.js – Script (minified) for easing jQuery transitions
  • owl.carousel.min.js – Script (minified) for content sliders/carousels
  • wow.min.js – Script (minified) for triggering animations on scroll
  • echo.min.js – HTML5 lazy loading
  • jquery.isotope.min.js – Isotope
  • jquery.bxslider.min.js – Script for Bx Slider
  • jasny-bootstrap.min.js – Script for Off Canvas Sidebar
  • lightbox.min.js – Script for LightBox
  • odometer.min.js – Script for Odometer
  • pace.min.js – Script for Pace
  • scripts.js – Script for adjustments and activation of all in the HTML files linked JavaScripts
  • Bewear is based on Twitters popular front-end framework Bootstrap for fully flexible and responsive layouts. It also uses the latest web technology HTML5 for semantic content structuring and CSS3 for versatile and powerful styling options.

    Read more about the used technology:

    Bootstrap: http://getbootstrap.com
    HTML5/CSS3: http://www.w3schools.com
    HTML5: http://html5doctor.com

    3.1 HTML

    Now comes the really interesting part! Learn how to use and customize this website template to fit your needs. The most important thing for you to do is actually look into the HTML source code and see how elements are written! The clean and commented code makes it easy for you to copy code blocks from content modules and past them in different places or layouts.

    <!-- ============================================== LOOKBOOK SLIDER ============================================== -->
    <div class="lookbook-slider">
    	...
    </div>
    <!-- ============================================== LOOKBOOK SLIDER : END ============================================== -->

    3.2 Logo

    It is highly recommended to use vector graphics for the logo like the Bewear template does with the PNG file format. This ensures the best possible and sharpest view on mobile devices and of course when scaling the logo. If it is not possible for you to use vector graphics you can still use raster graphics like the JPG or PNG file format of course. In this case you have to change the filename extension of the logo in the following HTML parts to this for example:

    
    

    3.2 Images

    The image usage in this website template is very easy to handle as well. The various image dimensions used across the website has been given as a placholder. The placeholder will also contain the image dimensions. This service is provided by http://placehold.it. Here is an example below :

    <div class="featured-product text-center">
    	<div class="image lazy-load">
    		<a href="index.php?page=product-simple">
    		    <img class="img-responsive" alt="" src="http://placehold.it/300x325/" />
    		</a>
    	</div>
    </div>
    

    Sometimes it is faster and more effective to solve problems through communication. So for problems you cannot solve with help of this documentation please send us a message and we will see how we can help!

    support@transvelo.freshdesk.com

    We've used the following images, icons or other files as listed.


    Once again, thank you so much for purchasing this theme. As We said at the beginning, We'd be glad to help you if you have any questions relating to this theme. No guarantees, but We'll do our best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

    Ibrahim Ibn Dawood