Powered By FC2ブログ
ブログやるならFC2ブログ
今すぐブログを作っちゃおう!

--年--月--日

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

2007年03月18日

FC2ブログ用テンプレート、blogtube_basicとblogtube_extraの違い

ここではFC2ブログ用テンプレート、blogtube_basicとblogtube_extraの違いを説明します。以前のblogtube_basicをお使いで、カスタマイズしてある場合に参考にして下さい。細かい修正をしているだけなので、特に気にならなければ修正しなくてもそれ程問題はないはずです。基本的には3カラムと2カラム共用のテンプレートに変更しただけですので。

1.ブログで紹介したカスタマイズの適用

今までご紹介したカスタマイズを、blogtube_extraでは標準で適用しています。ですので、そのカスタマイズを適用すれば同じ内容になります。
適用したのは以下のエントリです。

以上のカスタマイズを適用しています。必須ではありませんので、必要なカスタマイズだけ適用すれば十分です。

2.スタイルシートの変更点

これから紹介する変更は、2カラムを使用しなければ特に必要ありません。必要な場合だけ変更してください。
変更した箇所(カラム変更に関する箇所)だけ紹介します。


body.layout-three-column,
body.layout-two-column-left,
body.layout-two-column-right{
text-align: center;
}

.layout-three-column #bodyid,
.layout-two-column-left #bodyid,
.layout-two-column-right #bodyid{
margin-top: 10px;
margin-bottom: 20px;
text-align: center;
background: #fff;
}

.layout-three-column #box,
.layout-two-column-left #box,
.layout-two-column-right #box{
width: 930px;
margin-right: auto;
margin-left: auto;
border: solid 1px #000;
}

.layout-three-column #box-margin,
.layout-two-column-left #box-margin,
.layout-two-column-right #box-margin{
margin: 0 15px;
}

.layout-three-column #box-left,
.layout-two-column-right #box-left{
float: left;
width: 660px;
}

.layout-two-column-left #box-left{
width: 900px;
}

.layout-three-column #box-right,
.layout-two-column-right #box-right{
float: right;
width: 230px;
}

.layout-three-column #box-main{
float: right;
width: 500px;
}

.layout-two-column-left #box-main,
.layout-two-column-right #box-main{
float: right;
width: 660px;
}

.layout-three-column #box-sub{
float: left;
width: 150px;
}

.layout-two-column-left #box-sub{
float: left;
width: 230px;
}

以上がカラムに関係する変更箇所になります。ここだけ置き換えれば、カラムの変更ができるようになります。
また、カラムサイズの変更も、ここを変更すればできます。

3.HTMLの変更点

HTMLの変更は、blogtube_extraのエントリも参考にして下さい。3カラムの場合はbody要素だけ、2カラムの場合はbody要素と使用するメニューの反対カラムを削除します。


3カラム→<body class="layout-three-column">
右メニュー2カラム→<body class="layout-two-column-right">
左メニュー2カラム→<body class="layout-two-column-left">

bodyを使用するカラムに応じて変更します。3カラムの場合はこのままで、2カラムの場合は逆側のカラムを削除します。削除はblogtube_extraのエントリで解説しています。

変更は以上になります。まずはblogtube_extraのテンプレートを新しく追加して試してみて、それからblogtube_basicのテンプレートをカスタマイズしてみるのが分かりやすいかと思います。

4.その他

一部コメント文の変更と、スタイルシートの.leftframeを.leftiframeに変更しました。これは単に打ち間違いです。通常は使用していないので、特に必要はありません。

スポンサーサイト

コメント

花・ガーデン・DIY

花・ガーデン・DIYを探すなら http://www.carrot-import.com/100005/

確認株式会社で30代,40代の転職の準備

確認株式会社とは、平成14年秋の臨時国会において成立した「中小企業が行う新たな事業活動の促進のための中小企業等協同組合等の一部を改正する法律(中小企業挑戦支援法、平成14年法律第110号)」に基づいて認められた、商法上の最低資本金制度(1000万円)の規制を受けない株式会社形態のこと http://methyle.catvtestchips.com/

コメントの投稿

サイト管理者にのみ通知する

トラックバックURL

http://templatetube.blog78.fc2.com/tb.php/21-9fd8b85e
プロフィール

templatetube

Author:templatetube
FC2ブログへようこそ!

最近の記事
最近のコメント
最近のトラックバック
月別アーカイブ
カテゴリー
ブロとも申請フォーム

Appendix


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。