Let´s play araound and create a nice Theme for Constructr CMS. We will build a simple basic PHP-based Theme. We will have Page Titles, a Typo Head – linked to the Root-Level, an static Intro Section, a Text based Navigation and a Content Section. Thats all we need for our first Theme. How to create the Page-Titles? Take a Look at the following simple Code:
<?php
//Including some neccessary Files
require_once(‘data/config/config.inc.php’);
require_once(‘data/config/constructr_define.inc.php’);
require_once(‘content_decoder.inc.php’);
require_once(‘data/php/constructr.class.php’);
// Grabbing the actual Host and URL
$host = $_SERVER['HTTP_HOST'];
$uri = rtrim(dirname($_SERVER['PHP_SELF']), ‘/\\’);
// Creating some Paths for including Grafix, linking to CSS and Javascript
$ROOT_PATH = ‘http://’ . $host . $uri;
$IMG_PATH = ‘http://’ . $host . $uri . ‘/data/workspace/pix/’;
$CSS_PATH = ‘http://’ . $host . $uri . ‘/data/workspace/css/’;
$UPL_PATH = ‘http://’ . $host . $uri . ‘/data/workspace/uploads/’;
$JS_PATH = ‘http://’ . $host . $uri . ‘/data/workspace/js/’;
// Open the main Database Connnection to grab Pages and Content
$db =& new constructr($HOST,$USER,$PASSWD,$DATABASE);
?>
First, we include all the needed Files to interact with Constructr CMS. The $host and $uri Section is needed for the Navigation and the inclusion for the following Paths. In the next Part we set some relative Links for Images, CSS-Files, the Uploads and Javascript. Finaly we create the DB-Connection. That´s the Head of our main index.php-File.
<!DOCTYPE html
PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” xml:lang=”de” lang=”de”>
<head>
<meta http-equiv=”content-type” content=”iso-8859-1″ />
<link rel=”stylesheet” type=”text/css” href=”<?php echo $CSS_PATH; ?>style.css” />
Above You will see the HTML-Head with the included CSS-File for the Style. The main Template FIle is a simple PHP-Document.
<?php
if(!isset($_GET['show_page']))
{
echo ‘<title>My Page Title</title>’;
}
else
{
echo ‘<title>My Page Title – ‘ . strtoupper($_GET['show_page']) . ‘</title>’;
}
?>
</head>
<body>
Above you will see the simple Creation of the Page Titles. The “$_GET['show_page']” is our Page Alias we will get from the CMS-Logic, to select the rght Content and more.
We just take the $_GET['show_page'] and transform it into uppercase Letters – thats all.
<div id=”head”>
<div id=”inner_head”>
<h1><a href=”<?php echo $ROOT_PATH; ?>”><span class=”orange”>My Typo Head – Could be a Graphic too</span></a></h1>
<p>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
</p>
</div><!–EOF DIV INNER_HEAD–>
</div><!–EOF DIV HEAD–>
This will be our Head-Section of the Template. We link the Typo-Logo to the Root-Path we created above. Then follows a static Part – it will be the same at every Page.
<div id=”navigation”>
<div id=”inner_navigation”>
<p>
<?php
$get_pages = $db -> query(”
SELECT *
FROM $DB_TABLE_CONSTRUCTR_PAGES
WHERE page_visibility = ‘1′
ORDER BY page_lft ASC
“);
while ($all_pages = $db -> fetch_array($get_pages))
{
$page_id = $all_pages['page_id'];
$page_name = $all_pages['page_name'];
$page_alias = $all_pages['page_alias'];
$page_lft = $all_pages['page_lft'];
$page_class = $all_pages['page_class'];
$ACT_SHOW_PAGE = $_REQUEST['show_page'];
if(isset($ACT_SHOW_PAGE) && $ACT_SHOW_PAGE == $page_alias)
{
if($page_lft == ‘1′)
{
echo ‘<a href=”http://’ . $host . $uri . ‘/” title=”http://’ . $host . $uri . ‘/” class=”orange”>’ . $page_name . ‘</a>’;
}
else
{
echo ‘ <a href=”http://’ . $host . $uri . ‘/’ . $page_alias . ‘/” title=”http://’ . $host . $uri . ‘/’ . $page_alias . ‘/” class=”orange”>’ . $page_name . ‘</a>’;
}
}
else
{
if($page_lft == ‘1′)
{
echo ‘<a href=”http://’ . $host . $uri . ‘/” title=”http://’ . $host . $uri . ‘/”>’ . $page_name . ‘</a>’;
}
else
{
echo ‘ <a href=”http://’ . $host . $uri . ‘/’ . $page_alias . ‘/” title=”http://’ . $host . $uri . ‘/’ . $page_alias . ‘/”>’ . $page_name . ‘</a>’;
}
}
}
?>
</p>
</div><!–END OF INNER_NAVIGATION–>
</div><!–END OF NAVIGATION–>
That´s all we need for displaying the Navigation. We just select all visible Pages orderd by page_lft (Nested Sets-Structure).
<div id=”content”>
<div id=”inner_content”>
<?php
if(!isset($_GET['show_page']))
{
$get_page_id = $db -> query(”
SELECT *
FROM $DB_TABLE_CONSTRUCTR_PAGES
WHERE page_lft = ‘1′
LIMIT 1
“);
$act_page_id = $db -> fetch_array($get_page_id);
$page_id = $act_page_id['page_id'];
$page_name = $act_page_id['page_name'];
$page_class = $act_page_id['page_class'];
$get_page_content = $db -> query(”
SELECT *
FROM $DB_TABLE_CONSTRUCTR_CONTENT
WHERE page_id = ‘$page_id’
AND visibility = ‘1′
ORDER BY sort ASC
“);
$content_counter = $db -> num_rows($get_page_content);
if($content_counter != 0)
{
while ($act_content = $db -> fetch_array($get_page_content))
{
$id = $act_content['id'];
$page_id = $act_content['page_id'];
$content = $act_content['content'];
$visibility = $act_content['visibility'];
$sort = $act_content['sort'];
echo unhtmlentities(base64_decode($content));
}
}
else
{
echo ‘No Content available on Page ‘ . $page_name;
}
}
else
{
$db =& new constructr($HOST,$USER,$PASSWD,$DATABASE);
$host = $_SERVER['HTTP_HOST'];
$uri = rtrim(dirname($_SERVER['PHP_SELF']), ‘/\\’);
$show_page = $_REQUEST['show_page'];
$get_page_id = $db -> query(”
SELECT *
FROM $DB_TABLE_CONSTRUCTR_PAGES
WHERE page_alias = ‘$show_page’
LIMIT 1
“);
$act_page_id = $db -> fetch_array($get_page_id);
$page_id = $act_page_id['page_id'];
$page_name = $act_page_id['page_name'];
$get_page_content = $db -> query(”
SELECT *
FROM $DB_TABLE_CONSTRUCTR_CONTENT
WHERE page_id = ‘$page_id’
AND visibility = ‘1′
ORDER BY sort ASC
“);
$content_counter = $db -> num_rows($get_page_content);
if($content_counter != 0)
{
while ($act_content = $db -> fetch_array($get_page_content))
{
$id = $act_content['id'];
$page_id = $act_content['page_id'];
$content = $act_content['content'];
$visibility = $act_content['visibility'];
$sort = $act_content['sort'];
echo unhtmlentities(base64_decode($content));
}
}
else
{
echo ‘No Content available on Page ‘ . $page_name;
}
}
?>
</div><!–EOF DIV INNER_CONTENT–>
</div><!–EOF DIV CONTENT–>
Thats all we will need to grab the Content from our Database.
We need a Footer:
<div id=”footer”>
<div id=”inner_footer”>
© <?php echo date(‘Y’); ?> Alle Rechte vorbehalten. Webdesign & Programmierung <a href=”http://phaziz.com/”>phaziz <span class=”pink”>interface</span> design</a>.
</div><!–EOF INNER_FOOTER–>
</div><!–EOF FOOTER–>
Static Content with a little PHP for displaying the actual Year. And now, close the HTML-File and the Database Connection:
</body>
</html>
<?php
$db -> close();
?>
We are done! Thats all we need to create a individual Theme for Constructr CMS – a little HTML, a nice CSS-Style and a little PHP for grabbing the Page-Title, the Navigation and the Content.