About this template.
Features:
- Free template!!
- Single page website - All that you see is in one HTML page
- Deployment is literally pushing one index.html file to the hosting site.
- content is rendered using JQuery's fadeIn() or slideDown() effect - time the effect will last can be customized
- easily Customizable with some knowledge of HTML, CSS, Java Script
- Uses JQuery
- version: 1.9.1
- JQuery code is in the script block of this page
- by default JQuery is accessed from ajax.googleapis.com - this is to keep all the code in one page
- You can change this behaviour by downloading and adding the script from jquery.com
- CSS code is on the same page
- Additional files needed are
- jquery-1.9.1.min.js (at 91kb) "if" you want to host javascript on your site.
- Any additional image files that might be used
Developed by
Shivaram Challa (challa.net)
Other projects/tools created by Shiva
All the following tools are coded in C#. They are all licensed under
GNU GPL 3. Which means you can download, use and redistribute at will.
http://readcache.com/getwebfile: Download any text file off of a website.
http://readcache.com/browsepad: Simply a Notepad with a built-in file explorer.
http://readcache.com/excel2csvconverter: Converts Excel(.xls and .xlsx) file to CSV files. Each individual tab will be converted to a seperate CSV file (Webpage under is construction).
http://readcache.com/renameext: Rename several file's extension in a folder in a jiff.
Usage
Get source code
- Go to Download page to get the source code
- open the html file in a text editor like notepad or notepad2
- All the development for this template was done using notepad2
- Change all the text according to your needs
- See below guide to understand the purpose of each html element/tag
- Getting Fade-In or Slide-down effect:
- Find
<script type="text/javascript"> $(document).ready(function(){in the index.html file. - For Fade-in effect: replace
$("#page1").slideDown();with$("#page1").fadeIn(); - For Slide-Down effect: replace
$("#page1").fadeIn();with$("#page1").slideDown();
- Find
- For extending or reducing the time the effect lasts (default is one second (value=1000)):
$("#page1").fadeIn(xx); for the effect to last 3 seconds, replace xx with 3000, at all instance on the index.html file.
HTML element/tag and their purpose (with in this template)
| type | element |
|---|---|
| Site titles | h1 |
| sub title | h1 small |
| anchor tag | a |
| page title | h2 |
| page sub title | h3 |
| article title | h4 |
| paragraph | p |
guide
FREE Download!!
Download this file, by right-click and save as
- index.html Don't click on this link; instead right-click and save-as. OR
- View source of this page and save the source file as index.html
- ...Emply template coming soon...
All these files are optional
- jquery-1.9.1.min.js If you want to use this file you will have to add this line of script in your page:
<script type="text/javascript" src="jquery-1.9.1.min.js"> </script>
Copyright © 2013 Shivaram Challa
License
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with this program. If not, see
Contact Shivaram Challa
Website
This template is developed by Shivaram Challa (www.challa.net)
For suggestions or comments, send an email to shiva @ challa . net
Form
For Feedback form: click here