そもそもNews-Handlerの表示の仕組み
まず、News-Handlerでどのように表示が行われているか、を簡単に説明してみます。後の説明をわかりやすくするために書いてますが、だいたいの方はわかっているようなので、その場合は読み飛ばして下さい。
News-Handlerの構造はだいたいこんな感じです。
「個別の記事(エントリー)」→「テンプレート」+「スタイルシート」→→読者
いやぁ、さっぱりわからないな(笑)。というわけで詳しく説明すると、
・まず、皆さんが行っているように、管理画面で記事を投稿する。これが、「個別の記事」になります。
・この「個別の記事」が、「テンプレート」に読み込まれて、実際には表示されるようになります。
・そして、実際に表示されるときに、文章のそれぞれの部分をどんな風に(大きさ、色、フォント等)表示するかを、「スタイルシート」と組み合わせてブラウザが解釈します。
具体的な例で考えると――
管理画面から投稿された記事がまずあります。
管理画面から投稿された記事タイトルこれが、テンプレートの独自タグと呼ばれている部分に読み込まれます。例えばこんなテンプレートだと――
管理画面から投稿された記事本文
〈div class=\"title\"〉〈a href=\"{$entry_url[entry]}\" title=\"permlink\"〉■{$ename[entry]}→ここに記事タイトルが埋め込まれる〈/a〉〈/div〉〈BR〉独自タグに記事が読み込まれて、最終的には
〈div class=\"entry\"〉{$etext[entry]}→ここに記事本文が埋め込まれる〈/div〉
〈div class=\"title\"〉〈a href=\"{$entry_url[entry]}\" title=\"permlink\"〉■管理画面から投稿された記事タイトル〈/a〉〈/div〉〈BR〉そして、特にタグについて詳しく知る必要はないですが、この文章は、classで囲まれた部分ごとに、スタイルシートによって書式が決定されて画面に表示されるようになります。
〈div class=\"entry\"〉管理画面から投稿された記事本文〈/div〉
この例であれば、記事タイトルは〈div class=\"title\"〉〈/div〉というタグに囲まれているので「title」という書式が適用され、本文は、〈div class=\"entry\"〉〈/div〉というタグで囲まれているので、「entry」という書式が適用されるわけです。
スタイルシートの簡単な見方
テンプレートによって、文章のいろんな部分が、様々なclassに区切られています。試しにこのWeblogや、あなたのWeblogの「ソース」を見てみると良いでしょう。そのclass毎の書式設定が、スタイルシートです。
例えば、私のスタイルシートでさっきのtitleとentryの書式設定はこんな形で書いています。
.title {ちなみに私のスタイルシートはかなり汚いし問題あるのであくまでご参考。
PADDING-LEFT: 10px; →左から10ピクセル間隔を空けて表示始める
FONT-WEIGHT: bolf; →ボールドにする
FONT-SIZE: medium; →フォントサイズは中くらい
COLOR: #c20638; →色は、#c20638
}
.entry {
PADDING-LEFT: 10px ; →左から10ピクセル間隔を空けて表示始める
PADDING-RIGHT: 10px ; →右から10ピクセル間隔を空けるように折り返す
FONT-SIZE: small; →フォントサイズは小
COLOR: #666; →色は、#666
}
ここまでがぼんやりとでも理解できると後は簡単です。
亜流:Weblogの見た目を簡単にいじる方法
まず自分のWeblogを表示させましょう。そして、ソースを表示させます。
そして、ちょっと大変ですが、見栄えを変えたい部分が、どんなclassで囲まれているか、を見つけましょう。
見つかったら簡単です。あとは、スタイルシートで、該当するclassの箇所を色々書き直してみれば良いのです。
■とほほのスタイルシート入門
などで、スタイルシートの書き方を調べれば良いでしょう。
他には、「真似したい人のスタイルシートを見る」という手もあります。
スタイルシートは、管理画面のCSSファイルの編集から、出来ます。
※滅茶苦茶になってしまったら、テンプレートを変更すればリセットが出来ます
これで一般的な初心者の人はわかるのかな? 意見はコメントかトラックバック下さい。
本当はもっと留意することもあるのかもしれませんが、専門家ぢゃないので、ご指摘下さい。
これを読んだ人が、素敵なWeblogを作られることを祈ります。
参考
■News-Handler FAQ →こっちにエントリしたほうがよかったかも
# なんてな!
