When I first did one couple of years back it took me a while to get my head around, but once you do it is all pretty simple. Would defiantly be better to make one from scratch, you'll understand how it works apart from anything.
I haven't read that tutorial but basically:
- Create a new folder called My Template or equivalent in /templates.
- Create 3 files. index.php, templateDetails.xml, style.css
- In you templateDetails.xml paste somthing like the following:
Code:
<?xml version="1.0" encoding="utf-8"?>
<install version="1.5" type="template">
<name>My template</name>
<version>0.5</version>
<creationDate>July 2009</creationDate>
<author>J Smith</author>
<copyright>GPL</copyright>
<authorEmail>[email protected]/authorEmail>
<authorUrl></authorUrl>
<description>Custom template for J Smith</description>
<files>
<filename>index.php</filename>
<filename>templateDetails.xml</filename>
<filename>js/somejsfile.js</filename>
<filename>images/threecol-l.gif</filename>
<filename>images/threecol-r.gif</filename>
<filename>css/style.css</filename>
</files>
<positions>
<position>user1</position>
<position>top</position>
<position>left</position>
<position>banner</position>
<position>right</position>
<position>footer</position>
</positions>
<params>
<param name="colorVariation" type="list" default="white" label="Color Variation" description="Color variation to use">
<option value="blue">Blue</option>
<option value="red">Red</option>
</param>
</params>
</install>
- In you index.php you treat sort of like a standard Html file but with out any content. So, so for example, you'd create your basic header and column layout but don't put any content in. Instead you use <jdoc:include type="modules" name="user1" /> . The names are custom, you can put anything you like as long as you tell the module you want to put in there what it is called. These are used to position modules, e.g. login box, random pictue, twitter etc etc
- For your main content you use <jdoc:include type="component" /> this is were all your articles will be displayed.
Example file:
Code:
<?php // no direct access defined( '_JEXEC' ) or die( 'Restricted access' ); ?>
<!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"
xml:lang="<?php echo $this->language; ?>"
lang="<?php echo $this->language; ?>" >
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="templates/<?php echo $this->template ?>/css/style.css" type="text/css" />
</head>
<body>
<div id="outercontainer">
<div id="container">
<div id="header">
<div id="logo">
<h1>iProjects</h1>
</div> <!-- logo -->
<div id="login">
<jdoc:include type="modules" name="login" />
</div> <!-- login -->
</div> <!-- header -->
<div id="menu">
<jdoc:include type="modules" name="menu" />
</div> <!-- Menu -->
<div id="breadcrumb">
<jdoc:include type="modules" name="breadcrumb" />
</div> <!-- breadcrumb -->
<div id="body">
<div id="column1">
<jdoc:include type="component" />
</div> <!-- column1 -->
<div id="column2">
<jdoc:include type="modules" name="column2" />
</div> <!-- column2 -->
</div> <!-- body -->
</div> <!-- container -->
<div id="footer">
<jdoc:include type="modules" name="footer" />
</div> <!-- footer -->
</div>
</body>
</html>
That is a two column layout with a header, menu, breadcrumbs and footer.
- You then just use you CSS as normal to style everything.
Hope that was helpful.
Feel free to ask any questions.
Thankyou. When I learn't there didn't seem to be any decent guides and took me literately days to get my head around. Once I did I couldn't believe how simple it was.
Wish me luck! 