メインカラム左側、サイドカラム二つを右に配置するFC2ブログカスタマイズ・『96_seo_pink-3ca』の場合;FC2ブログ・プチカスタマイズ   

メインカラム左側、サイドカラム二つを右に配置するFC2ブログカスタマイズ・『96_seo_pink-3ca』の場合|FC2ブログ・プチカスタマイズ

  このページはFC2ブログ・プチカスタマイズの ・FC2ブログのテンプレートカスタマイズ | カラム配置のカスタマイズ| メインカラム左側、サイドカラム二つを右に配置するFC2ブログカスタマイズ・『96_seo_pink-3ca』の場合 に関する情報を紹介しています。
  FC2ブログ・プチカスタマイズは、FC2ブログをちょっとだけ改造して、使い易くします。  FC2ブログの魅力は、初心者は初心者なりに、上級者は上級者なりにテンプレートやスタイルシートを改造して色々と変えることができるところ。 このブログでは、初心者から中級者向けのFC2ブログカスタマイズ法をあれこれご紹介。  FC2ブログを楽しみましょう。

 


 
 
Top Page > スポンサー広告 > メインカラム左側、サイドカラム二つを右に配置するFC2ブログカスタマイズ・『96_seo_pink-3ca』の場合・FC2ブログのテンプレートカスタマイズ > カラム配置のカスタマイズ > メインカラム左側、サイドカラム二つを右に配置するFC2ブログカスタマイズ・『96_seo_pink-3ca』の場合


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




web拍手 by FC2←これはFC2拍手。お礼のコメントがあるよ。拍手してみて。 FC2 Blog Ranking

このエントリーをはてなブックマークに追加

 FC2ブログのカラムの配置を換えてみよう。

 『FC2ブログ・プチカスタマイズ』のテンプレートは『96_seo_pink-3ca』というテンプレートである。

 『96_seo_pink-3ca』は3カラムのテンプレートでプラグイン対応、枠固定タイプ。

 通常の3カラムと同じように『サイドカラム1(サイドメニュー1の表示される範囲)』『メインカラム(記事などが表示される範囲)』『サイドカラム2(サイドメニュー2の表示される範囲)』の順に配置されている。

 

 今回は、各カラムの配置を変えて、『メインカラム(記事などが表示される範囲)』『サイドカラム1(サイドメニュー1の表示される範囲)』『サイドカラム2(サイドメニュー2の表示される範囲)』の順番に変えてみた。

 メインカラムが向かって左側に、サイドカラムが右側に配置される。

 

メインカラム左側、サイドカラム二つを右に配置するFC2ブログカスタマイズ・『96_seo_pink-3ca』の場合

1、テンプレートの設定をクリックし、現在利用している『96_seo_pink-3ca』を表示。

2、スタイルシートの変更をする。

 変更するのは、以下の2箇所。

/* main 要素              */

#mainBlock {
 float : right; margin-top: 0px;
 width : 490px; text-align: left;
}
html>#mainBlock {
     width:490px;margin-top:0px;
}

↓↓↓↓↓↓↓

/* main 要素              */

#mainBlock {
 float : left; margin-top: 0px;
 width : 490px; text-align: left;
}
html>#mainBlock {
     width:490px;margin-top:0px;
}

 

/* 左menu 要素              */

#menu1Block {
 float :left ; width : 200px;
 

↓↓↓↓↓↓↓

/* 左menu 要素              */

#menu1Block {
 float :right; width : 200px;
 

 

3、更新ボタンをクリック。

 

 これで、通常の3カラムの配置だった『96_seo_pink-3ca』のカラムの配置が換わる。

 でも、このままでは、ブログ本体の左側の隙間が小さくて、右側が大きいためバランスが悪い。

 というわけで、ブログ本体の左側の隙間を調整した。

 で、できたのが現在の『FC2ブログ・プチカスタマイズ』。

 まあ、元になるテンプレートによって、スタイルシートが違うので、あくまで『96_seo_pink-3ca』の場合のスタイルシートを前提にしている。

 ただ、3カラムテンプレートには、スタイルシートの書き方が違っていてもカラムの構成パターンが決まっているので、基本的なカラムの構成を覚えておけば同じようなカスタマイズができる。

 3カラムの基本的な構成についてはまた後日。



サイト内の同タグへのリンク: FC2  ブログ  カスタマイズ  スタイルシート  カラム  3カラム 
他のサイトへのタグリンク : FC2 ブログ カスタマイズ スタイルシート カラム 3カラム

web拍手 by FC2←これはFC2拍手。お礼のコメントがあるよ。拍手してみて。 FC2 Blog Ranking
このエントリーをはてなブックマークに追加
関連記事リスト
  カテゴリ名:[カラム配置のカスタマイズ]
コメント
この記事へのコメント
コメントを投稿する
URL:
Comment:
Pass:
秘密: 管理者にだけ表示を許可する
 
トラックバック
この記事のトラックバックURL
http://tadameru2.blog91.fc2.com/tb.php/134-5aa9f056
この記事にトラックバックする(FC2ブログユーザー)
この記事へのトラックバック
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。