BeigeHeart_べーじゅのこころ

Entries

スポンサーサイト

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

【beige_hibis-beige】_No.29191

b_hibis-beige.gif

2006年に登録した【beige_hibis-brown】の別バージョンです。
【beige_hibis-brown】は、幅が狭く画像で幅指定していたので変更もできず、3年たった今はちょっと使いづらいかなぁと思っていました。
今回は、記事幅や全体幅等の変更も簡単にできるようになっています。
また記事幅可変にも簡単に変更できるようにしました。
変更方法は、追記に解説しています。

以前のものを使用してくださっている方、トップ画像なども新しく作り直しましたので、こちらのバージョンもお試しください。

[特徴など]
■プラグインカテゴリー3が記事の上部に表示されます。(個別記事以外)
[別バージョンなど]
【beige_hibis-beige-3c】※3カラム版_共有未登録
 3カラムへの変更はスタイルシートの一部を書き換えるだけです。(追記に記載。)
b_hibis-beige-3c.gif


3カラム変更方法

スタイルシートの
/* =============================================
レイアウト設定
============================================= */
という部分の/*コンテンツ*/から/* フッター部分 */を以下のように変更します。



記事幅変更方法

スタイルシートの
/* =============================================
レイアウト設定
============================================= */
の中の以下の箇所を調節します。

/*コンテンツ*/
div#container {
margin : 0px auto ;
width : 950px;  /*これが全体の幅です*/

/*メイン部分*/
div#layout_main {
float : left;
margin-right : -270px;  /*ここで全体幅からサイドメニュー+余白分を引いています*/
width : 100%;
}
div#layout_main>* {
margin-right : 270px;  /*サイドメニュー+余白分*/
}
div#layout_main #baseblock {
margin-right : 270px;  /*サイドメニュー+余白分*/
}

/*左サイド部分*/
div#layout_leftside {
float : right;
margin-top : 20px;
width : 240px;   /*サイドの幅*/
}
/*右サイド部分*/
div#layout_rightside {
clear : right;
float : right;
margin-top : 20px;
width : 240px;   /*サイドの幅*/
}

記事部分のみ広げたいときは、サイド幅240pxと余白分270pxの数値を減らします。(マイナス部分も同じ)
全体の幅も広げたいときは、950pxを増やすことで、記事幅も同じだけ増えます。

記事幅可変にしたいときは、コンテンツの幅「950px」を
95%」のように、パーセント表記にします。
「100%」で全体に広がります。

文章にして説明するとなんだかややこしいですが、やってみると簡単です。
ご質問等はお気軽にどうぞ。


3カラムスタイルシート

3カラム用のスタイルシートです。
一部変更がうまくいかない場合は、こちらをすべてコピーし、2カラムのスタイルシートと入れ替えてください。

左サイドMenu

Tree-Recent

右サイドメニュー

Calendar

全タイトルを表示

«01 | 2017/03 | 05»
Su Mo Tu We Th Fr Sa
- - - 1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31 -

*pagetop

Search

Profile

Chako

  • Author:Chako
  • 2005.4月よりFC2テンプレートを作っています。
    季節感と癒し空間がテーマです♪
    テンプレート用に作ったオリジナル画像を使用していますので更新は遅めです。みなさまのリクエストにもたまにはお答えしています。まずはテンプレ一覧をご覧下さいませ。
    訪問者合計:
    現在の閲覧者数:
    無料カウンター





    FC2BLOG:バックアップ取ろうよキャンペーン

Excellent Plugin

  • Style Keeper PLG2
  • C-PREVIEW
  • NewMark
  • CommentTop

    Powered by FCafe

アクセスランキング

[ジャンルランキング]
未設定
--位
アクセスランキングを見る>>

[サブジャンルランキング]
未設定
--位
アクセスランキングを見る>>
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。