たーちゃんのホームページ

ｇｏｏブログをカスタマイズしよう。

ここでは、ｇｏｏブログのカスタマイズ、私の場合の足跡を記します。

◎　ｇｏｏブログにログインして、テンプレートの選択をしてジャンルを選択します。
ここでは、「シンプルクリアーパープル左」を選択しています。
◎　ＣＳＳの編集をクリックして、スタイルシートを表示します。
　　※修正する場所は、ページ全体の背景、タイトル、カレンダーの背景３箇所です。

☆背景の画像☆
下記は、初期設定になっている背景部分です。

/* ページ全体の背景と余白 */
body {
background-image: url();
background-repeat: ;
background-position: ;
margin:0px;
padding:0px;
background-color:#F3EAF7;
}

この部分に注目してね→background-image: url();
url();←このカッコの中に背景のＵＲＬを入れてください。

例：
http://blogimg.goo.ne.jp/user_image/4b/b6/cb2eef515577f68f62c6eaac54711906.png
そうすると、下記のようになります。

/* ページ全体の背景と余白 */
body {
background-image: url(http://blogimg.goo.ne.jp/user_image/4b/b6/cb2eef515577f68f62c6eaac54711906.png);
background-repeat: ;
background-position: ;
margin:0px;
padding:0px;
background-color:#F3EAF7;
}

ここでプレビューをクリックして見てください。
背景が反映している事を確認して、保存をクリックして保存しちゃいましよう。
　これで背景が完了しました。
次にいよいよ、タイトル画像の貼り付けです。

☆タイトル画像☆

下記は、初期設定になっているタイトル部分のコピーです。

/* ヘッダーの指定　*/
#header {
background-color: #E8D0E8;
padding:35px;
border-bottom: 1px solid #E3C8E3;
background-image: url(/images/tmp_sm_pp_l/head_bg.gif);
}

padding:35px;←この部分の３５を、７０に変更して下さい。
この部分に注目→background-image: url(/images/tmp_sm_pp_l/head_bg.gif);
(/images/tmp_sm_pp_l/head_bg.gif);←このカッコの中の文字を削除して、タイトル画像のＵＲＬを入れます。

例：http://blogimg.goo.ne.jp/user_image/4c/d9/863b74c35cc645c808ea668982cdd17b.gif
そうすると、下記のようになります。

/* ヘッダーの指定　*/
#header {
background-color: #E8D0E8;
padding:70px;
border-bottom: 1px solid #E3C8E3;
background-image: url(http://blogimg.goo.ne.jp/user_image/4c/d9/863b74c35cc645c808ea668982cdd17b.gif);
}

☆カレンダーの背景画像☆

下記は、初期設定になっているカレンダー背景のコピーです。

/* カレンダー背景 */
.calendar{
font-size: ;
}

下図の※※※※※※※※※※の所に　background-image: url();　を挿入貼り付ける。

/* カレンダー背景 */
.calendar {
※※※※※※※※※※
font-size: ;
}

例：http://blogimg.goo.ne.jp/user_image/2e/17/0919d0d0293ef02d1bb9445255896a4e.png
　そうすると、下記のようになります。

/* カレンダー背景 */
.calendar
{background-image: url(http://blogimg.goo.ne.jp/user_image/2e/17/0919d0d0293ef02d1bb9445255896a4e.png);

font-size: ;
}

これで完成です。

ジャンル別一覧