FotoHunter - Creative Modern Photographer HTML Template

Multipage Photographer Theme

By: annabalashova
themeforest.net/user/annabalashova

Thank you for purchasing my theme. If you still have some questions that you could not find in the scope of this help file, please contact me through email via my user page contact form here. You can also follow me on Themeforest to keep track of all my future themes, that you might be interested in. Thank you very much!

Pages

Site consists of 9 pages index.html, about.html, blog.html, blog_single.html, contact.html, work details*, portfolio page**, service.html, team.html

work details* - you can choose one of 2 pages single_work.html or fullscreen_work.html
portfolio page** - you can choose one of 4 pages portfolio_four_column.html, portfolio_horizontal.html, portfolio_masonry.html or portfolio_three_column.html

To replace the work details
You must replace the block  on the same block of one of the pages single_work.html or fullscreen_work.html

To replace the portfolio page
You must replace the block  on the same block of one of the pages portfolio_four_column.html, portfolio_horizontal.html, portfolio_masonry.html or portfolio_three_column.html

To replace the logo If you have image file with your logo your must replace this block , example

<!--  LOGO  -->
<a class="logo" href="index.html">
  <img src="url_for_your_logo.jpg" alt="company logo">
</a>
<!--  //LOGO  -->

HTML Files & Structure

Site consists of 5 sections (6 sections features of some pages) .left-menu, .right-content its a main sections
This section includes .right-content 3-4 sections .home-page, .main-block, .portfolio-with-details, .right-images or in blog .right-images replace on .blog-right
To hange the styles, colors, and other options in the site you can in css/style.css file.

<div class="left-menu">
    [LOGO, MENU BLOCK AND TWITTER]
</div>

<div class="right-content">
    <div class="flexslider home-page">
        [TOP FULL SCREEN SLIDER]
    </div>
    <div class="main-block">
        [CONTENT OR PORTFOLIO, ECT]
    </div>
    <div class="portfolio-with-details">
        [BIG PORTFOLIO SLIDER OR PORTFOLIO DETAILS]
    </div>
    [IF THIS IS BLOG PAGE]
    <div class="blog-right col-lg-3">
        [BLOG NAVIGATION, TAGS, SEARCH, ECT]
    </div>
    [IF THIS IS OTHER PAGE]
    <div class="right-images col-lg-3">
        [SMALL IMAGES SLIDER]
    </div>
</div>

If you would like to edit the color, font, or style of any elements in one of these columns, you would do the following:

Colors: you must add one of the class name: blue, red, yellow, lightgreen, lightred, pink, purple, turquoise, green to the body.;
background: if you want white theme you can add class name white to the body;
Fonts: replace the existing font assigned to the body;

CSS Files

I'm using 16 CSS files in this theme.

style.css - Main stylesheet. This file also contains some general styling, such as anchor tag colors, font-sizes, etc.
secondary.page.style - This file add some fix to secondary page like about.html or team.html .
bootstrap.min.css - bootstrap styles
flexslider.css - FlexSlider styles. Used in the blog.
fonts.css - Fonts style. Use this file if you want to change fonts
font-awesome.min.css - Icon style.
blue.css, red.css, yellow.css, lightgreen.css, lightred.css, pink.css, purple.css, turquoise.css, green.css - Color style. Use one of this style for your theme
white.background.css - Background style. Use this file for switch background color

Mind that these values might be overridden somewhere else in the file.

style.css file contains all of the specific stylings for the page. The file is separated into sections using:


/*--------- NAME OF BLOCK -------------*/

etc.

If you would like to edit a specific section of the site, simply find the appropriate label in the CSS file, and then scroll down until you find the appropriate style that needs to be edited.

All images are found in the images. If you want to replace the image, just copy the folder with the same name as the original file with identical proportions.

JavaScript

Twelve Javascript files are used in this site.

custom.script.js - User configuration file scripts. Most of the animation in this site are carried out from the customs scripts. There are a few functions that you can look at.

file contains all of the specific stylings for the page. The file is separated into sections using:
```
/*--------- NAME OF BLOCK -------------*/

etc.
```
jquery.gridrotator.js - gridrotator script. Used in the portfolio block for create grid.
jquery.flexslider-min.js - FlexSlider script. Used in the home block.
jquery.mb.YTPlayer.js - video player on slides in section home.
jquery.min.js - jQuery 1.10.2.
jquery.scrollTo-min.js - replacement for the standard to scroll.
jquery.parallax-1.1.3.js - parallax for images.
jquery.countTo.js - for calc animation.
masonry.pkgd.min.js - masonry gallery.
modernizr.custom.js - this script need for detect what the browser can support.

E-Mail Form

For use the booking form your need to change e-mail address in the mail.php file. You can open this file any text editor.