User

Difference between revisions of "Rvsjoen/tutorial/Developing a Template/Part 03"

From Joomla! Documentation

< User:Rvsjoen‎ | tutorial/Developing a Template
Line 43: Line 43:
 
</body>
 
</body>
 
</html>
 
</html>
 +
</source>
 +
</span>
 +
 +
With your favorite editor, edit the following file
 +
<span id="css/styles.css">
 +
'''<tt>css/styles.css</tt>'''
 +
<source lang="css">
 +
html, body {
 +
    background: #ccc;
 +
}
 
</source>
 
</source>
 
</span>
 
</span>
Line 80: Line 90:
 
* <tt>[[#templateDetails.xml|templateDetails.xml]]</tt>
 
* <tt>[[#templateDetails.xml|templateDetails.xml]]</tt>
 
* <tt>[[#index.php|index.php]]</tt>
 
* <tt>[[#index.php|index.php]]</tt>
* <tt>[[User:Rvsjoen/tutorial/Developing_a_Template/Part_02#css/styles.css|css/styles.css]]</tt>
+
* <tt>[[#css/styles.css|css/styles.css]]</tt>
  
 
== Testing your template ==
 
== Testing your template ==

Revision as of 06:05, 16 April 2012

Part 03 - Adding module positions[edit]

With your favorite editor, edit the following file

index.php

<?php
 
/**
 * @package     Joomla.Tutorials
 * @subpackage  Template
 * @copyright   Copyright (C) 2005 - 2010 Open Source Matters, Inc. All rights reserved.
 * @license     License GNU General Public License version 2 or later; see LICENSE.txt
 */
 
// No direct access to this file
defined('_JEXEC') or die;
 
?>
<!DOCTYPE html>
<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="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/css/styles.css" type="text/css" />
	</head>
	<body>
		<div id="container">
			<div id="header">
				<jdoc:include type="modules" name="header" />
			</div>
			<div id="left">
				<jdoc:include type="modules" name="left" />
			</div>
			<div id="main">
				<jdoc:include type="message" />
				<jdoc:include type="component" />			
			</div>
			<div id="footer">
				<jdoc:include type="modules" name="footer" />
			</div>
		</div>
	</body>
</html>

With your favorite editor, edit the following file css/styles.css

html, body {
    background: #ccc;
}

With your favorite editor, edit the following file

templateDetails.xml

<?xml version="1.0" encoding="utf-8"?>
<extension version="2.5" type="template" client="site">
	<name>helloworld</name>
        <creationDate>Once upon a time</creationDate>
        <author>John Doe</author>
        <authorEmail>john.doe@example.org</authorEmail>
        <authorUrl>http://www.example.org</authorUrl>
        <copyright>Copyright Info</copyright>
        <license>License Info</license>
	<version>0.0.1</version>
	<description>Description of the Hello World! template...</description>
	<files>
		<filename>index.php</filename>
		<filename>templateDetails.xml</filename>
		<folder>css</folder>
	</files>
	<positions>
		<position>header</position>
		<position>footer</position>
		<position>left</position>
	</positions>
</extension>

File listing[edit]

Testing your template[edit]

For details on how to install the template into your Joomla! site, refer to the information provided in Part 01.

Download this part[edit]

Articles in this series[edit]

This tutorial is supported by the following versions of Joomla!

Joomla 2.5