“Resume(CV) Perfecto” Documentation by “Mustafa Quilon” v1.0


The Perfect - One Page Resume/Site Theme”

Created: Jan/18/2010
By: Mustafa Quilon
Email: mustafaquilon@gmail.com

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!


Table of Contents

  1. About The Theme
  2. HTML Structure
  3. CSS Files and Structure
  4. JavaScript
  5. PSD Files
  6. Contact Form Configuration
  7. Google Map Configuration
  8. Sources and Credits

A) About The Theme - top

This is a professional, clean, flexible and customizable Resume or CV theme, great for everyone to showcase their online bio. It's pretty savvy, minimal and displays your information in style and yet it remains professional.


B) HTML Structure - top

This theme is a fixed layout with a single page. All the content is divided into 4 broad sections:

Content Sections

The content div encloses all the sections. You can re-order or customize these sections according to your needs or simply change the content where required.

HTML Structure - Sections

The Menu & Avatar

You can change the menu items & avatar in this section as shown.

HTML Structure - Menu

Networks / Miscellaneous Tasks Section

THere are more social networking icons provided in the assets folder. You can change the items and its content here as shown below.

HTML Structure - Networks

If you want to modify the styles/color of the tooltips please see the main.js file(in scripts folder) and edit this section as shown in the next screenshot. You can add a class of "tooltip" to an element to display a tooltip. If you want help editing this section please read the qtip documentation here

HTML Structure - Tooltip Settings

Gallery Section

Each gallery element is an unordered list and they can link to an image, a group of images, a youtube video, a swf file, a quicktime video or an iframe. For settings an other details please visit Pretty Photo Documentaion.

You can create more gallery sections if you want.

Copyright Information

To modify the copyright information, please see the following screenshot:

HTML Structure - Copyright


Generally,

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

	.main a {
		color: #someColor;
	} 

If you find that your new style is not overriding, it is most likely because of a specificity problem. Scroll down in your CSS file and make sure that there isn't a similar style that has more weight.

I.E.

	.item .main a {
		color: #someColor;
	}

So, to ensure that your new styles are applied, make sure that they carry enough "weight" and that there isn't a style lower in the CSS file that is being applied after yours.


C) CSS Files and Structure - top

There is only a single screen stylesheet - main.css(in the styles folder) necessary for customization. It is structured, customized and formatted properly and if you have a hands-on knowledge of css it should be a breeze for you to edit the theme and make changes.

There is also a single print stylesheet - print.css(in the styles folder). This has pretty basic styles according to printing standards. It hides unnessary sections and makes your resume printer-friendly.

There is one other css file which is used for the lightbox effect.

There are 2 more stylesheets for fixes in IE - ieFix.css & ieFix7.css.


D) JavaScript - top

This theme imports five Javascript files. All located in the "scripts" folder. There are 2 additional scripits loaded for IE 6 using conditional comments.

  1. jquery-1.3.2.min.js - jQuery Library
  2. jquery-scrollTo-localScroll.js - Scripts for scrolling
  3. qtip.js - Script for Tooltip
  4. jquery.prettyPhoto.js - Script for lightbox
  5. main.js - Initialization and custom scripts
  6. ieFix.js - script to imitate position fixed in IE 6.
  7. DD_belatedPNG_0.0.7a-min.js - pngFix for IE 6.

The map.html file imports an additional "jquery.jmap.min.js" which is used to customize the map..


E) PSD Files - top

There is a psd available for this theme: 1_home.psd


F) Contact form Configuration - top

Open config.php located in the theme and change mustafaquilon@gmail.com to your email address.


G) Google Map Configuration - top

The height and width of the pop-up and the triggering of the map is controlled by the element in index.html (Please see inline HTML comments for more details)

All other configuration takes place in maps.html page.

Some Important Points

HTML Structure - Google Map


H) Sources and Credits - top

I've used the following images, icons or other files as listed.


Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

mustafaquilon (Mustafa Quilon)

Go To Table of Contents