MadisonTemplate Documentation by Luis Zuno

Thank you for downloading my theme. If you have any questions that are beyond the scope of this help file i don't offer support however you can always visit the forums other members may help you there.

Descriptiontop

Madison Template is a theme with a responsive design for your creative portfolio. Showcase your work display, blog, videos, image galleries and more. View the online demo

HTML

This theme is a responsive layout theme made in valid HTML 5 markup, its perfect for personal blog/portfolio style websites. Also this site is responsive to all major devices (Tablet and iphone) to date.

HTML Structure top

The HTML structure for the pages are the a HEADER a #MAIN and a FOOTER all inside of a div wrapper to align everything.

File list top

This download package contains all the necessary HTML, CSS, JS and Image files necessary to build a complete site on the following folders (/img, /js, and /css). You can download the editable PSD files in this link

Google Map top

To set up the google map edit the contact.html file at the very end of the file document and edit these values

<script type="text/javascript">
var map;
$(document).ready(function(){
	map = new GMaps({
		div: '#map',
		lat: -12.043333,
		lng: -77.028333
	});
	map.addMarker({
	  lat: -12.043333,
	  lng: -77.028333
	});
});
</script>

Contact Form top

The contact form page uses 2 files (js/form-validation.js) and the PHP (send-mail.php) that actually sends the data edit this file to configure the recipients.

If you need more fields added to the contact form you would need to edit the contact.html and also add the fields on the "js/form-validation.js" file

CSS Files and Structuretop

All the CSS files are stored in a folder named css on the root of the html files.

There's a main css css/style.css with all the styles for the site it also calls different css files that help to reset the styles and some other css files for the social icons and the web elements.

LESS Filestop

I have included a folder with the LESS files in case you are developer and want to use them instead of the CSS files. You should see this folder named "LESS" on the root folder.

Image Filestop

All the graphic elements for the entire theme are contained at the "img" folder. The mockup images used to feed the site are contained at the "img/dummies" folder.

Get the PSD files in this link

Javascripttop

In order to modify the behavior from a certain jquery element open the "js/custom.js" file. where you can alter the parameters of some of the js elements.