Saturday, January 30, 2010

How to build joomla templates

Step 1:

Create  a  folder into the templates folder.This folder name must be the template name.


Step 2:

Create a folder named "style" for stylesheet,

Create a folder named "javascript" for javascript,

Create a folder named "images" for images,

Create a folder named "html" for components,

Create a file index.php into you template folder. After that copy and paste the following lines.

<?php
/**
* @copyright    Copyright (C) 2005 - 2008 Open Source Matters. All rights reserved.
* @license        GNU/GPL, see LICENSE.php
* Joomla! is free software. This version may have been modified pursuant
* to the GNU General Public License, and as distributed it includes or
* is derivative of works licensed under the GNU General Public License or
* other free or open source software licenses.
* See COPYRIGHT.php for copyright notices and details.
*/


defined('_JEXEC') or die('Restricted access');
$url = clone(JURI::getInstance());
?>


Step 3: Copy and paste the follwing lines

<?php echo '<?xml version="1.0" encoding="utf-8"?'.'>'; ?>
<!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; ?>" dir="<?php echo $this->direction; ?>" >
<head>
<jdoc:include />
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/css/[your css].css" rel="stylesheet" />
if any javascript file is needed, write the following lines

<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/javascript/[your script].js"></script></head>
<body>


Step 4: For displaying primary links paste thi following codes into the appropriate <Div>

<jdoc:include type="modules" style="" />

Step 5:

For displaying your site content write the following code within appropriate <Div>

<jdoc:include type="component" />

Step 6:
Colse all the opened html tag.

No comments: