Hướng dẫn thiết kế template cho Joomla 1.5

Thiết kế 1 Joomla template với bố cục đơn giản và các tính năng căn bản của Joomla sẽ giúp bạn hiểu được cấu trúc của 1 Joomla template.

Thiết kế template Joomla 1.5
Trước đây người ta hay sử dụng kỹ thuật dàn trang bằng bảng (dùng thẻ <table>). Việc dàn trang bằng bảng có ưu điểm là dễ làm nhưng lại có nhược điểm là tốc độ nạp trang chậm và không tối ưu cho các máy tìm kiếm. Do vậy ngày nay chúng ta sử dụng kỹ thuật dàn trang bằng thẻ tabless (<div>).
Thiết kế Joomla template nâng cao

Quyển Joomla 1.5: A User’s Guide cũng bao gồm các tính năng template nâng cao của Joomla bao gồm tham số và overrides đồng thời kèm theo 1 số ví dụ cho phép tạo tabless template.

Các bạn có thể tải Joomla 1.5 Template Tutorial tại đây

Cấu trúc Joomla template

Tạo thư mục "mytemplate" trong thư mục "templates".
Tạo file "index.php" trong thư mục "mytemplate" và gõ vào nội dung sau:

<?php
/**
 * @copyright    Copyright (C) 2007 Compass Design.
 * GPL licensed
 */
// 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="language; ?>" lang="language; ?>" >

<head>

<jdoc:include type="head" />

<link rel="stylesheet" href="/cntt/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="/cntt/templates/system/css/general.css" type="text/css" />

</head>

<body> 
The name of this site is getCfg('sitename');?>

The administrator email is getCfg('mailfrom');?>

This template is in the template?> directory

The URL is 
<jdoc:include type="module" name="breadcrumbs" />
<jdoc:include type="modules" name="top" />
<jdoc:include type="modules" name="left" />
<jdoc:include type="component" />
<jdoc:include type="modules" name="right" />
</body>
</html>

Tạo file "templateDetails.xml" trong thư mục "mytemplate" và gõ vào nội dung sau:

{code}<?xml version="1.0" encoding="utf-8"?>
<install version="1.5" type="template">
 <name>mytemplate</name>
 <creationDate>May 2009</creationDate>
 <author>kenh3600.com</author>
 <copyright>GPL</copyright>
 <authorEmail>
 Địa chỉ email này đã được bảo vệ từ spam bots, bạn cần kích hoạt Javascript để xem nó.
 </authorEmail>
 <authorUrl>www.kenh360.com</authorUrl>
 <version>1.0</version>
 <description>First example template</description>
 <files>
 <filename>index.php</filename>
 <filename>templateDetails.xml</filename>
 </files>
 <positions>
 <position>user1</position>
 <position>top</position>
 <position>left</position>
 <position>banner</position>
 <position>right</position>
 <position>footer</position>
 </positions>
</install>{code}