How to Setup and Install a web theme for the MµCMS system:

Requirements:

A functional html web theme. with the following directory structure:

I

Then you need to open up your theme... I will pick an open source theme for this demonstration and actually integrate it into the CMS. the theme I chose was very simple and straight forward and did require some minor modification to get it to work in the needed directory structure, but included in this directory is a file called: Original_Localize.tar.gz

That is the original HTML template I have drawn from.

How to Modify Theme for CMS usage:

Open the HTML file with your favorite text editor for this I am using “gedit”

Inserting title:

copy and paste the following text into the Title section of the HTML page: (Make sure to overwrite or remove the existing title tag)

<title><?php echo $this->title; ?></title>

Note: if you would like the title information displayed in the page you can copy paste this code as often as necessary to display the title information. (I find it useful for navigation to put the title somewhere in the page, especially in large complicated sites.)

Inserting Meta Tags Description and Keywords:

Copy and paste the following into the header of your HTML page: (Make sure to overwrite of remove existing meta tags)

<META name="Description" content="<?php echo $this->description; ?>" />

<META name="Keywords" content="<?php echo $this->keywords; ?>" />

Adding in Site wide menu system:

Find the code required to generate your menu structure in this example I will use the following from our HTML file:

<div><ul class="navbar">

<li><a href="#" class="nav">Home</a></li>

<li><a href="#" class="nav">About Us</a></li>

<li><a href="#" class="nav">Products</a></li>

<li><a href="#" class="nav">Contact</a></li>

</ul></div>

I will cut the code above from the HTML page completely and save it as a completely new file “/theme/menu_1.inc” This is the include file that will generate the site wide menu. Then I will paste the following code into my HTML document (exactly) where my menu originally was. (please refer to the example files for questions)

<?php require_once('menu_1.inc'); ?>

Adding Page Content:

Paste the following code where you would like content information to be displayed.

<?php echo $this->content; ?>

Adding Page Counter:

Paste the following code in the HTML document where you would like a text vistor counter to be displayed.

<?php echo $this->counter; ?>

Note: If you have page caching enabled, the counter will only increment when a new page cache is created (default every 2 minutes, however you may configure it otherwise if you chose)

Adding / Using Custom fields and Sub Menus (Advanced Users only):

If you want to use custom fields MµCMS offers 4. (it is not required that you use them, but they do exist if you want to). Setting these up requires basic understanding of PHP and HTML, and should not be attempted by someone who does not have at least a basic handle on those technologies.

I find the following code useful for displaying custom fields (works great for little sub section on a page like new, or hot info etc.) As an example in the current theme I would use the following code as my base: (I chose this because it is a convenient place to have information on the page)

<div class="rightbox">

<h2>News</h2>

<p>This morning a man in New Zealand got out of bed and had breakfast. Find out more <a href="#">here</a>.</p>

</div>

I replaced the above code with the code below:

<?php if ($this->custom1 != '') {

echo '<div class="rightbox"><h2>News</h2>

<p>' . $this->custom1 . '</p></div>'; } ?>

What this does is IF the user has decided to use the custom1 field (located in the meta information page for editing), it will display the “News” box. If the user had not typed anything in, it will not display that section at all.

Sub Menu System (or Page sensitive menus)

I removed the following code:

<a href="http://www.google.com/" title="Google">Google</a>

<a href="http://www.oswd.org/" title="Open Source Web Design">OSWD</a>

<a href="http://www.wpdfd.com/" title="Web Page Design for Designers">WPDFD</a>

<a href="http://www.sxc.hu/" title="stock.xchng">stock.xchng</a>

<a href="http://www.tomshardware.com/index.html" title="Tom's Hardware Guide">THG</a>

<a href="http://www.howstuffworks.com/" title="How Stuff Works">How Stuff Works</a>

and replaced it with:

<?php if ($this->custom2 != '') { echo $this->custom2; } ?>

This allows the user to create page sensitive menus from the meta information page, this way the user only has to type in the list of links into the Custom 2 field, and they will be displayed here.

Search Functionality (into theme)

<form method="post" action="search.php">

<input type="text" name="SearchString" />

<input type="submit" value="Search" name="search"/>

</form>

To add search functionality into the theme it self you need to copy and paste the above code into the them you are using. You can stylize it anyway you like, but you must have at least this much information.

Save the file:

We now want to save our html file as 'theme/theme_1.inc'. This is so the CMS knows where to find the first theme.

Copy into the CMS Root:

Once we have our files saved, we just need to copy the folder structure into the cms root. (over write existing files, and clean out folders as nessicary).

Now your done.

Now you can login to your site, change your settings for the page in question (make sure to select the correct theme), and you should be up and running.

My final results should be in the directory:

/admin/docs/CMS_Localize.tar.gz

If you would like to view the final results.