Elementz Theme

Created: 4/2009 by: myTheme

Thank you for purchasing my theme!

If you have any questions that are beyond the scope of this help file, please feel free to contact me via my user page contact form.

Have you checked my Businexx Theme?

Template features:

TABLE OF CONTENTS

  1. HTML Structure
  2. CSS Files
  3. Javascript
  4. Contact form
  5. PSD Files
  6. Changing Color Theme

1. HTML Structure

This theme is a fixed layout with two columns in the content pages. The width of the layout is 960px.

1) Homepage

Homepage uses different styling because of the Slider animation. The slider in homepage is within a div with an id of "intro".

2) Content Pages

All of the information within the main content area is nested within a div with an id of "primaryContent". The sidebar's content is within a div with an id of "secondaryContent".

See the comments in html files for further information.

2. CSS

The styling of the template is divided in two CSS files. default.css is the main styling file and the file called lightbox.css includes styling used in jQuery Lightbox effect. Both of the files can be found in css directory.

CSS files are commented and divided in sections for layout, typography, lists etc. This makes it easier for you to read the code and make your changes if necessary.

3. Javascript

This theme imports three Javascript files. They can be found at the js folder.

  1. jQuery jquery-1.3.2.min.js
  2. Easy Slider easySlider1.5.js
  3. Lightbox jquery.lightbox.js

1) jQuery is a Javascript library that greatly reduces the amount of code that you must write. There should not be need to make changes in jQuery file unless you really know what your're doing.

2) Homepage slideshow animation uses jQuery plugin called Easy Slider. You can make changes to animation speed, automation etc. in file easySlider1.5.js. The Javascript file is well commented so it's easy to understand and make necessary changes even if you're not familiar with Javascript. More information and help about this plugin at http://cssglobe.com/post/4004/easy-slider-15-the-easiest-jquery-plugin-for-sliding/.

3) Lightbox effect is used to display images. You can see the effect in action at the Portfolio boxes and at About pages sidebar images. More information and how to use the Lightbox can be found at http://warren.mesozen.com/jquery-lightbox/.

4. Contact Form

Template includes a fully working contact form. Just change the email setting in file sendmail.php:

$youremail = "you@yourdomain.com";

Replace "you@yourdomain.com" with your own e-mail address.

5. PSD Files

PSD files for this template are in the PSD folder.

If you want to change the color theme, just open PSD files for backgrounds: body-bg.psd, header-bg.psd, footerContent-bg.psd. The background color can be easily changed with the color layer ("bg-color").

PSD folder also includes files for note and portfolio boxes which you can modify easily.

6. Changing Color Theme

Changing color theme is extremely easy.

  1. Modify the PSD files for backgrounds as mentioned in chapter 5
  2. Copy the color which you used to replace the default blue, #0F3149
  3. Open default.css file from the css folder
  4. Search and replace the blue color with your new color
  5. Green color used in the default theme is #67920D. Search and replace that too if you like
  6. Save the files and refresh the template!

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.