Joomla

Joomla Template Development

2021年07月23日

Overview

Joomla の template 開発方法について記載する。

Reference

Environment

Joomla Version : 3.x

Joomla Architechture

Directory structure

template directory の構造は以下の通り。

* mynewtemplate/
** css/
*** template.css
** images/
** index.php
** templateDetails.xml

templateDetails.xml

<?xml version="1.0" encoding="utf-8"?>
<extension version="2.5" type="template">
	<name>RLabTemplate</name>
	<creationDate>2021-07-01</creationDate>
	<author>RLab</author>
	<authorEmail>rlab@travelersmedia.jp</authorEmail>
	<authorUrl>https://www.travelersmedia.jp</authorUrl>
	<copyright>RLab@2021</copyright>
	<license>GNU/GPL</license>
	<version>1.0.0</version>
	<description>RLab Template</description>
	<files>
		<filename>index.php</filename>
		<filename>templateDetails.xml</filename>
		<folder>images</folder>
		<folder>css</folder>
	</files>
	<positions>
		<position>breadcrumb</position>
		<position>left</position>
		<position>right</position>
		<position>top</position>
		<position>user1</position>
		<position>user2</position>
		<position>user3</position>
		<position>user4</position>
		<position>footer</position>
	</positions>
</extension>
<extension version="2.5" type="template">

version : 2.5 を指定。Joomla の Version を示す。

index.php

<?php defined('_JEXEC') or die('Restricted access');?>
<!DOCTYPE html>
<html 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/template.css" type="text/css" />
</head>
<body>
<jdoc:include type="modules" name="top" /> 
<jdoc:include type="component" />
<jdoc:include type="modules" name="footer" />
</body>
</html>

jdoc:include は joolma の module や component を Call するための宣言文