Mahara日本語ドキュメント/カスタマイズ/テーマ/1.2

From Mahara Wiki
Jump to navigation Jump to search

Mahara 1.2では、テーマ設定ファイルをhtdocs/theme//themeconfig.phpから読みます。Mahara 1.2は、6つテーマを含んで、リリースされます。htdocs/theme配下に新しいテーマディレクトリが置かれて、themeconfig.phpに記述された場合、管理セクションのサイトオプションページに表示されます。

テンプレートは、htdocs/theme//templatesに保存されます。また、スタイルシートは、htdocs/theme//static/styleに保存されます。そして、イメージは、htdocs/theme//static/imagesに保存されます。

htdocs/theme//templates配下のディレクトリ構造は、大部分でサイトのPHPページ構造に酷似しています。ですから、例えば、htdocs/admin/site/options.phpで使用されるテンプレートページは、htdocs /theme/default/templates/admin/site/options.tplで見つけることができます。しかし、これは厳格なルー ルではありません。別のフォルダ内にある、いくつかのページでは、テンプレートを共有します。また、いくつかのテンプレートは、特定のページに属すことはありませんが、他のテンプレートでインクルードされます。

プラグインディレクトリには、プラグインのみに使用されるテンプレートが含まれています。例えば、htdocs/artefact/file/index.phpのアーティファクトプラグイン内にある「My Files」ページのテンプレートは、htdocs/artefact/file/theme/default/index.tplにあります。

Mahara 1.1とは異なり、スタイル/イメージがプラグインでのみ使用されるよう、プラグインではcssおよびイメージを含みます。

継承

テーマでは、themeconfig.phpファイルにて、親テーマを指定することができます。ユーザテーマが「子」テーマの場合、親および子のスタイルシートが (この順番で) 利用されます。また、特定のページで自身の追加スタイルシートを使用することができます。この場合、親および子の両者から、追加的なスタイルシートが読み込まれます。

例えば、アーティファクト/ファイルプラグインでは、独自のスタイルシートを持ちます。ユーザテーマが「デフォルト」の場合、親テーマは「raw」となり、ユーザは、マイファイルページにて、下記スタイルシートを検索することになります:

theme/raw/static/style/style.css
 theme/default/static/style/style.css
 artefact/file/theme/raw/static/style/style.css
 artefact/file/theme/default/static/style/style.css

これは、私たちに、多くの柔軟性を与えます。しかし、残念なことに、この方法では、ブラウザが多くのスタイルシートをリクエストすることになります。

他の6つの組み込みテーマでは、テーマ「raw」が特別なテーマであり、他のすべてのテーマの親として、使用されます。このため、私たちは、レイアウトの大部分をRawテーマのcssに入れることができました。そして、多くの場合、色をオーバーライドするだけのため、他のテーマのスタイルシートのサイズは、非常に小さなものとなります。

子テーマでは、独自のイメージを指定しますが、私たちは、テンプレートを全くオーバーライドせずに、実装することができています。新しいテーマを作成する場合、子テーマは、確認するには良い場所です。

作成する新しいテーマすべてにおいて、私たちは、「raw」テーマを親として使用することをお勧めします。

Mahara 1.2の新しいテーマを作成する

  1. theme/ サブディレクトリに新しいディレクトリを作成してください (例 theme/ponies または同様のディレクトリ)。
  2. あなたの新しいディレクトリに、デフォルトテーマディレクトリより、themeconfig.phpをコピーしてください。
  3. themeconfig.phpを編集して、$theme->displayname行にあなたのテーマ名を追加してください。

これ以降、あなたは未加工のテーマを継承した新しいテーマを作成することになります。これは、Maharaがテーマファイル (イメージ、CSSファイルまたはテンプレート) を必要とする場合、あなたのテーマディレクトリを探した後、未加工のテーマディレクトリを探すことを意味します。

イメージをオーバーライドするには、あなたのテーマディレクトリ配下に、static/imagesディレクトリを作成してください。例えば、site-logo.pngをtheme/ponies/static/imagesに入れることで、poniesテーマのサイトロゴを変更することになります。

あなたは、static/style/*.cssでも同じことができます - これらのスタイルシートは、親テーマのスタイルシートの後、読み込まれます。ですから、必要なことは、あなたが変更したいルールをオーバーライドするのみです。

また、あなたは、いくつかの標準プラグインのスタイルシートをオーバーライドすることもできます。例えば、あなたがフォーラムの外観を変更したい場合、未加工のテーマで使用されるスタイルシートは、interaction/forum/theme/raw/static/style/style.cssにあります。こららのルールをオーバーライドするには、あなたは、interaction/forum/theme配下に新しいディレクトリを作成する必要があります。ですから、あなたがステップ1で作成したディレクトリがtheme/ponies/の場合、interaction/forum/theme/ponies/static/style/ディレクトリを作成して、その中に、interaction/forum/theme/raw/static/style/style.cssでオーバーライドする必要のあるスタイルを含んだstyle.cssを追加してください。

私たちは、ほとんどの場合で、テーマ作者が新しいテンプレートを作成したり、「デフォルト」テーマから、作者のテーマにテンプレートをコピーする必要がな いことを希望します。新しいテーマのスタイルシートにおいて、デフォルトテーマをオーバーライドするだけで、多くの作業を完了することができます。