半月記 » テーマ http://pasero.net/~mako/blog Sat, 31 Jul 2010 09:29:54 +0000 ja hourly 1 http://wordpress.org/?v=3.0.1 WordPress テーマ F2 http://pasero.net/~mako/blog/s/114 http://pasero.net/~mako/blog/s/114#comments Fri, 05 Feb 2010 02:20:18 +0000 Mako http://pasero.net/~mako/blog/?p=114 続きを読む →]]> Free WordPress Themes directoryで、flexible-width, translation-ready に合致するテーマを検索してみると、たった9つしかありません。

そのうち、シンプルで便利そうなWordPress のテーマ F2 の日本語リソースを作って作者に送ったところ、バージョン 1.0.9 から同梱されるようになりました。

タグ

, ]]> http://pasero.net/~mako/blog/s/114/feed 3 テーマを作る (6) http://pasero.net/~mako/blog/s/64 http://pasero.net/~mako/blog/s/64#comments Fri, 16 Mar 2007 08:56:25 +0000 Mako http://pasero.net/~mako/blog/s/64 続きを読む →]]> 残るこまごましたことについて。

ブロックの境界

本文や sidebar (という名の実質 bottombar)などで float で段組をしているため、それを解除する clear:both を入れる必要がある。といって次のブロックの先頭に入れるのも気持ちが悪い。そこでブロックの境界に <hr> を使い、これに clear:both をつけることにした。スタイルで

PLAIN TEXT
CSS:
  1. hr {
  2.     display: block;
  3.     clear: both;
  4.     height: 0;
  5.     border: none 0px; /* 完全に消すにはこれも必要。 */
  6.     visibility: hidden;
  7.  }

として見かけ上は消してしまう。

「スタイルシートを使用しない」状態で見ても(といってそんな人はいないと思うが)見通しがよくなった。

page.php

Template Hierarchy に詳しい説明がある。

個別記事(single)と静的ページ(page)はよく似ている(コメントを許すかどうかを除いて)と思うのだが、静的ページで page.php がない場合に single.php を探しに行くことはないというのは意外だった。ここではコメントつきページのテンプレートは single と同じとした。

PLAIN TEXT
PHP:
  1. <?php
  2. /*
  3. Template Name: Page with comments
  4. */
  5. ?>
  6. <?php include (TEMPLATEPATH . '/single.php'); ?>

テンプレートが増えるとややこしくなるので、コメントなしページのテンプレート page.php は作らず、index.php の中で is_page() でそれ用の処理をすることにした。

タグ

, ]]> http://pasero.net/~mako/blog/s/64/feed 0 テーマを作る (5) http://pasero.net/~mako/blog/s/63 http://pasero.net/~mako/blog/s/63#comments Fri, 09 Mar 2007 04:35:39 +0000 Mako http://pasero.net/~mako/blog/s/63 続きを読む →]]> index.php, single.php

ようやく本文について。

個々の記事を、本文とコメントの2段組にした。そもそもこのアイデアを思いつき、そんなテーマを探してみたものの見つからなかったので今回自分で作ってみたのだった。

個別記事の表示(single.php)のときだけでなく、index.php でも各々の記事にトラックバックURLを表示するようにした。こうしているテーマも滅多にない。私の場合 more を使うことはあまりないので、トップページを見るだけで記事全文を見られることになる。わざわざ single に行かなくてもここにトラックバックURLを表示したほうが親切だろうと考えたのだ。

このトラックバックURLは実に長くなり、レイアウトで苦労する1)。そこで、よく他のサイトで見かけていたフォームの input に入れてある形を思い出した。入力させるところでもないのに何故こんな形にしているのだろうと不思議に思っていたが、ここにきて合点がいった。要するに幅を固定して表示できるのだ。さっそく真似ることにした。

comments.php

フォントは、他の部分では指定するとしても総称名までにしたが、コメントのところだけは遊び心で固有名を指定した。コメントとトラックバックは、順番は分けないが見かけが違うようにした。

Edit Commentsプラグインを使う。WordPress 2.1への対処法がコメントの 300 番にある。

もう一つ、Subscribe To Commentsプラグインを使うようにした。旧版(2.0.*)は設置がやや面倒だったが新版(2.1)は複数のファイルが一本化されて簡単になっていた。ところで設定で clear:both を制御できるはずなのだが毎回元に戻ってしまい、いまのこのテーマはコメントを含む記事の部分を2段組にしているので非常に具合が悪い。

PLAIN TEXT
PHP:
  1. if ( !$settings['clear_both'] ) {
  2.   $settings['clear_both'] = 'clear_both';
  3.   $update = true;
  4. }

の個所をコメントアウトして思いどおりになったのだが、他の人は困っていないのだろうか?2)

メッセージは旧版とほとんど変わっていないのでSubscribe to Comments 日本語化より2.0.4版をいただいて流用する。


  1. テーマ作成中、MR Tech Link Wrapperなる長いURLを折り返して表示する拡張を入れた Firefox を使っていたので、ことの重大さに気づいていなかった。検証のため IE で見ると大変なことになっていた。 ↑
  2. と思ったらコメント1143番に同じ思いをしている人がいた。 ↑

タグ

, ]]> http://pasero.net/~mako/blog/s/63/feed 1 テーマを作る (4) http://pasero.net/~mako/blog/s/61 http://pasero.net/~mako/blog/s/61#comments Mon, 05 Mar 2007 07:40:14 +0000 Mako http://pasero.net/~mako/blog/s/61 続きを読む →]]> footer.php

特に表示しなくてもいいのだろうが "Copyright © 年"を表示することにする。この年のところを、最も古い記事と最新の記事の日付を見て自動的に生成してくれるスクリプトをBoxy But Goldというテーマの中に見つけたので使うことにした。

sidebar.php

sidebarという名は踏襲するが見かけはbottomで、 3 段組とした。アーカイブの選択にはmonthchunksプラグインを使う。

タグ

, ]]> http://pasero.net/~mako/blog/s/61/feed 1 テーマを作る (3) http://pasero.net/~mako/blog/s/57 http://pasero.net/~mako/blog/s/57#comments Mon, 26 Feb 2007 03:01:08 +0000 Mako http://pasero.net/~mako/blog/s/57 続きを読む →]]> header.php つづき

WordPress 2.1に附属のテーマ default からいただいてきて改造する。

まず、Another HTML-lintの忠告に従い、

PLAIN TEXT
HTML:
  1. <meta http-equiv="Content-Style-Type" content="text/css" />
  2. <meta http-equiv="Content-Script-Type" content="text/javascript" />

を加える。

linkrelプラグイン

WordPress 2.1 に移行してLink Relプラグインが動かなくなっていた。エラーを見るとSQLを組み立てられなくなっていたようだ。WP-PageNaviプラグイン 2.10を参考にして、preg_matchの部分を

PLAIN TEXT
PHP:
  1. if(!is_category()) {
  2.     preg_match('#FROMs(.*)sORDER BY#siU', $request, $matches);
  3. } else {
  4.     preg_match('#FROMs(.*)sGROUP BY#siU', $request, $matches);
  5. }

としたら動くようになった。

しかし、ときどきリンクを間違える。ID順にリンクするらしく、記事のあいだに(静的)ページを作ったりするとそちらにリンクを向けてしまう。

この際なので新たに作ることにした。([2009-06-15]新しいバージョンに置き換えた)

前半はWP-PageNaviプラグインからいただき、これは !is_single() なので、is_single() の場合は wp-includes/link-template.php より previous_post_link(), next_post_link() をいただいて <a href=... > ... のかわりに <link rel=... href=... /> を出力するようにした。

linkwidgets

linkwidgets

ところでこのサイトナビゲーションは流行らなくなっていくのだろうか。Mozillaの頃は<link rel=...> にも対応していたのだが、Firefoxになってからは削除されてしまった。そこでLink Widgetsという拡張機能を入れている。

なおこの絵のように、Status Buttonsという拡張機能で、ツールバーのボタンをステータスバーに持ってくることができる。

seoプラグイン

SEO Title Tagプラグインを入れるので

PLAIN TEXT
PHP:
  1. <title><?php if (function_exists('seo_title_tag')) { seo_title_tag(); } else { bloginfo('name'); wp_title();} ?></title>

と対応させておく。

タグ

, , ]]> http://pasero.net/~mako/blog/s/57/feed 2 テーマを作る (2) http://pasero.net/~mako/blog/s/55 http://pasero.net/~mako/blog/s/55#comments Wed, 21 Feb 2007 11:23:17 +0000 Mako http://pasero.net/~mako/blog/s/55 続きを読む →]]> header.php

まずは header.phpについて。

WordPress 2.1に附属のテーマ default からいただいてきて改造していたのだが、ページのソースを見ると

PLAIN TEXT
HTML:
  1. <html xmlns="http://www.w3.org/1999/xhtml" lang="ja-UTF">

とある。ん? langの中身はこんな書き方できたっけ?

header.php を見ると、2.1 で登場した language_attributes() がこれを出力している。新しいためか日本語での情報はほとんど見つからない。hiromasa さんの“WordPress 2.1 の新機能”では「WPLANG の _ より前の値が」出力されるとあるが実際には WPLANG の「_」を「-」に置き換えて出力されているようだ。WPLANG は wp-config.php の中で 2.0.7ME からの名残で ja_UTF となっていた。これまで WPLANG は言語ファイルの選択にしか用いられていなかったものが表に現れてきたということか。

元来、言語_地域という構造のはず(例えば fr_CA はカナダでのフランス語)で、それを流用して ME では ja_UTF として使ったのだろうか。厳密に言ってこれはどうなんだろう。一方でプラグインの言語ファイルでは ja_UTF という書式も随分広まっているようだ。

タグ

, ]]> http://pasero.net/~mako/blog/s/55/feed 1 テーマを作る http://pasero.net/~mako/blog/s/54 http://pasero.net/~mako/blog/s/54#comments Mon, 19 Feb 2007 14:22:57 +0000 Mako http://pasero.net/~mako/blog/s/54 続きを読む →]]> WordPress 2.1 にしたことだし、ひとつ自分でテーマを作ってみるか、と思ってはじめてみた。作るといってもゼロから作るわけではなくて既存のものを換骨奪胎して組み上げていくに過ぎないのだが、そうやって人のものを見るのが何より勉強になる。できたものを見るとやっぱり自分にはセンスがないなと痛感するがそれはそれとして、この作業を通していろいろ解ったことがあったので書いておこうと思う。

IEで検証

ふだん使っているのは Debian GNU/Linux 上の Firefox1)である。検証に VMWare上の Windows XP の Internet Explorer を使う。IE7にバージョンアップし、別にスタンドアロン版の IE6を用意してこちらでも一応チェックするようにした。

それにしても IEの挙動には驚かされる。これまでにかかった時間の3分の2は IEで見たとき変なことになってしまうことへの対処ではないだろうか。IEというか Windowsのフォントの「汚さ」にも驚く。手をかければどうにかなるのだろうが普段使うわけでもないのでデフォルトのままだし(それに多くのライトユーザはそのままだろうし)、逆に手をかけないとどうにもならないので十分に手をかけている Linuxシステムを比較するのは公平でないのは承知のうえで、世の大部分の人がこの汚さであちこちのページを見ているのだと思ったら暗い気持ちになってきた。

こんな風に見えている例えば私はふだん使いのFirefoxのデフォルトを明朝体にしている。印刷された本を見てもわかるように、長い文章を読ませようとする場合は明朝体のほうが読みやすい。しかし Windowsにフォントを追加しない状態で、明朝体でwebを見ようという気にはとてもならない。Linuxを使ってみて UIが明朝で表示されることや Windowsでも Firefoxで明朝がデフォルトになっていることに強い違和感を訴える声を見かけていたが、なるほどこういうことだったのか。それらの人は既に、明朝体とは醜いもの、と思い込んでいるに違いない。確かにデフォルトの Windowsではそうだろう。これは何か明朝体を使わせないようにする陰謀ではないかと思えるほどだ。疑問に思うのなら試しにアンチエイリアスのかかる明朝体フォントを入れてしばらく使ってみればよい。それにIEのデフォルトの「中」のフォントの大きさも問題だ。これらのせいでやたら小さなサイズのゴシック体に固定したブログサイトだらけになっている訳だ。

- - -

そのつもりはなかったが、だんだんひどい悪口になってきた。テーマを作る話はまた今度。


  1. Debianでの呼称は Iceweaselなのだが、それでは余所で通じないので Firefoxと呼ぶことにする ↑

タグ

, ]]> http://pasero.net/~mako/blog/s/54/feed 1