Home > XHTML CSS > Movable Type

Vicuna Style Test

Vicuna Style Check

このページは、サーバー上に設置したCMSツールとほぼ同じ構造で書かれていますが、あくまでスタイルの確認用のためのもので、必要の無いメタ要素やリンクは削除・編集しています。(Validなソースではありません)

test2

確認用ページの右上には、各種類のページへ飛べるリンクが設置されています。このリンクを使うことで、他のページでスタイルがどのように作用しているか確認することができます。

individualページ(個別記事ページ)では、シングルカラム時の表示、コメント・トラックバックフォームや各要素(見出し・リスト・引用、等)が記事中どのように表示されるかを確認することができます。

StyleTestページを確認しながらスキンを調整後、スキンフォルダをサーバー上の指定の場所へアップすることで、同じ見た目になります。

Continue reading

Font Size

Vicunaはデフォルトで文章系文字サイズ13px相当、項目系文字サイズ13px相当の大きさで表示されます。文字サイズを調整したい場合は1-element.cssのアウトライン1-2.Font size settingの項目を調整してください。値を107%、もしくは114%に調整することで丁度良い読みやすい大きさになるでしょう。

Title
Desctiption
Desctiption
Title
Desctiption
Title
Desctiption
Title
Desctiption
Title
Desctiption
Title
Desctiption

Continue reading

Layout

layout.cssの調整でサイトのレイアウトを大きく変えることができます。固定幅・可変幅の変更、カラムの位置変更ができ、bodyにつけるクラスにより、各テンプレートで1カラム、2カラム、3カラム(モジュールをONにする必要あり)が自由に選べます。デフォルトでは以下のクラスがついています。

メインインデックス・テンプレート
body class="double"
アーカイブ・テンプレート
body class="double"
カテゴリー・テンプレート
body class="double"
日付アーカイブ・テンプレート
body class="double"
個別アーカイブ・テンプレート
body class="single"
その他
body class="single"

Continue reading

Eye Catch Module

test

ブログに画像を挿入したい場合はEye Catch Moduleを読み込みます。Eye Catch Moduleは4種類用意してあり、

  • mod_eyeCatch-short.css
  • mod_eyeCatch-long.css
  • mod_eyeCatch-mini.css
  • mod_eyeCatch-header.css

から好みのものをインポートして使います。(基本的にどれか1つだけを読み込ませてください)

Eye Catch Moduleをインポートした場合、画像に合わせてレイアウトが調整されます。(800pxの固定幅になる)

画像は[images]フォルダに同梱されているので、調整してアップロードしてください。

Continue reading

More...

Home

More...

Page Top