Joomla-creating-template
Joomla-テンプレートの作成
この章では、Joomlaで*テンプレートを作成する*方法を学びます。
テンプレートを作成する
以下は、Joomlaでテンプレートを作成する簡単な手順です-
ステップ1 *- *Joomla → Templates フォルダー内に MyFirstTemplate というフォルダーを作成します。 MyFirstTemplate フォルダー内に、_images_およびCSSという名前のフォルダーをさらに2つ作成して、すべての画像とCSSファイルを保存します。
ステップ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>[email protected]</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>
コードの詳細
- <files> - MyFirstTemplate フォルダー内の使用可能なファイルとフォルダーが含まれています。
- <folder> - MyFirstTemplate フォルダー内の使用可能なフォルダー全体を取得します。
ステップ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>
?>
コードの詳細
<?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ページのタイプをブラウザに伝えるために使用され、Webサイトで使用されている言語を記述することで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>
ここのbodyセクションでは、 jdoc を使用して、Joomlaシステムの一部からの出力をJoomlaに含めます。 name = "top" は、上部のメニューを設定するために使用されます。
ステップ4 *-これら2つのファイルを作成した後、Joomlaにログインし、 *Extension → Extension Manager をクリックすると、次のページが表示されます。
ステップ5 *-上記のページで、 *Discover リンクをクリックすると、次のページが表示されます。
- ステップ6 *-次に、*検出*ボタンをクリックして、以下に示すように、新しく作成されたテンプレートを検出します。
- ステップ7 *-チェックボックスをクリックしてテンプレートを選択し、*インストール*ボタンをクリックしてテンプレートをJoomlaにインストールします。
ステップ8 *-テンプレートをインストールした後、 *Extension → Template Manager をクリックして、新しく作成したテンプレートを表示できます。 以下に示すように、新しく作成されたテンプレートが一覧表示されます。
ツールバー
以下は、テンプレートマネージャのツールバーオプションです-
- デフォルト-デフォルトのテンプレートを選択します。
- 編集-編集するテンプレートを選択します。
- Duplicate -選択したテンプレートのコピーを複製します。
- 削除-Joomlaのテンプレートを削除します。