さあ、残るはメインの部分です。
あなたのWordPressがまもなく完成!!

メインの部分をカスタマイズしよう

最後にメインの部分のカスタマイズです。もう要領はわかったと思います。ヘッダー部分やナビゲーション部分のカスタマイズと同じような作業です。

日付の表示部分を変更する

日付の部分は背景画像は使っていません。テーマファイルのスタイルシートのみで行っています。以下の部分を探しましょう。

#main h2 {
font-size: 80%;/*文字の大きさ*/
text-align: right;/*文字の行揃え*/
padding: 4px 20px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
color: #ffffff;/*文字の色*/
background-color: #333333;/*背景色*/
}

ご覧になると分かると思います。文字の大きさや色、背景色などを変更してみましょう。

記事のタイトル部分のカスタマイズ

記事のタイトル部分の背景画像
記事のタイトル部分には背景画像を使っています。上のような画像です。この画像も「wdcro」フォルダの「css_img」フォルダに「h1_pg_bg.gif」という名前で入っています。

このファイルはGIF画像ですが、JPEGなどの画像を使う場合はテーマエディタでそのファイル名の記述部分を変更する必要があります。これまでの作業と同じようにWordPressの管理画面の「デザイン」、「テーマエディタ」、「スタイルシート」をクリックします。そこで以下のような記述を探します。

#main h3.storytitle {
font-size: 100%;
background-image: url(css_img/h1_pg_bg.gif);/*記事タイトルの背景画像*/
background-repeat: no-repeat;
margin: 0px;
width: 500px;
color: #FFFFFF;/*文字の色*/
padding-top: 10px;
padding-right: 0px;
padding-bottom: 10px;
padding-left: 0px;
text-indent: 15px;
}
.storytitle a {
color: #FFFFFF;/*文字の色*/
text-decoration: none;
}
.storytitle a:hover {
color: #FFFFCC;/*文字の色*/
}

もう詳しく書かなくても分かると思います。「h1_pg_bg.gif」のファイル名を変更すれば良いだけです。その他、文字の色も変更できます。

フッター部分のカスタマイズ

最後にフッター部分のカスタマイズです。この部分も背景画像は使っていませんのでテーマエディタでスタイルシートを編集するだけです。以下の部分を探しましょう。

.credit {
color: #ffffff;/*文字の色*/
background-color: #003300;/*背景の色*/
margin: 0px;
clear: both;
width: 720px;
padding: 3px;
font-size: 80%;
}
.credit a:link, .credit a:hover {
color: #ffffff;/*文字の色*/
}

もう分かりますね。文字の色や背景色を変更しましょう。これでWordPressテーマ(テンプレート)のカスタマイズは終わりです。あとはあなたがマメにこのブログを運営していくだけです。

ページトップへ