Installation

You will have to upload a folder and file into your website. To do this, open an FTP client and drag the /lite/ folder and the "styleswitcher.php" file into the same directory as your /textpattern folder (or where ever your index.php file for your Textpattern blog/cms is).

Open up the Textpattern admin page. Click on presentation.

Copy and paste the following into the textarea:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <? if(file_exists('./lite/.installed')) { $styleSheets = array(); // DEFINE STYLESHEETS $styleSheets[0]["type"]='small'; $styleSheets[0]["title"]='Small text'; $styleSheets[0]["sheet"]='<link href="/lite/css/charcoal1.css" rel="stylesheet" type="text/css" />'; $styleSheets[1]["type"]='medium'; $styleSheets[1]["title"]='Medium text'; $styleSheets[1]["sheet"]='<link href="/lite/css/charcoal2.css" rel="stylesheet" type="text/css" />'; $styleSheets[2]["type"]='large'; $styleSheets[2]["title"]='Large text'; $styleSheets[2]["sheet"]='<link href="/lite/css/charcoal3.css" rel="stylesheet" type="text/css" />'; // DEFAULT STYLESHEET $defaultStyleSheet=0; // SET STYLESHEET if(!isset($_COOKIE["STYLE"])) { if(isset($_SESSION["STYLE"])) { echo $styleSheets[$_SESSION["STYLE"]]["sheet"]; } else { echo $styleSheets[$defaultStyleSheet]["sheet"]; } } else { echo $styleSheets[$_COOKIE["STYLE"]]["sheet"]; } } else { echo '<link href="<txp:css />" rel="stylesheet" type="text/css" />'; } ?> <script src="/lite/javascripts/prototype.js" type="text/javascript"></script> <script src="/lite/javascripts/scriptaculous.js" type="text/javascript"></script> <script src="/lite/javascripts/fixed.js" type="text/javascript"></script> <title><txp:page_title /></title> </head> <body>  <div id="warning"> <h1>Warning!</h1> <p> Please upload the <code>/lite/</code> folder into the root folder of your website. If you need help with uploading the <code>/lite/</code> folder, please refer to the installation guide included in the download. </p> </div>  <div id="total">  <div id="head"> <div id="bar">  <div id="settings"> <div id="copyright_show"> <a href="#" onclick="new Effect.Appear('copyright'); return false;"> <img src="/lite/images/copyright.gif" width="30" height="30" alt="Copyright" /> </a> </div> <p> <? // WRITE OUT SWITCHER LINKS while(list($key, $val) = each($styleSheets)) { echo "<a href=\"styleswitcher.php?SETSTYLE=".$key."\" title=\"".$val["title"]."\"><img src=\"/lite/images/".$val["type"].".gif\" width=\"25\" height=\"30\" alt=\"".$val["type"]."\" /></a>"; } ?> </p> </div> </div> <div id="focus"> <div id="contain"> <div id="intro"> <p> <a href="/"> "<txp:site_slogan />" </a> </p> </div> <div id="title"> <h1> <a href="/"> <txp:sitename /> </a> </h1> </div> </div> </div> </div>  <div id="container"> <div id="sidebars">  <div id="right"> <h2>Search</h2> <txp:search_input label="" wraptag="p" size="" /> <h2>Categories</h2> <txp:category_list wraptag="p" /> <h2>Links</h2> <txp:linklist form="Links" wraptag="div" /> <h2>Feeds</h2> <p> <txp:feed_link label="RSS" /><br /> <txp:feed_link label="Atom" flavor="atom" /> </p> </div>  <div id="left"> <h2>10 Latest Topics</h2> <?php mysql_connect("localhost","studiopd_main","aucitrix"); mysql_select_db("studiopd_main"); $query = mysql_query("SELECT * FROM textpattern ORDER BY ID DESC LIMIT 10"); while($fetch = mysql_fetch_array($query)) { $Section = $fetch['Section']; $ID = $fetch['ID']; $UrlTitle = $fetch['url_title']; $Url = "/$Section/$ID/$UrlTitle/"; $Title = $fetch['Title']; $Body = substr($fetch["Body"],0,75); echo(" <h5> <a href=\"$Url\">$Title</a> </h5> <p> $Body... </p> "); } ?> </div> </div>  <div id="content"> <txp:article limit="5" /> <txp:if_individual_article> <p> <txp:link_to_prev> <txp:prev_title /> </txp:link_to_prev> | <txp:link_to_next> <txp:next_title /> </txp:link_to_next> </p> </txp:if_individual_article> <txp:if_article_list> <p> <txp:older> Previous </txp:older> | <txp:newer> Next </txp:newer> </p> </txp:if_article_list> </div> <br style="clear: both;" /> </div>  <div id="copyright" style="display: none;"> <p> <span> <a href="#" onclick="new Effect.Fade('copyright'); return false;"> <img src="/lite/images/copyright_exit.gif" width="30" height="12" alt="Copyright" /> </a> </span> Copyright © <?php $date=date(Y); echo("$date"); ?> <txp:sitename />. All rights reserved. Powered by <a href="http://www.textpattern.com">Textpattern</a>. Charcoal Lite template by Angelo Ashmore. <a href="http://validator.w3.org/check?uri=referer" title="This page is NOT valid XHTML 1.1 when viewing/posting comments">XHTML 1.1</a>, <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>. </p> </div>  <p id="teleport_top"> <a href="#" onclick="new Effect.ScrollTo('head'); return false;"> </a> </p> </div> </body> </html>

Click on archive. Copy and paste the following in the textarea:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <? if(file_exists('./lite/.installed')) { $styleSheets = array(); // DEFINE STYLESHEETS $styleSheets[0]["type"]='small'; $styleSheets[0]["title"]='Small text'; $styleSheets[0]["sheet"]='<link href="/lite/css/charcoal1.css" rel="stylesheet" type="text/css" />'; $styleSheets[1]["type"]='medium'; $styleSheets[1]["title"]='Medium text'; $styleSheets[1]["sheet"]='<link href="/lite/css/charcoal2.css" rel="stylesheet" type="text/css" />'; $styleSheets[2]["type"]='large'; $styleSheets[2]["title"]='Large text'; $styleSheets[2]["sheet"]='<link href="/lite/css/charcoal3.css" rel="stylesheet" type="text/css" />'; // DEFAULT STYLESHEET $defaultStyleSheet=0; // SET STYLESHEET if(!isset($_COOKIE["STYLE"])) { if(isset($_SESSION["STYLE"])) { echo $styleSheets[$_SESSION["STYLE"]]["sheet"]; } else { echo $styleSheets[$defaultStyleSheet]["sheet"]; } } else { echo $styleSheets[$_COOKIE["STYLE"]]["sheet"]; } } else { echo '<link href="<txp:css />" rel="stylesheet" type="text/css" />'; } ?> <script src="/lite/javascripts/prototype.js" type="text/javascript"></script> <script src="/lite/javascripts/scriptaculous.js" type="text/javascript"></script> <script src="/lite/javascripts/fixed.js" type="text/javascript"></script> <title><txp:page_title /></title> </head> <body>  <div id="warning"> <h1>Warning!</h1> <p> Please upload the <code>/lite/</code> folder into the root folder of your website. If you need help with uploading the <code>/lite/</code> folder, please refer to the installation guide included in the download. </p> </div>  <div id="total">  <div id="head"> <div id="bar">  <div id="settings"> <div id="copyright_show"> <a href="#" onclick="new Effect.Appear('copyright'); return false;"> <img src="/lite/images/copyright.gif" width="30" height="30" alt="Copyright" /> </a> </div> <p> <? // WRITE OUT SWITCHER LINKS while(list($key, $val) = each($styleSheets)) { echo "<a href=\"styleswitcher.php?SETSTYLE=".$key."\" title=\"".$val["title"]."\"><img src=\"/lite/images/".$val["type"].".gif\" width=\"25\" height=\"30\" alt=\"".$val["type"]."\" /></a>"; } ?> </p> </div> </div> <div id="focus"> <div id="contain"> <div id="intro"> <p> <a href="/"> "<txp:site_slogan />" </a> </p> </div> <div id="title"> <h1> <a href="/"> <txp:sitename /> </a> </h1> </div> </div> </div> </div>  <div id="container"> <div id="sidebars">  <div id="right"> <h2>Search</h2> <txp:search_input label="" wraptag="p" size="" /> <h2>Categories</h2> <txp:category_list wraptag="p" /> <h2>Links</h2> <txp:linklist form="Links" wraptag="div" /> <h2>Feeds</h2> <p> <txp:feed_link label="RSS" /><br /> <txp:feed_link label="Atom" flavor="atom" /> </p> </div>  <div id="left"> <h2>10 Latest Topics</h2> <?php mysql_connect("localhost","studiopd_main","aucitrix"); mysql_select_db("studiopd_main"); $query = mysql_query("SELECT * FROM textpattern ORDER BY ID DESC LIMIT 10"); while($fetch = mysql_fetch_array($query)) { $Section = $fetch['Section']; $ID = $fetch['ID']; $UrlTitle = $fetch['url_title']; $Url = "/$Section/$ID/$UrlTitle/"; $Title = $fetch['Title']; $Body = substr($fetch["Body"],0,75); echo(" <h5> <a href=\"$Url\">$Title</a> </h5> <p> $Body... </p> "); } ?> </div> </div>  <div id="content"> <txp:article limit="5" /> <txp:if_individual_article> <p> <txp:link_to_prev> <txp:prev_title /> </txp:link_to_prev> | <txp:link_to_next> <txp:next_title /> </txp:link_to_next> </p> </txp:if_individual_article> <txp:if_article_list> <p> <txp:older> Previous </txp:older> | <txp:newer> Next </txp:newer> </p> </txp:if_article_list> </div> <br style="clear: both;" /> </div>  <div id="copyright" style="display: none;"> <p> <span> <a href="#" onclick="new Effect.Fade('copyright'); return false;"> <img src="/lite/images/copyright_exit.gif" width="30" height="12" alt="Copyright" /> </a> </span> Copyright © <?php $date=date(Y); echo("$date"); ?> <txp:sitename />. All rights reserved. Powered by <a href="http://www.textpattern.com">Textpattern</a>. Charcoal Lite template by Angelo Ashmore. <a href="http://validator.w3.org/check?uri=referer" title="This page is NOT valid XHTML 1.1 when viewing/posting comments">XHTML 1.1</a>, <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>. </p> </div>  <p id="teleport_top"> <a href="#" onclick="new Effect.ScrollTo('head'); return false;"> </a> </p> </div> </body> </html>

Click on error_default. Copy and paste the following into the textarea:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <link href="/lite/css/warning.css" rel="stylesheet" type="text/css" /> <title>Warning!</title> </head> <body>  <div id="warning"> <h1>Warning!</h1> <p> <txp:error_message /> </p> </div> </body> </html>

Click on forms. Copy and paste the following into the textarea:
<div> <h1> <txp:permlink> <txp:title /> </txp:permlink> </h1> <h4> Posted <txp:posted /> </h4> <txp:body /> <h4> <txp:comments_invite /> </h4> </div>

Click on comments. Copy and paste the following into the textarea:
<txp:message /> <h4><txp:comment_name /> <txp:comment_time /> <txp:comment_permlink>Permanent Link</txp:comment_permlink></h4>

Click on comments_display. Copy and paste the following into the textarea:
<txp:comments /> <txp:if_comments_allowed> <txp:comments_form /> <txp:else /> <p><txp:text item="comments_closed" /></p> </txp:if_comments_allowed>

Click on comment_form. Copy and paste the following into the textarea:
<h1><txp:comments_error /></h1> <h4>Name</h4> <div><txp:comment_name_input /></div> <h4>Email</h4> <div><txp:comment_email_input /></div> <h4>Website</h4> <div><txp:comment_web_input /></div> <h4>Comment</h4> <div><txp:comment_message_input /></div> <div><txp:comment_submit /></div> <div><txp:comment_preview /></div>

Click on Links. Copy and paste the following into the textarea:
<h5> <txp:link /> </h5> <p> <txp:link_description /> </p>

Click on search_results. Copy and paste the following into the textarea:
<div> <h1> <txp:permlink> <txp:title /> </txp:permlink> </h1> <h4> Posted <txp:posted /> </h4> <p> <txp:search_result_excerpt /> </p> <h4> <txp:comments_invite /> </h4> </div>

Click on style. Copy and paste the following into the textarea:
/* CSS Document for Lite Template */ /* Created by Angelo Ashmore, StudioPD */ body { margin: 50px 0px 50px 0px; font-family: 'Lucida Grande', Geneva, Verdana, Arial, sans-serif; font-size: 62.8%; color: #3a3a3a; background-color: #fff; } #warning { width: 40em; padding: 15px; margin: 0px auto 0px auto; background-color: #ffe896; border: 1px solid #feda5f; } #warning h1 { padding: 0px; margin: 0px; font-family: 'Lucida Grande', Geneva, Verdana, Arial, sans-serif; font-size: 3.0em; color: #2666e8; } #warning p { padding: 0px; margin: 15px 0px 0px 0px; font-family: 'Lucida Grande', Geneva, Verdana, Arial, sans-serif; font-size: 1.2em; color: #3a3a3a; } #total { display: none; }