How to further customize your site

I don't know about you but for me a CMS needs to be very flexible. I want it to do exactly what I want. So of course I kept this in mind when I built the Clesto CMS.

The template.php file is the only file you need to adjust and customize. You don't need to dig into and try to change the Clesto code in other files.

Just insert your PHP code or HTML anywere in the template.php as you see fit.

Specific if statements

PHP code only on a specific page

<?php
if ($url == "index") {
	echo "Here comes code only on the index page!";
	$calculation = 130 * 45476;
	echo "130 times 45476 = ".$calculation." I can count math! ;)";
} ?>

HTML and content only on a specific page

<?php
if ($url == "products") { ?>
<p>Here I am bypassing the backend and hard code custom HTML and content only visible on the "products" page.</p>
<h2>Here comes a heading</h2>
<p>Some other stuff here, such as <em>italics</em>.</p>
<?php } ?>

Some content or code only on the extra pages

<?php
if (str_replace(".txt", "", $file) > 10) {
	echo "This is an extra page not part of the main navigation!";
}
?>

Including other files

Including other files could not have been simpler. Just move the file to be included in the directory which you have the template.php and in that file just use the normal PHP include:

<?php include("somefile.php"); ?>

Additional navigation list

If you have extra pages you might want to have an additional list with links to those. Well, this is no problem, just see below.

<ul id="nav3">
<?php
echo_navigation_button("Find us on map", "find-us-on-map");
echo_navigation_button("How to live a good life", "how-to-live-a-good-life");
?>
</ul>
The above list will be generated as this:
<ul id="nav3">
	<li><a href="http://www.clesto.com/find-us-on-map">Find us on map</a></li>
	<li><a href="http://www.clesto.com/how-to-live-a-good-life">How to live a good life</a></li>
</ul>

Of course the extra pages needs to exist first (create in the settings) and the URLs have to be correct.

And as for styling it is the same as for the regular main navigation. But this one we can call nav3 (nav2 is already used).

So the CSS could be something like:

ul#nav3 {}
ul#nav3 li {}
ul#nav3 li a {}
ul#nav3 li#active {}
ul#nav3 li#active a, ul#nav3 a:hover {}

Just fill in the values in the {} on how you want this extra list to look like. See more on the page Make Your Own Clesto Template.

Navigation list with drop down

Using a third argument in the echo_navigation_button called "parent" will exclude the </li>. This makes us able to use an ul inside the list items of the navigational ul.

See this example:

<ul id="nav">
<?php echo_navigation_button($button1, ""); ?>
<?php echo_navigation_button($button2, $url2, "parent"); ?>
<ul>
	<?php echo_navigation_button("Olive Oil", "olive-oil"); ?>
	<?php echo_navigation_button("Olives", "olives"); ?>
	<?php echo_navigation_button("Greek Meze", "greek-meze"); ?>
	<?php echo_navigation_button("Feta", "feta"); ?>
	<?php echo_navigation_button("Kalamata Products", "kalamata-products"); ?>
</ul></li>
<?php echo_navigation_button($button3, $url3, "parent"); ?>
<ul>
	<?php echo_navigation_button("Olive Oil", "our-olive-oil"); ?>
	<?php echo_navigation_button("Olives", "our-olives"); ?>
	<?php echo_navigation_button("Feta", "our-feta"); ?>
</ul></li>
<?php echo_navigation_button($button4, $url4, "parent"); ?>
<ul>
	<?php echo_navigation_button("Our Aim", "our-aim"); ?>
	<?php echo_navigation_button("News", "news"); ?>
	<?php echo_navigation_button("FAQ", "faq"); ?>
	<?php echo_navigation_button("Health & Nutrition", "health-nutrition"); ?>
	<?php echo_navigation_button("Gallery", "gallery"); ?>
</ul></li>
<?php echo_navigation_button($button5, $url5); ?>
</ul>

And then some CSS such as:

ul#nav ul {display:none;}
ul#nav li:hover ul {display:block;}