Geeklog Documentation
Geeklogドキュメント - テーマ作成

(Geeklogの最近のバージョンにおけるテーマ変更一覧については，下記参照のこと。)

Geeklog用のテーマ作成

Geeklog用にテーマを作成するのは簡単ですぐにできる。HTMLファイルを編集できるなら，テーマを作成できる。PHPを習得する必要はない。

テーマ作成

最初に，自分が作成したいテーマに最も似ている既存のテーマがあれば，それをコピーする。作成したいテーマが根本的に違うものであるなら（我々としてはそうであってほしいのだが），どのテーマをコピーしてもよい。既存のテーマを自分が希望するテーマ名でコピーしよう(テーマ名にスペースを含めないこと。)。

cp -R /path/to/geeklog/public_html/layout/professional /path/to/geeklog/public_html/layout/自分のテーマ名（スペースを含まない）

新しくできたディレクトリ（MS Windowsの場合は「フォルダ」。以下，同様。）に移動する。

cd /path/to/geeklog/public_html/layout/自分のテーマ名（スペースを含まない）

必要に応じてテンプレートを編集する。一般的に，GeeklogでいうテンプレートとはHTMLファイルの断片である。今作成したディレクトリにはGeeklogが必要とするすべてのテンプレートファイルが収められているが，外見を大きく変えるのに変更する必要があるのはほんの少数であろう。

特に次のテンプレートは間違いなく変更する必要があるだろう。

テーマはどのように機能するか

テーマを用いて表示するとき，Geeklogはサイトのヘッダになる header.thtml から始め，次に左ブロック({left_blocks} テンプレート変数と leftblocks.thtml テンプレートファイルを探そう)を処理する。サイトの中央部分は記事で構成されるが，普通の記事の場合は storytext.thtml と storybodytext.thtml テンプレートファイル，注目記事の場合は featuredstorytext.thtml と featuredstorybodytext.thtml テンプレートファイルが使用される。最後に，footer.thtml テンプレートファイルを使用して，右ブロック（{right_blocks} テンプレート変数と right_blocks.thtml テンプレートファイルを探そう）とサイトのフッタを表示する。ブロック自体は blockheader.thtml と blockfooter.thtml テンプレートファイルで構成されている。

この説明はGeeklogのメインページと記事がどのように作成されるかを述べただけである。Geeklogで見かける様々なエディタやリストだけでなく，カレンダプラグインなど，Geeklogのあらゆる部分を構成するために様々なテンプレートが存在している。

どのテンプレートファイルがGeeklogのどの部分の表示に使用されているのかを説明する完全なリストは今のところ存在していない。とはいえ，たいていの場合は，テンプレートのあるディレクトリ名とファイル名を見れば，用途は明らかなはずである。Geeklogのある部分を表示しているテンプレートファイルが分からない場合は，URLを見るとよい。たとえば，ユーザのプロフィールを表示しているときなら，users.php というPHPのファイル名に気がつくだろう。そのファイルをテキストエディタで開き， .thtml を検索する。プロフィールの場合は，次の行が function userprofile() の中に見つかる。

$user_templates = new Template ($_CONF['path_layout'] . 'users');
$user_templates->set_file (array ('profile'=>'profile.thtml', 'row'=>'commentrow.thtml', 'strow'=>'storyrow.thtml'));

PHPを理解していなくても，この部分で profile.thtml, commentrow.thtml, storyrow.thtml テンプレートファイルが使用されているのは分かるだろう。最初の行を見れば，これらのテンプレートファイルがテーマディレクトリ内の users ディレクトリから読み込まれているのが分かる。

テンプレートファイル内で使用されているテンプレート変数の不完全なリストもドキュメントに含まれている。

テーマのテストと追加情報

自分のテーマを編集し終わったら，次はテストだ。 http://自分のサイトのURL/usersettings.php?mode=preferences へ行き，テーマのドロップダウンリストから作成したばかりのテーマを選ぶ（テーマ名はテーマを収めているディレクトリ名と同じである）。

最後に，テーマの images ディレクトリ内のロゴや他の画像ファイルを入れ替える必要もあるだろう。

テンプレートシステムとしては，GeeklogではPHPLibのテンプレートクラス(http://phplib.sourceforge.net/)を使用している。彼らが作成したドキュメントを読み，できれば，/非公開領域/system/classes/template.class.php を覗いて，どのように実装されているか調べてみるのもよい。この知識があっても，あるテンプレートファイルがどのテンプレートファイルとセットで使われているかはっきりとわからないかもしれない（たとえば， storybody.thtml と storybodytext.thtml がセットになって，1つの記事の完全なフォーマットができあがる）。疑問があるなら，http://lists.geeklog.net/listinfo/geeklog-usersメーリングリストに登録するか，IRC（irc.freenode.net の #geeklog チャネル）で尋ねるとよい。

ヒントと注意点

テーマとWYSIWYGエディタ： Geeklogが使用するテンプレートファイルは完全なHTMLファイルではなく，断片に過ぎない。Geeklogはこの断片を組み合わせて適切なHTMLドキュメントを作成する。しかし，このため一部のWYSIWYG HTMLエディタが誤動作し，ファイルに不足しているHTML要素を勝手に追加して，Geeklogにとっては使い物にならないにしてしまうことがある。
テーマの編集には，単純なテキストエディタを使用することをお勧めする。

テンプレートファイル中のPHP： テーマのヘッダ，つまり，header.thtml の中ではPHPのコードを使用できる。カスタム関数を使用したいなら，テーマディレクトリ内の functions.php ファイル内で定義すればよい。

左右のブロックで見た目を変える： 左右のブロックの外見を変えることができる。詳細は，Geeklogホームページのこの記事を参照のこと。

アンケート： 投票結果をグラフで表示する際，複数の色の棒グラフを使用するには，{answer_counter} と {answer_odd} テーマ変数を pollbooth/pollvotes_bar.thtml テンプレートファイル内で使用するとよい。{answer_counter} はそれぞれの回答数に置き換えられるので， bar{answer_counter}.gif と記述すると，結果として bar1.gif, bar2.gif のようになる。GIFファイルごとに色を変えておけば，回答ごとに色も変わることになる。
{answer_odd} は回答ごとに 0 から 1，1 から 0 と変わるので，bar{answer_odd}.gif と記述すると，結果として奇数番目の回答は bar0.gif ，偶数番目の回答は bar1.gif となる。

右ブロック内で左ブロックを表示する： $_CONF['left_blocks_in_footer'] はかなり変わったオプションである。このオプションを使用すると，サイトのフッタ（つまり footer.thtml）内で {left_blocks} テンプレート変数が使用できるようになる一方，ヘッダ（header.thtml）内で {left_blocks} テンプレート変数が使用できなくなる。
これを利用すると，2列レイアウト（1列は右ブロック用，もう1列はコンテンツ用）を実現できる。単にすべてのブロックを右ブロックに移動しただけでは期待した動作にならない。ふつう左ブロックしか表示しないようなページ（たとえば，article.php や管理者用のページ）では，全くブロックが表示されない からだ。 $_CONF['left_blocks_in_footer'] = 1 にすると，この動作が修正され，システム内部では依然として左ブロックとして扱われていても，実際には右ブロックに表示されるようになる。
テーマの header.thtml, footer.thtml, leftblocks.thtml はたぶん，修正する必要があるだろう。だから，left_blocks_in_footer オプションはコンフィギュレーションでは設定できず，テーマの functions.php 内で設定すべきである。そうすることで，たとえば，ユーザに「普通の」テーマと右ブロックテーマを選択する余地を与えることさえできるようになる。

エラーメッセージ： Geeklog 1.4.1以降，重大なエラーが発生したときにRoot以外のユーザにどのようなHTMLを表示するか制御できるようになった。好みのHTMLを表示するには，lib-custom.php 内の CUSTOM_handleError 関数を変更する必要がある。

記事に永続リンク(permalink)を追加する： 多くのWebサイトでは，永続リンク，つまり記事に対応する永続的なURLを提供している。Geeklogでデフォルトの Professional テーマでは，記事の見出しが既にその機能を果たしている。つまり，記事の永続的なURLへのリンクとなっている（article.phpを指している）。しかし，この方法はあまり目につかないし，訪問者がページのどこかに永続リンクがあるのを期待することが多いため，自分で永続リンクを追加する方法を次に示す。

  1. 記事のテンプレートファイル内に適当な場所を探す。既に記事関係のリンクが多数含まれているので，storytext.thtml 内の story-footer セクションがよいかもしれない。
  2. 永続リンクを設置する場所を決めたら，次のコードを入力する。
    <a href="{article_url}">{lang_permalink}<a>
    これで，記事へのリンク(article_url)が，現在の言語ファイルの「永続リンク(Permalink)」に相当する語句(lang_permalink)を用いて追加された。
  3. 徹底的にやろう。この時点では，永続リンクは注目記事以外の記事でしか表示されない。また，CSSを使用して外見を変更したり，リンクの場所を調節する必要があるだろう。
  4. 同じコードを featuredstorytext.thtml と archivestorytext.thtml テンプレートファイルに追加すれば，注目記事にも永続リンクが表示されるようになる。

Geeklog 1.5.0でのテーマの変更点

XHTMLをサポート

XHTML準拠のテーマがサポートされた。テーマの functions.php ファイルの中で，次の定数を定義する必要がある。

define('XHTML', ' /');

こうすることで，内部的にXHTMLに切り替わる。テーマをHTMLとXHTMLの両方でサポートしたいなら，XHTMLの空要素タグがあるところすべてで {xhtml} テーマ変数を使用する必要がある。たとえば， <br /> タグは <br{xhtml}> と書く必要がある。HTMLをサポートするつもりがないなら，XHTMLタグを直接記述しても構わない。

注意: XHTMLを使用するなら，サイトのコンテンツ（記事，コメントなど）をXHTML準拠にしなければならない。Geeklogは自動的にコンテンツをXHTMLに変換しない。

「記事投稿」 - ユーザによる記事投稿

Geeklog 1.5.0では，ユーザが記事を投稿する際，記事を単に冒頭文だけでなく冒頭文と本文に分ける機能をサポートしている。テンプレートを変更することでこの機能は有効/無効にできる。該当するファイルは，

である。有効にするには， {bodytext} テンプレート変数を含むテーブルの列がテンプレートファイルに含まれるようにしよう。 {bodytext} テンプレート変数を含むテーブルの列をテンプレートファイルから削除すれば，元の動作に戻る。

管理者メニュー，ユーザメニュー，話題リスト

これらの項目は今ではリストを使用している。 <ul> タグと <li> タグとリストの黒丸を表示しないための新しい blocklist クラスが使用されている。ブロックを作成するために新しいテンプレートファイルが追加されている。

Geeklog-1.5.0のベータ版やリリース候補版で使用されていた {blockid} テンプレート変数は削除された。

セキュリティ上の変更

特に管理者セクションで使用される多くのフォームには，フォーム保存・アクション処理がきちんと実行されるよう，新しいhiddenフィールドが必要になっている（訳注：CSRF攻撃を防ぐため）。次の記述を

<input type="hidden" name="{gltoken_name}" value="{gltoken}"{xhtml}>

以下のテンプレートに追加すること。

プラグイン固有のテンプレートファイルが一部変更されているので，以下のテンプレートファイルを確認すること。

削除されたファイル

以下のテンプレートファイルは削除され，不要になった。

システムメッセージ

以前，システムメッセージ用にハードコードされていたCSSは，新しく sysmessage クラスとしてスタイルシートに移された。

Geeklog 1.4.1でのテーマの変更点

1.4.1ではCSSが以前よりも大幅に変更された。レイアウト用のコンポーネントがスタイルシートに移されている途中なので，外見を変えるのに，テンプレートファイルをいじる必要は少なくなっている。テーブルと <div> タグの使用が減り，セマンティックス（意味）と一貫性がさらに重視されている。 style.css ファイルには，CSSクラスの使用に関する説明が増えている。

従来通り，不足しているテンプレートファイルはGeeklogに同梱されているデフォルトのProfessionalテーマからコピーしてくればよい。

見出しタグ

今後，ブロックと記事のタイトルは見出しタグで表現される。記事の中で最大のタイトルは <h1> タグであり，ブロックのそれは常に <h2> タグである。

記事のレイアウト

記事のブロックはもはやテーブルを含まなくなり，対応するCSSのクラス名も一貫性を持たせるために変更された。記事を囲むボックスは， story クラスないし story-featured クラスという名前がついている。ボックス内のコンポーネントは，記事アイコン，記事情報，記事本体，記事フッタである。タイトルは <h1> タグを使用。注目記事は外側のボックスのクラスが違うだけで，残りは同じ。

ブロック

ブロックは記事と同じように変化した。テーブルはなくなり，block-box, block-box-left, block-box-right という名前の <div> タグが1個使用されているだけである。タイトルは <h2> タグであり，ブロックのヘルプアイコンは block-helpicon というクラスの <span> タグになった。ブロックのサブタイトルは，（新着記事ブロックや過去の記事ブロックのように） <h3> タグである。これらの変更は style.css についで，以下のファイルに影響を与える。

管理者用テンプレート

管理者用テンプレートの多くには，外見や機能の変更のため少しずつ変更が加えられている。自作テーマの管理者用テンプレートを変更していない場合，更新する最も簡単な方法は，Professional テーマの admin ディレクトリからファイルを一式，コピーすることである。

テーマの他の変更点

Professionalテーマ

以下の変更はProfessionalテーマ固有のものである。他のテーマに移植する必要はたぶんないだろう。

Geeklog 1.4.0でのテーマの変更点

従来通り，不足している新しいテンプレートファイルは，Geeklogに同梱されているデフォルトのProfessionalテーマからコピーしてくればよい。

管理者用テンプレート

Geeklog 1.4.0の管理者用セクションはかなりの変更を伴って改訂されている。したがって，従来のテーマの admin ディレクトリをGeeklog-1.4.0に同梱のProfessionalテーマの admin ディレクトリでそっくり置き換えてから，今まで自分が加えた改造を適用することをお勧めする。

注意: コントロールパネル(moderation.php)用の新アイコンは背景が白になっている。背景が暗い色（や白以外の色）のテーマ用には，アルファチャネルつきのPNG形式のアイコンをダウンロードするとよい。この場合は，JavaScriptを用いたハックを行わないと，インターネットエクスプローラでは表示できないことに注意。場合によっては，これらのアイコンを変換して，背景を透明にしたりテーマの背景色に合わせたりする必要があるだろう。

アドバンストエディタ（WYSIWYGエディタ）

同梱されているアドバンストエディタ(FCKeditor)を使用するには，次の新しいテンプレートが必要である。

テーマの header.thtml テンプレートファイルの <head> セクションに {advanced_editor} テンプレート変数を追加する必要がある。

他の変更点

Theme changes in Geeklog 1.3.11

There are no mandatory theme changes in Geeklog 1.3.11, so themes made for Geeklog 1.3.10 will work just fine without any modifications.

A few minor additions / new options have been introduced:

Theme changes in Geeklog 1.3.10

General note: To upgrade your custom theme for use with Geeklog 1.3.10, you can simply copy over any new template files from the Geeklog default theme.

The biggest change in Geeklog 1.3.10 is that we now ship it with only one default theme (the Professional theme, kindly provided by Victor B. Gonzalez) and that the previously included themes are now available as a separate download.

Admin templates

Most themes don't change the template files in the theme's admin directory, so you can often save yourself a bit of work by simply replacing the entire admin directory with the one from the Geeklog 1.3.10 distribution.

Other templates

Optional changes

The following is a list of optional changes (mostly new variables that are now available). This information is mostly of interest for those who want to develop their own themes.

Theme changes in Geeklog 1.3.9

Theme changes in Geeklog 1.3.8

Theme changes in Geeklog 1.3.8 were mostly aimed at moving as much of the hard-coded HTML into template files as possible. Other changes were made to give theme authors better control over the layout and a small portion of changes were done to incorporate new Geeklog features.

New template files

This is a list of the new files. You can safely copy these over from one of the standard themes that ship with Geeklog (most of these files contain HTML that was previously hard-coded into Geeklog).

adminoption_off.thtml
loginform.thtml
topicoption.thtml
topicoption_off.thtml
useroption_off.thtml
admin/database/listbackups.thtml
admin/database/listitem.thtml
admin/user/edituser.thtml
admin/user/plainlist.thtml
comment/commentbar.thtml
comment/startcomment.thtml
pollbooth/pollanswer.thtml
pollbooth/pollblock.thtml
pollbooth/pollcomments.thtml
pollbooth/pollresult.thtml
pollbooth/pollvotes_bar.thtml
pollbooth/pollvotes_num.thtml
preferences/boxesblock.thtml
preferences/commentblock.thtml
preferences/deleteaccount.thtml
preferences/digestblock.thtml
preferences/displayblock.thtml
preferences/displayprefs.thtml
preferences/excludeblock.thtml
preferences/language.thtml
preferences/privacyblock.thtml
preferences/profile.thtml
preferences/theme.thtml
preferences/username.thtml
preferences/userphoto.thtml
search/resultauthdatehits.thtml
search/resultrowenhanced.thtml
search/resultsummary.thtml
search/resulttitle.thtml
users/newpassword.thtml

Note: preferences and admin/database are new directores.

Changed / updated template files

These files have changed since Geeklog 1.3.7, i.e. they may contain new variables, table columns, etc. If you haven't changed these files in your existing theme, it is probably best to simply copy them over from one of the themes that ship with Geeklog (with the exception of style.css and header.thtml, see below).

style.css (see below)
header.thtml (see below)
admin/block/blockeditor.thtml
admin/block/listblocks.thtml
admin/block/listitem.thtml
admin/event/eventeditor.thtml
admin/event/eventlist.thtml
admin/event/listitem.thtml
admin/group/grouplist.thtml
admin/group/listitem.thtml
admin/story/liststories.thtml
admin/topic/listitem.thtml
admin/topic/topiceditor.thtml
admin/topic/topiclist.thtml
calendar/editpersonalevent.thtml
calendar/eventdetails.thtml
search/searchform.thtml
search/searchresults.thtml
submit/submitevent.thtml
users/getpasswordform.thtml

In style.css, four classes have been added that are used in the new search code of Geeklog 1.3.8. Instead of copying over the entire file, you will probably only want to copy over the code for those four classes: searchAuth, searchDate, searchHits, highlight.

If the header.thtml of your theme is using the {menu_elements} variable, then you do not need to make any changes to it. If it is not using that variable, then you will need to make one change to it. In that case, search your header.thtml for the link to the story submission form, i.e. something like

    <a href="{site_url}/submit.php?type=story">

and change it to read

    <a href="{site_url}/submit.php?type=story{current_topic}">

Removed template files

If you have a file named commentheader.thtml in your theme directory, you can safely remove it. It isn't used at all.

Theme changes in Geeklog 1.3.7

Please note that all the following changes are optional. Themes made for Geeklog 1.3.6 will work just fine with Geeklog 1.3.7 - no changes are necessary.

New features and improvements

Other changes

Theme changes in Geeklog 1.3.6

There have been a lot of changes in the themes for 1.3.6 to get rid of the last pieces of hard-coded english texts so as to make localisation easier. Most of these changes have been made in the Admin editors (admin directory) and the calendar (calendar directory). If you created your own theme for an earlier version of Geeklog, we recommend that you copy over these two directories from one of the themes that come with Geeklog (choose one that is similar to your own theme or which it was originally based on). It seems like most Geeklog themes didn't change these files anyway, so this shouldn't be too much of a hassle ...

Other changes

CSS changes

Note: Theme authors are encouraged to specify a character set in the header.thtml of their themes like this:

<meta http-equiv="Content-Type" content="text/html; charset={charset}">

Geeklog will replace the {charset} variable with the proper character set based on the currently used language file. Also make sure that you put the above line before the <title> tag in the <head> section of your header.thtml file.

Geeklogドキュメント作成プロジェクト(The Geeklog Documentation Project)
本ページのすべての商標と著作権はそれぞれの所有者に帰属します。Geeklogはコピーレフトです。