Joomlaのテンプレート弄ってます。
ftpでも管理機能を利用してもどっちでも編集可能なんですが、どうも日本語処理がうまく行かないようで、テンプレートファイル内に日本語を入れると文字化けします。
ブラウザで見た場合はOKなんですが、ファイルの文字コード認識フラグが壊れているのか、エディタでは自動認識しません。
そうすると、通常のCSSエディタとか使えない。
しょうがないので覚書的コメント入れてたのを全部英語に直しました。
とりあえず、テンプレートなんですが、これと同時に弄る必要があるのは様々なパーツというかモジュールですね。
セクション→カテゴリを作っておかないと、メニューも作れない。
テンプレートはなかなか良いのが見つからなくて、Mamboとかのもいろいろ探したんですが（Mambo4.5とJoomla1はテンプレートの互換性ありなのです。他のモジュールも互換性のあるものがあるらしい）、どうもフィットする物が無いというか、Mamboだと何故かTable使ってるものがほとんどなので、自分的にちょっと使いたくないなあと…。
MTとかもそうですが、CSSを使うならTableはレイアウトに使うのは邪道でしょう。XHTML的にブロック化して使うべきだと思う訳です。
Joomlaパッケージにデフォルトで入ってるのはそういう意味ではきちんと作られているのですが、いかんせんデザインが×。
なので、あちこち弄る必要が非常に多いのです。
弄ってる最中に忘れそうなので、その覚書です。
自分的にヘッダ、三カラムからなるメインコンテンツ、フッタとレイアウトしたいので、それにあわせて、モジュールの位置を決めて、スタイルを決めるのが面倒。っていうか、説明書無いので、どこがどうなってるか非常に分かりづらい。
とりあえず私は「madeyourweb」というテンプレートをお手本にして、これをコピって弄ってます。
これが以下のような構成になってます。
以前書いたように構成は「templateDetails.xml」に書かれています。ブラウザでの制御とかもこれを参照するので、ファイルだけ変更してアップしても、これに沿ってないと、きちんと表示されません。
※つまり、新しい画像ファイルとか、ファイル名を変更したCSSファイルとか画像ファイルも、全部その変更をこのファイルに書いてやらないと、反映されない、という事です。
※その際のファイル情報は、「templateDetails.xml」に対する相対パスで書きます。
<?xml version=”1.0″ encoding=”UTF-8″?> ←DOMの宣言
<mosinstall type=”template”> ←モジュールタイプ
<name>madeyourweb</name> ←テンプレート名（変更可）
<creationDate>15 09 2005</creationDate> ←テンプレート作成日（変更可）
<author>Marc Hinse</author> ←作者名（変更可）
<copyright>This template is released under the GNU/GPL License</copyright> ←著作権情報（変更可）
<authorEmail>marc_hinse@gmx.de</authorEmail> ←作者連絡先（変更可）
<authorUrl>http://www.madeyourweb.com</authorUrl> ←作者のサイト（変更可）
<version>1.3</version> ←バージョン（変更可）
<description>A clean template with a touch of MAC style.</description> ←説明（変更可）
※ここまでがテンプレートの概要情報。
ここを変更する事は可能ですが、他の人が作ったテンプレートの作者名を変更するとか、そういうのは論外です。
Joomlaもそうですが、フリ－のテンプレートはGNU/GPLに沿ったライセンスの考え方になってるので、そこから派生した物も当然そうなりますね。
そこら辺はわきまえましょう。
※もちろん、そのままでは使わない事が大半だと思いますので、いろいろ変更しなくちゃならないと思います。その場合は変更した事が分かるように上の情報を変えときましょう。
※ここからしたが、各種ファイルのリストです。
<files>
<filename>index.php</filename> ←本体ファイルの定義
<filename>template_thumbnail.png</filename> ←サムネイル画像の定義（これは適当でOK。どこかに公開したい場合は画像ハードコピーでもとってpng形式で保存した物に変更しましょう）
</files>
※ここから下は画像ファイルのリストです。
追加した画像ファイルがあったら、この一番下にでも追加しときましょう。
<images>
<filename>images/back_all.gif</filename>
<filename>images/back_all1024.gif</filename>
<filename>images/back_mainmenu.jpg</filename>
<filename>images/footer.jpg</filename>
<filename>images/footer1024.jpg</filename>
<filename>images/indent1.png</filename>
<filename>images/indent2.png</filename>
<filename>images/module_bottom.jpg</filename>
<filename>images/module_left_bottom.gif</filename>
<filename>images/module_left_top.gif</filename>
<filename>images/module_middle.jpg</filename>
<filename>images/module_right_bottom.gif</filename>
<filename>images/module_right_top.gif</filename>
<filename>images/module_top.jpg</filename>
<filename>images/right-bottom.gif</filename>
<filename>images/right-top.gif</filename>
<filename>images/module_middle_wide.jpg</filename>
<filename>images/module_top_wide.jpg</filename>
<filename>images/module_bottom_wide.jpg</filename>
<filename>images/submenu_back.gif</filename>
<filename>images/back_search.jpg</filename>
<filename>images/back_verlauf.jpg</filename>
<filename>images/banner_back.jpg</filename>
<filename>images/content-top.gif</filename>
<filename>images/content-top1024.gif</filename>
<filename>images/headmenu_left.gif</filename>
<filename>images/headmenu_right.gif</filename>
<filename>images/headmenu_left_hover.gif</filename>
<filename>images/headmenu_right_hover.gif</filename>
<filename>images/logo.gif</filename>
<filename>images/readon2.gif</filename>
<filename>images/readon.gif</filename>
<filename>images/module_head_back.jpg</filename>
</images>
※ここから下はCSSファイルです。
※二つ指定してます。管理画面のテンプレート編集→CSS編集画面で表示＆編集可能なのはデフォルトの「template_css.css」のみですので、もう一つの方はローカルで編集してFTPするなりと言った方法を取る必要があります。
※CSSファイルは当然、本体ファイルにも書かれています。
変更する際はそちらもあわせて変更するのを忘れないようにしましょう
<css>
<filename>css/template_css.css</filename>
<filename>css/css_color_green.css</filename>
</css>
</mosinstall>
次に「index.php」ですが、これがテンプレート本体になってます。これによってモジュールとかが配置されていきます。
各モジュールの位置は、サイト→テンプレート管理→テンプレートポジションで定義された位置定義と、モジュール→サイトモジュールで定義するポジションによります。
実際にページ上のどこにその「ポジション」があるのかは、テンプレート毎に違っている上、テンプレートによっては使われていないポジションとかもあるので、その辺は実際に表示してみて確認するのが一番です。
（もちろん、index.phpを見れば分かりますが、視覚的には分かりづらいです）
私はFirefoxのアドイン「WebDeveloper」で「情報表示」させて、確認してます。このアドインは非常に便利で、私的にはサイト作成になくてはならないツールです。（日本語版があるのも嬉しいです！）
index.phpで見る場合には、
<?php mosLoadModules ( ‘user4’,-1); ?>
によって、モジュールが配置されます。
この文中の「user4」というのが、この場合、モジュールが配置されるポジションになります。
このテンプレートの場合、こういうモジュールを配置する為のポジション定義と、実際の位置の定義は別にCSSで定義されています。
どちらもIDで定義されているのですが、まずページ上の位置を定義してるIDがあって、その中にモジュールを配置する為のポジションの定義があるという感じになってます。
その他にID内のタグ単位でスタイル定義されていたりして、非常に分かりにくい表現になってます。
どのモジュールがどこに配置されて、それがどういう風に表示されるのか、最初に把握しておいて、それからモジュールのポジションを決めて行って、更に各スタイルをちょっとづつ変更して行くのが良いかと思われます。
というか、わたしはそうやってこうと思います。
他に上手い方法があれば是非教えて下さい。
DreamweaverのJoomlaテンプレート作成用エクステンションもあるらしいんですけど、なんか日本語版はリンク切れしてるし、なんか結局自分でタグ打ちする方が早い気もするので。
※でもそうして考えると、自分でフリーCGIのいろんなのを使ってCMSもどきみたいな感じでページ作った方が早い気がしてきましたよ…
