Joomla 简明教程

Joomla - Creating Template

本章,我们将研究如何在 Joomla 中 create a template

Creating Templates

以下是创建 Joomla 模板的简单步骤:

Step 1 - 在你的 JoomlaTemplates 文件夹中创建一个名为 MyFirstTemplate 的文件夹。在 MyFirstTemplate 文件夹中,再创建两个名为图像和 CSS 的文件夹,用于保存所有图像和 CSS 文件。

joomla createtemplates step1

Step 2 - 在 MyFirstTemplate 文件夹中,创建一个名为 templateDetails.xml 的文件,如果没有此文件,模板将无法在 Joomla 中显示。

templateDetails.xml

<?xml version = "1.0" encoding = "utf-8"?>

<extension version = "3.0" type = "template">
   <name>Tutorials Point</name>
   <creationDate>2015-06-13</creationDate>
   <author>Tutorials Point</author>
   <authorEmail>tutorials@example.com</authorEmail>
   <authorUrl>http://www.example.com </authorUrl>
   <copyright>Jack 2015</copyright>
   <license>GNU/GPL</license>
   <version>1.0.2</version>
   <description>My First 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>

Details of the code

  1. &lt;files&gt; - 其中包含 MyFirstTemplate 文件夹中可用的文件和文件夹。

  2. &lt;folder&gt; - 将 MyFirstTemplate 文件夹中所有可用的文件夹占为己有。

Step 3 - 创建名为 index.php 的文件。它有助于执行所有 Joomla 页面。

index.php

<?php defined( '_JEXEC' ) or die( 'Restricted access' );?>
<!DOCTYPE html>

<html xmlns = "http://www.w3.org/1999/xhtml" xml:lang = "<?php echo $this->language; ?>" lang = "<?php echo $this->language; ?>" >

   <head>                                         //head section
      <jdoc:include type = "head" />
      <link rel = "stylesheet" href = "<?php echo $this->baseurl ?>/templates/system/css/system.css" type = "text/css" />
      <link rel = "stylesheet" href = "<?php echo $this->baseurl ?>/templates/system/css/general.css" type = "text/css" />
      <link rel = "stylesheet" href = "<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/template.css" type="text/css" />
   </head>

   <body>                                          //body section
      <jdoc:include type = "modules" name = "top" />
      <jdoc:include type = "component" />
      <jdoc:include type = "modules" name = "bottom" />
   </body>

</html>

?>

Details of the code

<?php defined( '_JEXEC' ) or die( 'Restricted access' );?>
<!DOCTYPE html>
<html xmlns = "http://www.w3.org/1999/xhtml" xml:lang = "<?php echo $this->language; ?>" lang = "<?php echo $this->language; ?>" >

这段代码用于告诉浏览器正在使用哪种类型的 html 页面,并通过描述网站中使用的语言来开始 HTML 文档。

<head>                                         //head section
   <jdoc:include type = "head" />
   <link rel = "stylesheet" href = "<?php echo $this->baseurl ?>/templates/system/css/system.css" type = "text/css" />
   <link rel = "stylesheet" href = "<?php echo $this->baseurl ?>/templates/system/css/general.css" type = "text/css" />
   <link rel = "stylesheet" href = "<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/template.css" type = "text/css" />
</head>

这些行用于链接 Joomla 模板的各种样式表。

<body>                                          //body section
   <jdoc:include type = "modules" name = "top" />
   <jdoc:include type = "component" />
   <jdoc:include type = "modules" name = "bottom" />
</body>

在这里的正文部分, jdoc 用于从 Joomla 系统的某些部分中包含 Joomla 输出。 name = "top" 用于设置顶部的菜单。

Step 4 - 在创建这两个文件后,登录到 Joomla 并单击 ExtensionExtension Manager ,将显示以下页面。

joomla createtemplates step4

Step 5 - 在以上页面中,单击 Discover 链接,将显示以下页面。

joomla createtemplates step5

Step 6 - 接下来,单击 Discover 按钮以发现新创建的模板,如下所示。

joomla createtemplates step6

Step 7 - 单击复选框以选择模板,然后单击 Install 按钮以在 Joomla 中安装模板。

joomla createtemplates step7

Step 8 - 在安装模板后,您可以通过单击 ExtensionTemplate Manager 查看新创建的模板。您将看到新创建的模板如下所示。

joomla createtemplates step8

Toolbar

以下是模板管理器中的工具栏选项 -

  1. Default - 选择默认模板。

  2. Edit - 选择要编辑的模板。

  3. Duplicate - 复制所选模板的副本。

  4. Delete - 删除 Joomla 的模板。