日別アーカイブ: 2005年6月11日

カレンダーの曜日の色を変えたい

カレンダーがついているけど、デフォルテでは、全曜日とも同じ灰色!
やっぱり、[日]は赤が、[土]は青でなくちゃ、しまらない。

  1. 管理画面より、テンプレート→メインページ(index.html)を選択する。
  2. 中ほどにある、以下の部分を変更する。

    変更前:
    <tr>
    <th abbr="日曜日">日</th>
    <th abbr="月曜日">月</th>
    <th abbr="火曜日">火</th>
    <th abbr="水曜日">水</th>
    <th abbr="木曜日">木</th>
    <th abbr="金曜日">金</th>
    <th abbr="土曜日">土</th>
    </tr>

    変更後:
    <tr>
    <th abbr="日曜日"><span style="color: red;"></span></th>
    <th abbr="月曜日">月</th>
    <th abbr="火曜日">火</th>
    <th abbr="水曜日">水</th>
    <th abbr="木曜日">木</th>
    <th abbr="金曜日">金</th>
    <th abbr="土曜日"><span style="color: blue;"></span></th>
    </tr>

  3. [保存][再構築] で Ok

引用部分をボックスにしてわかりやすくしたい

デフォルトでは、行間を広げるだけの指定のみである。
これに、枠をつけて、背景色をいれて見栄えをよくします。

  1. 管理画面より、テンプレート→スタイルシート(styles-site.css)を選択する。
  2. 以下の部分を変更する。

    変更前:
    .content blockquote {
    line-height: 150%;
    }

    変更後:
    .content blockquote {
    line-height: 150%;

    margin-left: 10px;
    width: 90%;
    padding: 5px;
    text-align: left;
    border: solid thin maroon;
    background-color: cornsilk;

    }

  3. [保存][再構築] で Ok

エントリー名のバックの色を変えたい

エントリー名は、<h3></h3> でくくられているので、ここのスタイルを変更すると良い。

  1. 管理画面より、テンプレート→スタイルシート(styles-site.css)を選択する。
  2. 以下の部分を変更する。

    変更前:
    .content h3 {
    color: #666666;
    font-family: Verdana, Arial, sans-serif;
    font-size: small;

    text-align: left;
    font-weight: bold;

    margin-bottom: 10px;
    }

    変更後:
    .content h3 {
    color: #000000;
    font-family: Verdana, Arial, sans-serif;
    font-size: medium;

    text-align: left;
    font-weight: bold;

    margin-bottom: 10px;
    padding-left: 5px;
    background-color: peachpuff;
    }

  3. [保存][再構築] で Ok

Another HTML-lint gateway で減点される

Another HTML-lint gateway で、ブログをチェックすると、いろいろと減点されます。でも、基本的なところで減点されると気分が良くないので、メインページ(index.html)を訂正しました。

  1. 管理画面より、テンプレート→メインページ(index.html)を選択する。
  2. 以下の部分を追加、変更する。

    変更前:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
    <meta name="generator" content="http://www.movabletype.org/" />
    <title><$MTBlogName encode_html="1"$></title>

    変更後:
    <?xml version="1.0" encoding="<$MTPublishCharset$>" ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
    <meta name="generator" content="http://www.movabletype.org/" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <title><$MTBlogName encode_html="1"$></title>

  3. [保存][再構築] で Ok

背景を画像に変更したい

デフォルトでは、背景色となっている。これを画像に変更したい。

  1. 背景画像(ex. user_back.gif)を images フォルダに ftp する。
    (もちろん、新規にフォルダを作成してもよい。)
  2. 管理画面より、テンプレート→スタイルシート(styles-site.css)を選択する。
  3. 以下の部分を変更する。

    変更前:
    body {margin: 0px 0px 20px 0px;
    background-color: #8FABBE;
    text-align: center;
    }

    変更後:
    body {margin: 0px 0px 20px 0px;
    background-image:url(“images/user_back.gif”);
    text-align: center;
    }

    背景画像のurlについては、画像をアップした場所を指定します。

  4. [保存][再構築] で Ok