david
faf629fb45
git-svn-id: https://192.168.0.254/svn/Proyectos.Incam_Inselsoft@1 b8459336-5772-e545-a78a-db11218ae9be
184 lines
8.1 KiB
HTML
184 lines
8.1 KiB
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
|
||
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||
<head>
|
||
<meta name="generator" content="HTML Tidy for Windows (vers 14 February 2006), see www.w3.org" />
|
||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||
<title>
|
||
Clickr Documentation
|
||
</title>
|
||
<link rel="stylesheet" type="text/css" href="style.css" />
|
||
</head>
|
||
<body>
|
||
<div class="logo">
|
||
<img src="images/logo.jpg" alt="COMBAT" width="114" height="45" /> </div>
|
||
<div class="author_details">
|
||
<p>
|
||
Created: 24 Dec 2010<br />
|
||
Author: Saurabh Sharma<br />
|
||
email: <a href="mailto:xconsau@gmail.com">xconsau@gmail.com</a>
|
||
</p>
|
||
</div><br class="clearf" />
|
||
<div class="info">
|
||
<p>
|
||
Dear Buyer, thank you for purchasing <strong>Clickr</strong> landing page. 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 <a href="http://themeforest.net/user/SaurabhSharma">here</a>. Thanks so much! </p>
|
||
</div>
|
||
<h2 id="toc">
|
||
Table of Contents
|
||
</h2>
|
||
<ol>
|
||
<li>
|
||
<a href="#intro">Introduction</a> </li>
|
||
<li>
|
||
<a href="#html">HTML structure</a> </li>
|
||
<li>
|
||
<a href="#css">CSS files and structure</a> </li>
|
||
<li>
|
||
<a href="#js">Javascript files</a> </li>
|
||
<li><a href="#credits">Sources and credits</a> </li>
|
||
</ol>
|
||
<div class="section">
|
||
<h3 id="intro">
|
||
1. Introduction - <a class="scroll" href="#toc">top</a> </h3>
|
||
<p><strong>Clickr</strong> is a Click through landing page with minimalist design and above-the-fold layout. The main idea behind such design is – Read the offer and Click to buy.<br />
|
||
Clickr comes with three page templates:<br />
|
||
1. Default template with product image, or video embed code.<br />
|
||
2. A template with jquery cycle slider<br />
|
||
3. A template with any of the above styles and page content with e-mail subscribe form.</p>
|
||
<p>You can use any of these templates according to your product offer and requirements.</p>
|
||
</div>
|
||
<div class="section">
|
||
<h3 id="html">
|
||
2. HTML structure - <a class="scroll" href="#toc">top</a>
|
||
</h3>
|
||
<p>
|
||
<strong>Clickr</strong> is a fixed HTML layout with 1 Column, header and footer. The design hierarchy can be divided into 4 main sections, as listed below:
|
||
</p>
|
||
<ul>
|
||
<li>Header </li>
|
||
<li>Featured </li>
|
||
<li>Primary </li>
|
||
<li>Footer </li>
|
||
</ul>
|
||
<p>
|
||
These sections can be seen in HTML markup as:
|
||
</p><img src="images/html.jpg" alt="Basic HTML structure" />
|
||
<p>The default template uses first three sections, whereas, the template with page content uses a footer section too.</p>
|
||
</div>
|
||
<div class="section">
|
||
<h3 id="css">
|
||
3. CSS files and structure - <a class="scroll" href="#toc">top</a>
|
||
</h3>
|
||
<p>
|
||
<strong>Clickr</strong> uses 1 CSS file for its styling and appearance. This file is <strong>style.css</strong>. The general structure is divided into 6 different sections, each with a label, as shown below: </p>
|
||
<img src="images/css.jpg" alt="CSS structure" />
|
||
<p>
|
||
In order to change a particular style rule, you can quickly refer to the <strong>TABLE OF CONTENTS</strong> and then switch on to appropriate section.</p>
|
||
</div>
|
||
<div class="section">
|
||
<h3 id="js">
|
||
4. Javascript files - <a class="scroll" href="#toc">top</a>
|
||
</h3>
|
||
<p>
|
||
<strong>Clickr</strong> uses 6 different javascript files for content enhancement and different features. These files are:
|
||
</p>
|
||
<ol id="js_list">
|
||
<li>Jquery Library (jquery-1.4.4.min.js) </li>
|
||
<li>Jquery Plugins
|
||
<ol><li>jquery.cycle.all.min.js </li>
|
||
<li>jquery.easing.min.js </li>
|
||
</ol>
|
||
</li>
|
||
<li>Cufon font replacement
|
||
<ol>
|
||
<li>cufon-yui.js </li>
|
||
<li>PT_Sans.font.js</li>
|
||
</ol>
|
||
</li>
|
||
<li>Miscellaneous
|
||
<ol>
|
||
<li>custom.js </li>
|
||
</ol>
|
||
</li>
|
||
</ol>
|
||
<p>
|
||
Let’s have a quick look on these files one by one:
|
||
</p>
|
||
<p>
|
||
<strong>1. Jquery library</strong><br />
|
||
jQuery is a javascript library that reduces the amount of code we must write. The file jquery-1.4.4.min.js is used commonly for all the plugins throughout the template. This file should be called in the top-most stack order in the head section. Failing to which, the plugins will not work correctly. You need not modify or change the content of this file.
|
||
</p>
|
||
<p>
|
||
<strong>2. Jquery Plugins</strong><br />
|
||
These are open source Jquery plugin files created by various developers worldwide. Although, you need not modify or edit these files, I shall mention the role of these files one by one:
|
||
</p>
|
||
<ul>
|
||
<li><strong>jquery.cycle.all.min.js:</strong> This file is used for image slider. </li>
|
||
<li>
|
||
<strong>jquery.easing.min.js:</strong> Required for easing enhancements in jquery animations. </li>
|
||
</ul>
|
||
<p>
|
||
<strong>3. Cufon font replacement</strong><br />
|
||
Clickr uses PT Sans font for displaying main heading. This font is rendered via Cufon font replacement tool. For Cufon font replacement, we require two files:
|
||
</p>
|
||
<ul>
|
||
<li>
|
||
<strong>cufon-yui.js:</strong> This is the main tool/plugin for Cufon font replacement. You need not edit or modify the contents of this file. </li>
|
||
<li>
|
||
<strong>PT_Sans.font.js:</strong> This is a JS version of PT Sans font. You need not edit the contents of this file as well. </li>
|
||
</ul>
|
||
<p><strong>4. Miscellaneous</strong><br />
|
||
Custom.js: This file is used to initialize jquery cycle plugin. All settings related to slider can be found inside this file. You can control effects and animation speed using the parameters inside this file.<a href="#js"></a> </p>
|
||
</div>
|
||
<div class="section">
|
||
<h3 id="credits">
|
||
5. Sources and credits - <a class="scroll" href="#toc">top</a>
|
||
</h3>
|
||
<p>
|
||
I have used the following files and images, as listed:
|
||
</p>
|
||
<h5>jquery-1.4.4.min.js</h5>
|
||
<p>http://jquery.com/<br />
|
||
Copyright 2010, John Resig<br />
|
||
</p>
|
||
|
||
<h5>jquery.cycle.all.min.js</h5>
|
||
<p>jQuery Cycle Plugin (with Transition Definitions)<br />
|
||
Copyright (c) 2007-2009 M. Alsup<br />
|
||
</p>
|
||
|
||
<h5>jquery.easing.min.js</h5>
|
||
<p>jQuery Easing v1.1 - http://gsgd.co.uk/sandbox/jquery.easing.php<br />
|
||
Copyright (c) 2007 George Smith<br />
|
||
</p>
|
||
|
||
<h5>cufon-yui.js</h5>
|
||
<p> </strong> Copyright (c) 2009 Simo Kinnunen.<br />
|
||
Licensed under the MIT license.<br />
|
||
@version 1.09
|
||
</p>
|
||
|
||
<h5>PT_Sans.font.js</h5>
|
||
<p> Copyright © 2009 ParaType Ltd. All rights reserved.</p>
|
||
|
||
<h5>Icons by </h5>
|
||
<p>www.we-function.com, www.komodomedia.com</p>
|
||
</div>
|
||
<div class="section">
|
||
<p>
|
||
Once again, thank you so much for purchasing this template. As I said at the beginning, I'd be glad to help you if you have any questions relating to this template. 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.
|
||
</p>
|
||
<p>
|
||
<strong>Saurabh Sharma</strong>
|
||
</p>
|
||
<p>
|
||
<a href="#toc">Go To Table of Contents</a>
|
||
</p>
|
||
</div>
|
||
<div class="section">
|
||
<img src="images/footer_logo.jpg" alt="silksun" /><br />
|
||
© 2010 SaurabhSharma.
|
||
</div>
|
||
</body>
|
||
</html>
|