By: Ashish Bogawat
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!
This theme is a single page personal site best suited for independent designers, developers and photographers who want to establish their presence on the web and showcase their work. The template is divided in three main areas (DIVs) -
footer. The header DIV contains the navigation elements and the content DIV side contains all content pages in separate DIVs. I'm using jQuery for the fading effect when navigating across sections. Here's the broad HTML document structure.
Content for each of the four section is contained within DIVs with the class
page. Each section has a
left & a
right section. The left side contains the author's photo, featured site, twitter update and contact form in their respective sections. The remaining content is on the right side.
Here's a look at how the "关于 me" section is structured. I've followed similar logic for the rest, so you should be able to follow along fine.
All styles for the content are in the styles/2143/style.css file. The CSS is structured like this:
/* --- RESET --- */ An adaptation of Eric Meyer's CSS reset for cross-browser consistency /* --- GLOBAL TYPOGRAPHY --- */ All primary text styling /* --- STRUCTURE --- */ Document structure, layout and positioning /* --- NAVIGATION --- */ Styling for the navigation menu /* --- CONTENT - XYZ --- */ Styling specific to each of the four content sections
For IE7 and IE8 compatibility, I've included a separate CSS file - styles/2143/ie.css - using conditional linking in the index.html. There is also the ligstyles/2143/htbox.css file which contains style definitions for the jQuery lightbox.
Please note that the template is not compatible with IE6.
It also uses custom jquery definitions for:
This template imports two PHP files for the contact form function:
To customize the form to your specific requirements, change the e-mail IDs in lines 3 and 4 in the contactengine.php file. Note that this is a critical step and the contact form will not work unless you enter the correct e-mail ID(s).
Included with the template is cardex.psd, wihch is the base PSD file which contains all the content layouts and site elements.
To create more color variations, just change the hue-saturation settings for the bg layer and change the colors for site title and links accordingly.
The template uses icons from the following two sets as well as some custom created icons. The icons that I created are available as smart objects in the PSD file. You will need Adobe Illustrator to edit them. The icons picked from other sets are licensed for use in commercial templates and have been attributed in the template footer.
I've used two custom fonts:
I've also used a free texture for the background from DeviantArt. As the link on the page suggests, the textures are free for any kind of use without attribution.
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.