3.1 - General

All css files are tested, commented and well-coded. Style.css file is the main css file of the Boss. Other files are listed below...

• bootstrap.min.css - Bootstrap Framework css file
• fontawesome.min.css - Fontawesome font icon's css file
• simple-line-icons.css - Simple line font icons
• bootstrap-switch.css - Bootstrap switch css file
• style.css - Main css file
• jquery.selectbox.css - For custom selects (jquery plugin styles)
• animate.css - Awesome css animate css file
• fonts.css - Fonts css file
• bootstrap-datetimepicker.css - Bootstrap Datetimepicker plugin
• YTPlayer.css - For Youtube video background (jquery plugin styles)
• magnific-popup.css - Lightbox plugin Css file
• vspacing.css - This is a helper css file to make vertical spacing easier
• mediaelementplayer.css
• revslider.css - Premium Revolution slider's css file
• jquery.kwicks.css - Jquery Plugin (used for index16.html home section)
• Revslider Folder - All revolutions slider css files in here.
• Skins folder - For now this folder has just 1 css file to make fonts lighter.

3.2 - Revslider (Folder) Css Files

This folder contains all revolutions sliders related css files. All homepages and about pages slider stylesheets are placed in this folder.

1. Example:revslider-index2.css file used in index2.html (main slider)
2. Example:revslider-aboutme.css file used in aboutme4.html (main slider)

3.3 - Colors (Folder) Css Files

This folder contains all color schemes related css files. There are total 12 prdefined color schemes. You can easly copy on of them and change color hex values to create your own color schemes.

List of Predefined Color Stylesheets: (You can find hex values of colors at the top of the css file.)

• green.css - This is the main color scheme
• blue.css
• brown.css
• brown2.css
• gold.css
• green2.css
• lightblue.css
• darkblue.css
• purple.css
• samon.css
• seagreen.css
• violetred.css

How to change color scheme css file:

--- Open html file with you text editor and find the line below and change green.css name with the new one
<link rel="stylesheet" id="color-scheme" href="css/colors/green.css>

3.4 - Skins (Folder) Css Files

There is just one file in this folder for now. With the updates I will add more skins. This file is lightfonts.css. Basically, this file makes bold fonts lighters. Just add this file after style.css file. And see the differances.

Example: This file used in index8.html file.

4.1 - General Javascript

All codes are commented and well coded. Id you want to change something, please be careful. If you are not sure what you are doing please contact me. So that i can help you.Other than home pages sliders and some others, all javascript/jquery codes are placed at the main.js file.

Caution: For the homepages, home section related js codes are placed at the bottom of the page. Not in the main.js file. For example; you can find call for revolution slider at the bottom of the index.html file.

    /* index27.html -  Popular Products */
    $('.owl-carousel.shop-popular-carousel').owlCarousel({
        loop:false,
        margin:20,
        responsiveClass:true,
        nav:true,
        dots: false,
        autoplay: true,
        autoplayTimeout: 10000,
        responsive:{
            0:{
                items:1
            },
            480: {
                items:2
            },
            768: {
                items:3
            },
            992: {
                items:4
            },
            1200: {
                items:5
            }
        }
    });

4.2 - Google Map

You can find google maps related javascript coe at the bottom of the page. Just the change informations with yours. (coordinates, addresses)

4.3 - Twitter Feed

• Step 1: Go to Twitter Dev Page. ( You must sign in)
• Step 2: Click to the Create a new application button.
• Step 3: Fill the inputs and then click to the Create your Twitter application button.
• Step 4: Now you will see a page like this.
  
• Step 5: Scroll down and Click to the Create my access token button. ( Click couple of times until you see created information box )
• Step 6: Now you will see a page like this.
  
• Step 7: Open Boss Template folder, open js folder and then twitter folder. Open index.php file with any text editor. And Scroll down find these variables. Starts about 25. lines... And change its values with your new created keys.

      // Your Twitter App Consumer Key
      private $consumer_key = 'CONSUMER_KEY';
  
      // Your Twitter App Consumer Secret
      private $consumer_secret = 'CONSUMER_SECRET';
  
      // Your Twitter App Access Token
      private $user_token = 'ACCESS_TOKEN';
  
      // Your Twitter App Access Token Secret
      private $user_secret = 'ACCESS_TOKEN_SECRET';
  

  
• Step 8: After changing keys. Go back to js folder. And open main.js file with your text editor.
• Step 9: Find Twitter Feed Plugin section and change query with whatever you want search from Twitter.
• Step 10: Done... Refresh your page enjoy :)

4.4 - Flickr Feed

Go to Flickridgtrr. And get your Flickr id number. Go to js folder and open main.js file. Find Flickr feed section. And change id with your new id.

    $('ul.flickr-feed-list').jflickrfeed({
            limit: 6,
            qstrings: {
                id: 'xxxxxxxxxxxx'  --  Change xxxxxxxxxxxx with your new id
            }
        }

4.5 - Contact Form (v1.0.5)

How to use conract form?

You need a server to make it work, it should work even on a local server. How to make it work: First you need to open php/mail.php file with your text editor. And change placeholder informations with your informations. Plese see image below to learn how.

If you want to use a gmail smtp server like i do, you just need to change Username and password with your gmail username and password.

Caution:If you have a problem with gmail settings, please make sure to go this page and find out what you need to change.

How to change error messages or translate?

To change error messages you need to open js/contact.js file with your text editor and make the changes you want.

name - subject - email - message inputs are required. lastname input and checkbox are not. If you want to change required inputs please visit jquery.validate plugins documentation on their website. It is really easy to understand and change. You just need to change some variables in contact.js file

If you have any problem, please feel free to contact me.