First Thing First

Welcome to Labflox. We are going to explore Labflox package. Unzip the package you will get 2 subfolders Documentation & Labflox.zip. Labflox.zip is your main file. Let's explore it.

Folders ->

  1. ajax-> All PHP files are stored here for mailing.
  2. css -> All CSS plugins, frameworks & custom CSS files.
  3. fonts -> Used icon fonts.
  4. images -> Logo, Favicon & other used images are here.
  5. js -> All third-party JS  plugins and custom js files are here.

Files ->

  1. 3+ Home page.
  2. 1+ About Us Pages
  3. 1+ Appointment Pages
  4. 1+ Service & 1 Service Details Combination
  5. 2+ Research & 1 Research Details Combination
  6. 1+ Package Page
  7. 1+ Gallery & 1 Gallery Details
  8. 1+ Team & 1 Team Details
  9. 3+ Blog Grid Pages.
  10. 3+ Blog Listing Pages.
  11. 1+ Blog Details Pages.
  12. 1+ Contact Page.
  13. 1+ FAQ Page.

Customizations

As you guys know that HTML is not rocket science. It's always easy to customize. And we think Labflox is more easier to customize. Cause we coded it carefully. And this is well-commented coding. So let's start.

HTML Head:

Here you can change your site Title, Meta Informations, CSS files & Favicon.

Preloader:

A single preloader has been used all over the template. We are going to show you the code. If you want you can disable it.

Header:

In Labflox we design 3 Unique headers. The first header is in index.html Second Header is in home-tow.html and the third header is in home-three.html.

Labflox

Slider:

We use the revolution slider in Labflox. Details documentation available https://www.themepunch.com/revsliderjquery-doc/slider-revolution-jquery-5-x-documentation/ here.

Let's see the First slider HTML. Here you can change your text, image, video, etc.

Footer:

In Labflox we design Footer. The Footer is in index.html Second Footer is in home-tow.html and the third Footer is in home-three.html. 

Let's see the first one.

CSS

We using 4 main CSS files in this template

Path -> css/preset.css

The first one is a generic reset file preset.css. Many browsers interpret the default behavior of HTML elements differently. By using a general preset CSS file, we can work around this. This file also contains some general styling, such as anchor tag colors, font sizes, etc. Keep in mind, that these values might be overridden somewhere else in the file.

Path -> css/theme.css

The second file contains all of the specific stylings for the page named theme.css. The file is separated into sections using comment.

Labflox

Path -> css/responsive.css

And third file is for maintain responsiveness of the theme named responsive.css. The file separated with media queries.

Path -> css/ignore_for_wp.css

If you are want to convert this HTML into any CMS or any other platform then you can ignore this css file. Some extra code are written here those are not need in any cms development. Also you can keep it. Its up to you now.

JS

We used lots of JS third-party plugins. Here in Labflox, we write custom scripts in file is theme.js and  File locate under js/ folder. We are going to show you some important parts of our theme.js file.

All Revolution Slider ->

All Owl Carousel & Slick Slider->

Contact Form->

Labflox

Preloader ->

Labflox

Counter ->

Labflox

PHP

Only one PHP file is available in Labflox. It's for mailing. The files are located under the ajax folder. The file path is ajax/mail.php

Credits

CSS Plugins ->

  1. Animate CSS
  2. Bootstrap
  3. Fontawesome Icons
  4. Slick
  5. Light Case
  6. Preloader

JS Plugins ->

  1. Bootstrap 
  2. slick
  3. Jquery Appears
  4. Owl Carousels
  5. Circle Progress
  6. Revolution slider
  7. Light Case
  8. Litepicker

Thanks

Once again, thank you so much for purchasing this product. As I said at the beginning, I'd be glad to help you if you have any questions relating to this template.  If you have a more general question relating to the template on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.