2007-01-02Joomlaのテンプレート弄ってます。ftpでも管理機能を利用してもどっちでも編集可能なんですが、どうも日本語処理がうまく行かないようで、テンプレートファイル内に日本語を入れると文字化けします。ブラウザで見た場合はOKなんですが、ファイルの文字コード認識フラグが壊れているのか、エディタでは自動認識しません。すると、通常のCSSエディタとか使えない。しょうがないので覚書的コメント入れてたのを全部英語に直しました。テンプレートなんですが、これと同時に弄る必要があるのは様々なパーツというかモジュールですね。セクション→カテゴリを作っておかないと、メニューも作れない。テンプレートはなかなか良いのが見つからなくて、Mamboとかのもいろいろ探したんですが(Mambo4.5とJoomla1はテンプレートの互換性ありなのです。他のモジュールも互換性のあるものがあるらしい)、どうもフィットする物が無いというか、Mamboだと何故かTable使ってるものがほとんどなので、自分的にちょっと使いたくないなあと...。MTとかもそうですが、CSSを使うならTableはレイアウトに使うのは邪道でしょう。XHTML的にブロック化して使うべきだと思う訳です。Joomlaパッケージにデフォルトで入ってるのはそういう意味ではきちんと作られているのですが、いかんせんデザインが×。あちこち弄る必要が非常に多いのです。弄ってる最中に忘れそうなので、その覚書です。自分的にヘッダ、三カラムからなるメインコンテンツ、フッタとレイアウトしたいので、それにあわせて、モジュールの位置を決めて、スタイルを決めるのが面倒。いうか、説明書無いので、どこがどうなってるか非常に分かりづらい。私は「madeyourweb」というテンプレートをお手本にして、これをコピって弄ってます。これが以下のような構成になってます。以前書いたように構成は「templateDetails.xml」に書かれています。ブラウザでの制御とかもこれを参照するので、ファイルだけ変更してアップしても、これに沿ってないと、きちんと表示されません。※つまり、新しい画像ファイルとか、ファイル名を変更したCSSファイルとか画像ファイルも、全部その変更をこのファイルに書いてやらないと、反映されない、という事です。※その際のファイル情報は、「templateDetails.xml」に対する相対パスで書きます。←説明(変更可)※ここまでがテンプレートの概要情報。ここを変更する事は可能ですが、他の人が作ったテンプレートの作者名を変更するとか、そういうのは論外です。Joomlaもそうですが、フリ-のテンプレートはGNU/GPLに沿ったライセンスの考え方になってるので、そこから派生した物も当然そうなりますね。そこら辺はわきまえましょう。※もちろん、そのままでは使わない事が大半だと思いますので、いろいろ変更しなくちゃならないと思います。その場合は変更した事が分かるように上の情報を変えときましょう。※ここからしたが、各種ファイルのリストです。←サムネイル画像の定義(これは適当で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」で「情報表示」させて、確認してます。このアドインは非常に便利で、私的にはサイト作成になくてはならないツールです。?>によって、モジュールが配置されます。この文中の「user4」というのが、この場合、モジュールが配置されるポジションになります。このテンプレートの場合、こういうモジュールを配置する為のポジション定義と、実際の位置の定義は別にCSSで定義されています。どちらもIDで定義されているのですが、まずページ上の位置を定義してるIDがあって、その中にモジュールを配置する為のポジションの定義があるという感じになってます。その他にID内のタグ単位でスタイル定義されていたりして、非常に分かりにくい表現になってます。どのモジュールがどこに配置されて、それがどういう風に表示されるのか、最初に把握しておいて、それからモジュールのポジションを決めて行って、更に各スタイルをちょっとづつ変更して行くのが良いかと思われます。いうか、わたしはそうやってこうと思います。他に上手い方法があれば是非教えて下さい。DreamweaverのJoomlaテンプレート作成用エクステンションもあるらしいんですけど、なんか日本語版はリンク切れしてるし、なんか結局自分でタグ打ちする方が早い気もするので。Machine用HDDが壊れた2015-06-03Mac時々Winな話題オンライン文具女子博の戦利品2021-01-23文具いろいろMacBookAirその後2015-05-04Mac時々Winな話題うみこ(かいいくこ)わんこの枕Web開発を主に請け負うフリーランスのエンジニア。設計から実装まで全行程対応でWebもアプリも解析もなんでもやります。最近多いのはPHPとかJavaScript(NodeJS、VueJS、Nuxtとかその辺り)とか。文具愛、ワンコ愛に滾ってる貴腐人です。