“Speranta” Documentation by atillus v1.0

---

“Speranta”

---

Table of Contents

1. HTML Structure
2. CSS Files and Structure
3. JavaScript
4. Layered PNG Files
5. Sources and Credits

---

A) HTML Structure - top

This theme is a fixed layout (960px width) with two columns.
All of the information within the main content area is nested within a div with a style name "content". The sidebar's (column #2) content is within a div with a style name"sidebar". The general template structure is the same throughout the template. Here is the general structure.

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

	.posts a {
		color: #someColor;
	} 

---

B) CSS Files and Structure - top

Style.css is general CSS file that contains all of the specific stylings for template pages.
The first section in style.css is a generic reset rules. Many browser interpret the default behavior of html elements differently. By using a general reset rules, we can work round this.

The file style.css is separated into sections using:

	/* HEADER SECTION */

	some code


	/* MAIN SECTION */	
	some code
	
	/* SIDEBAR SECTION */
	some code

	
	/* Portfolio pages SECTION */
	some code
	
	/* FOOTER SECTION */
	some code
	
	etc, etc. 

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...

All color-related CSS are located in /sss folder. Edit these files to change border and backgrounds properties for different color schemes...

---

C) JavaScript - top

This theme imports 6 Javascript files in total. All Javascripts files are located in /scripts folder.

1. jQuery (jquery.min.js) - Javascript library that greatly reduces the amount of code that you must write
2. Smooth menu navigation script (ddsmoothmenu.js)
3. Horizontal accordeon slider script (haccordion.js) - used on homepage only
4. Nivo slider script (scripts/nivoslider) - used on homepage only
5. Piecemaker Flash slider (scripts/piecemaker) - used on homepage only
6. Tabbed Panels script (tabs.js) - used on homepage only
7. Pretty Photo images script (scripts/prettyphoto) - used on portfolio page

---

D) Layered PNG Files - top

I've included 11 layered Fireworks PNG's with this theme:

1. The homepage layouts in different color schemes (home.png , home_color2.png , home_color3.png)
2. The blog page layout (blog.png)
3. The portfolio pages layouts (portfolio.png , portfolio2.png etc...)
4. The Single blog post layout (single.png)
5. The page layout (services.png)

---

E) Sources and Credits - top

I've used the following files as listed:

• Smooth Navigational Menu (v1.4) from Dynamic Drive
• Horizontal Accordion script from Dynamic Drive
• "Nivo" Slider script from dev7studios.com
• "Piecemaker" from www.modularweb.net
• Tabbed panels script from yensdesign.com
• prettyPhoto v2.5.6 from Stephane Caron
• Icons by Crystal Project

---

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.

Artur Cosicov.

Go To Table of Contents

---