“Brownie - Responsive HTML5 Portfolio and Business Template”

Table of Contents

1. HTML Structure
2. CSS Files and Structure
3. JavaScript and Sources / Credits
4. Contact Form

A) HTML Structure - top

Brownie is a fixed-width HTML5 template, perfect for businesses and portfolios. It has a easy-to-understnad structure.

Home Page Structure:

               Header 

               Banner

               Features Box

               Featured Work

               About and Services Section

               Footer

            

               Header 

               Page Title

               Contents ( with or without sidebar )

               Footer

            

B) CSS Files and Structure - top

Brownie has two stylesheet files: style.css and ie.css

This is main CSS file for the template. It contains a generic reset snippet (Many browser interpret the default behavior of html elements differently. By using a general reset CSS file, we can work round this) and necessary styles required for the template.

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.

This file contains few styles for IE only.

C) Contact Form - top

One PHP file in the package: contact.php -> we are using this for contact form.

        $your_email = '[email protected]'; // Your email address

        $subject = 'Email from your contact form'; // Email subject

		

Change [email protected] with your email address on which you want to receive emails and change the subject if needed. Boom! form is done and visitors can contact you now through your site and all inquiries will be forwarded to the above mentioned email.

D) JavaScript and Sources / Credits - top

We used the following Jquery Plugins.

1. jQuery and jQuery UI
2. Quicksand
3. PrettyPhoto
4. FlexSlider
5. ResponsiveSlides
6. CSS media type/query in JS
7. FitVids
8. jQuery Cycle
9. Background-Position
10. Color animation
11. Easing 1.3
12. Slides

All the above scripts are combined in one script file all-in-one.js. There are also common and page specific scripts.

1. main.js
2. setup.js
3. contact-form.js
4. html5.js

Once again, thank you so much for downloading this template. As we said at the beginning, we'd be glad to help you if you have any questions relating to this template. No guarantees, but we'll do our best to assist.

eGrappler.com

Go To Table of Contents