Lobos of
http://www.themes.co.nz is happy to announce the release of WTElite - The Smarty Powered HTML Template Engine for Joomla!
For those always looking to bring me down:
WTElite is licensed under the LGPLWhat is it?WTElite is an implementation of the Smarty Templating Class which allows for the separation of presentation and business logic (ie php and html) and also allows those not well versed in programming scripting languages to easily create design templates (themes) for Joomla without becoming confused.
A few months ago I released a multiCMS theme engine called WTE, while this works well for Joomla! and actually includes more features than WTElite, it was found that many were confused by the installation process and the fact that it was required to install WTE as a seperate module for WTE templates to work. After much thought on this problem it was decided that a lightweight version of WTE would be created that would reside in the template folder it's self, thus negating the need for template users to download and install a 3rd party module for the template to work.
A decision was also made to focus on Joomla! only and not make this Template engine MultiCMS - this would allow me to create a templating environment that resembles the default system very closely (without PHP / HTML soup), and to also utilise the core framework of Joomla! to the fullest extent.
Result: WTElite Templates install on their own without the requirement of the WTE module to be installed. Template function naming conventions are virtually identical to the existing system.
WTElite uses the Smarty Templating Classhttp://smarty.php.net/ Smarty is the only PHP Templating system endorsed by The PHP Group and is a highly mature, well documented project that boasts a huge developer base and is recognised by many php developer and designer communities as the number 1 template engine available today. Devlopment of Smarty is continual and stable.
What makes WTElite different for the Existing Joomla! Templating system?The best way to demostrate this is to compare the template files of a "classic" Joomla! Template - we have used Solarflare (the template shipped default with Joomla! First lets take a look at the main template of the original solaflare template:
Code:
<?php
defined( '_VALID_MOS' ) or die( 'Restricted access' );
// needed to seperate the ISO number from the language file constant _ISO
$iso = explode( '=', _ISO );
// xml prolog
echo '<?xml version="1.0" encoding="'. $iso[1] .'"?' .'>';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<?php mosShowHead(); ?>
<?php
if ( $my->id ) {
initEditor();
}
$collspan_offset = ( mosCountModules( 'right' ) + mosCountModules( 'user2' ) ) ? 2 : 1;
//script to determine which div setup for layout to use based on module configuration
$user1 = 0;
$user2 = 0;
$colspan = 0;
$right = 0;
// banner combos
//user1 combos
if ( mosCountModules( 'user1' ) + mosCountModules( 'user2' ) == 2) {
$user1 = 2;
$user2 = 2;
$colspan = 3;
} elseif ( mosCountModules( 'user1' ) == 1 ) {
$user1 = 1;
$colspan = 1;
} elseif ( mosCountModules( 'user2' ) == 1 ) {
$user2 = 1;
$colspan = 1;
}
//right based combos
if ( mosCountModules( 'right' ) and ( empty( $_REQUEST['task'] ) || $_REQUEST['task'] != 'edit' ) ) {
$right = 1;
}
?>
<meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />
<link href="<?php echo $mosConfig_live_site;?>/templates/rhuk_solarflare_ii/css/template_css.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div align="center">
<table border="0" cellpadding="0" cellspacing="0" width="808">
<tr>
<td class="outline">
<div id="buttons_outer">
<div id="buttons_inner">
<div id="buttons">
<?php mosLoadModules ( 'user3', -1); ?>
</div>
</div>
</div>
<div id="search_outer">
<div id="search_inner">
<?php mosLoadModules ( 'user4', -1 ); ?>
</div>
</div>
<div class="clr"></div>
<div id="header_outer">
<div id="header">
</div>
<div id="top_outer">
<div id="top_inner">
<?php
if ( mosCountModules( 'top' ) ) {
mosLoadModules ( 'top', -2 );
} else {
?>
<span class="error">Top Module Empty</span>
<?php
}
?>
</div>
</div>
</div>
<div id="left_outer">
<div id="left_inner">
<?php mosLoadModules ( 'left', -2 ); ?>
</div>
</div>
<div id="content_outer">
<div id="content_inner">
<?php
if ( mosCountModules ('banner') ) {
?>
<table border="0" cellpadding="0" cellspacing="0" width="100%" class="content_table">
<tr>
<td>
<div id="banner_inner">
<img src="<?php echo $mosConfig_live_site;?>/templates/rhuk_solarflare_ii/images/advertisement.png" alt="advertisement.png, 0 kB" title="advertisement" border="0" height="8" width="468" /><br />
<?php mosLoadModules( 'banner', -1 ); ?><br />
</div>
<div id="poweredby_inner">
<img src="<?php echo $mosConfig_live_site;?>/templates/rhuk_solarflare_ii/images/powered_by.png" alt="powered_by.png, 1 kB" title="powered_by" border="0" height="68" width="165" /><br />
</div>
</td>
</tr>
</table>
<?php
}
?>
<table border="0" cellpadding="0" cellspacing="0" width="100%" class="content_table">
<tr valign="top">
<td width="99%">
<table border="0" cellpadding="0" cellspacing="0" width="100%" class="content_table">
<?php
if ($colspan > 0) {
?>
<tr valign="top">
<?php
if ( $user1 > 0 ) {
?>
<td width="50%">
<div class="user1_inner">
<?php mosLoadModules ( 'user1', -2 ); ?>
</div>
</td>
<?php
}
if ( $colspan == 3) {
?>
<td width="2">
<img src="<?php echo $mosConfig_live_site;?>/templates/rhuk_solarflare_ii/images/spacer.png" alt="" title="spacer" border="0" height="10" width="2" />
</td>
<?php
}
if ( $user2 > 0 ) {
?>
<td width="50%">
<div class="user2_inner">
<?php mosLoadModules ( 'user2', -2 ); ?>
</div>
</td>
<?php
}
?>
</tr>
<tr>
<td colspan="<?php echo $colspan; ?>">
<img src="<?php echo $mosConfig_live_site;?>/templates/rhuk_solarflare_ii/images/spacer.png" alt="" title="spacer" border="0" height="2" width="100" /><br />
</td>
</tr>
<?php
}
?>
<tr>
<td colspan="<?php echo $colspan; ?>">
<div id="pathway_text">
<?php mosPathWay(); ?>
</div>
</td>
</tr>
<tr>
<td colspan="<?php echo $colspan; ?>" class="body_outer">
<?php mosMainBody(); ?>
</td>
</tr>
</table>
</td>
<?php
if ( $right > 0 ) {
?>
<td>
<div id="right_outer">
<div id="right_inner">
<?php mosLoadModules ( 'right', -2 ); ?>
</div>
</div>
</td>
<?php
}
?>
</tr>
</table>
</div>
</div>
</td>
</tr>
</table>
</div>
<?php include_once( $GLOBALS['mosConfig_absolute_path'] . '/includes/footer.php' ); ?>
<?php mosLoadModules( 'debug', -1 );?>
</body>
</html>
While this is perfectly understandable to those well versed in PHP, it can be quite cryptic to a person that does not have nay knowledge of PHP. In fact this could be quite cryptic to one understanding PHP, but new to Joomla! Templating. I felt a need to simplify things.
Lets take a look at the main template of the WTElite version of the Solarflare Template (This functions virtually the same as the original solarflare template):
Code:
<?xml version="1.0" encoding="<!--[wteLang name="_ISO_NUMBER"]-->"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!--[mosShowHead]-->
<!--[if $my.id]-->
<!--[initEditor]-->
<!--[/if]-->
<meta http-equiv="Content-Type" content="text/html; <!--[wteLang name="_ISO"]-->" />
<link rel="stylesheet" type="text/css" href="<!--[$templatedir]-->/css/template_css.css" media="all">
</head><body>
<div align="center">
<table border="0" cellpadding="0" cellspacing="0" width="808">
<tbody>
<tr>
<td class="outline"><div id="buttons_outer">
<div id="buttons_inner">
<div id="buttons">
<ul id="mainlevel-nav">
<!--[include file="menu.htm"]-->
</ul>
</div>
</div>
</div>
<div id="search_outer">
<div id="search_inner">
<!--[mosLoadModules position="user4"]-->
</div>
</div>
<div class="clr"></div>
<div id="header_outer">
<div id="header"> </div>
<div id="top_outer">
<div id="top_inner">
<!--[mosLoadModules position="top"]-->
</div>
</div>
</div>
<div id="left_outer">
<div id="left_inner">
<!--[mosLoadModules position="left"]-->
</div>
</div>
<div id="content_outer">
<div id="content_inner">
<table class="content_table" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td><div id="banner_inner"> <img src="<!--[$templatedir]-->/images/advertisement.png" alt="advertisement.png, 0 kB" title="advertisement" border="0" height="8" width="468" /><br />
<!--[mosLoadModules position="banner"]-->
<br />
</div>
<div id="poweredby_inner"> <img src="<!--[$templatedir]-->/images/powered_by.png" alt="powered_by.png, 1 kB" title="powered_by" border="0" height="68" width="165" /><br />
</div></td>
</tr>
</tbody>
</table>
<table class="content_table" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr valign="top">
<td width="99%"><table class="content_table" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<!--[mosCountModules position="user1" assign="user1count"]-->
<!--[mosCountModules position="user2" assign="user2count"]-->
<!--[if $user1count != "0" || $user2count != "0"]-->
<tr valign="top">
<td width="50%"><div class="user1_inner">
<!--[mosLoadModules position="user1"]-->
</div></td>
<td width="2"><img src="<!--[$templatedir]-->/images/spacer.png" alt="" title="spacer" border="0" height="10" width="2"> </td>
<td width="50%"><div class="user2_inner">
<!--[mosLoadModules position="user2"]-->
</div></td>
</tr>
<!--[/if]-->
<tr>
<td colspan="3"><img src="<!--[$templatedir]-->/images/spacer.png" alt="" title="spacer" border="0" height="2" width="100"><br>
</td>
</tr>
<tr>
<td colspan="3"><div id="pathway_text">
<!--[mosPathWay]-->
</div></td>
</tr>
<tr>
<td colspan="3" class="body_outer">
<!--[mosMainBody]-->
</td>
</tr>
</tbody>
</table></td>
<td>
<!--[mosCountModules position="right" assign="rightcount"]-->
<!--[if $rightcount != "0"]-->
<div id="right_outer">
<div id="right_inner">
<!--[mosLoadModules position="right"]-->
</div>
</div>
<!--[/if]-->
</td>
</tr>
</tbody>
</table>
</div>
</div></td>
</tr>
</tbody>
</table>
</div>
<div align="center">
<!--[mosLoadModules position="footer"]-->
</div>
<div align="center">
<!--[mosCopyright]-->
</div>
<!--[mosLoadModules position="debug"]-->
</body>
</html>
Note that there are no longer PHP tags scattered throughout the design and the xhtml is now clear and can be easily edited by someone without any knowledge of PHP.
WTElite Features- Templates Compile - WTElite Templates are compiled into PHP files for faster, less server intensive execution.
- Caching - WTElite uses the smarty caching feature for even faster execution. Caching is controlled via the default Joomla! System
- Custom Templates - It is possible to custom tempalte any individual page of your Joomla Site.
- Custom Module Templates - It is possible to custom template any individual (or position) module of your Joomla Site.
- Plugin System - The Template Developer can create custom plugins for Templates.
- Multilanguage - Templates are fully multilangauge capabile vie the WTElang plugin.
The best thing to do now is download WTElite and try it out
http://themes.co.nz/Downloads-req-views ... -sid-4.htmRemember my Baby is Beta so don't be too hard on me if there are some little bugs (it's seems to be working flawlessy for me at the moment though!)
ConclusionWTElite is my gift to Joomla!, a CMS where I have only recently moved the bulk of my development, but that has already given me so much. I see Joomla! going places fast and I am happy to be a part of the revolution
