Sponsored link
Main Menu
Access ranking
Page ranking
ipodtouch.iphone GET
ipodtouch iphone GET情報！なるべくお得に欲しい～！
光加入で【PS3、wii、ipod、２５,０００円】プレゼント
ソフトバンク携帯をお考えの方へ朗報！
最新機種にするだけで10,000円の商品券がもらえちゃいます！
詳しくはこちらからお問い合わせを！
Counter
多数のアクセス有難うございます。
オススメGOODSその１
☆ソーラーバッテリー☆
使わないときに蓄電して充電！！
☆dockコネクタ☆
巻き取り式が便利!!安いので予備があると助かります。
☆ストラップがつけられるケース☆
iphoneでもストラップをつけたい人は多いはず。それがかないます！Rss
Gizmobies(ギズモビーズ)
| ようこそ！Pod狂会へ！ Pod狂会はipodtouch,iphoneの様々な情報を扱っているブログです。質問などありましたらコメント・twitterからでも気軽に聞いてみてください。 わたくし管理人も１iphoneユーザーであり、１素人です。間違った情報を書くこともあるかと思いますが、どうかあたたかく見守ってくだされば幸いです。コメントの返信が遅れる場合がありますのでご容赦ください。  |
[PR]
【楽天市場】☆iphone売れ筋ランキング
【YAHOO!!ショッピング】ケース3g/3gs☆iphone4
☆こちらも応援お願いしまっす!!⇒人気ブログランキング
×
[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
DIM WATER INSIDE ３カラム化
【楽天市場】☆iphone売れ筋ランキング
【YAHOO!!ショッピング】ケース3g/3gs☆iphone4
以下、カズヒロさんのブログ内容を参考しました。
ＣＳＳの修正
テンプレートの幅は900ですので、合計で900になるように自由に設定できます。今回は、左右のサイドメニューの幅を200、記事の幅を500としました。
まずは、エントリー部分の「#e-zone」を探してください。見つけたら、以下のように修正します。
赤字の部分が追加箇所で、左に寄せて幅を500に固定しました。
赤字の部分が追加箇所、桃色の部分が変更箇所です。
幅を200にして、右サイドメニュー「#menu2」を新たに追加しました。「#menu」および「#menu2」のfloatの右左のみ注意してくさい。後はコピペです。
HTMLの修正
まずはHTMLの以下の赤字部分を切り取ってください。
切り取る部分はplugin2から4までの部分です。
下記のように</div>を削除し、<!--leftEND-->の下に先ほど切り取った部分を貼り付けます。
私のブログのテンプレートDIM WATER INSIDEは
２カラムのテンプレートですが、３カラムにしたくて
３カラムにしました。
作者はヨウスケさんでとても頼りになります。
３カラム方法を参考にしたのはカズヒロさんの
ブログですが、カズヒロさんのブログはもう見ることが
できないのですが、検索エンジンのキャッシュなど色々
探して３カラム化にできました。
その方法を紹介します。
スイカとつづきをどうぞ
以下、カズヒロさんのブログ内容を参考しました。
ＣＳＳの修正
テンプレートの幅は900ですので、合計で900になるように自由に設定できます。今回は、左右のサイドメニューの幅を200、記事の幅を500としました。
まずは、エントリー部分の「#e-zone」を探してください。見つけたら、以下のように修正します。
赤字の部分が追加箇所で、左に寄せて幅を500に固定しました。
#e-zone{次に、左サイド部分の「#menu」を探してください。見つけたら、以下のように修正します。
width: 500px;
float: left;
overflow:hidden;
}
赤字の部分が追加箇所、桃色の部分が変更箇所です。
幅を200にして、右サイドメニュー「#menu2」を新たに追加しました。「#menu」および「#menu2」のfloatの右左のみ注意してくさい。後はコピペです。
#menu{以上で、CSSの修正・変更は終了です。
text-align:center;
width: 200px;
float: left;
overflow: hidden;
margin: 0;
border: 0px solid #fff;
background-color: #000;
background-image:url("");
background-repeat:repeat;
background-position:top;
}
#menu2{
text-align:center;
width: 200px;
float: right;
overflow: hidden;
margin: 0;
border: 0px solid #fff;
background-color: #000;
background-image:url("");
background-repeat:repeat;
background-position:top;
}
#menu h3{
color:#59439A;
font-size: 100%;
padding: 5px;
margin: 0;
border: 0px solid #fff;
background-color: ;
background-image: url("");
background-repeat: repeat;
}
#menu ul{
font-size: 90%;
padding: 5px;
margin: 0;
list-style-type: none;
}
#menu li{
margin-bottom: 5px;
}
#menu2 h3{
color:#59439A;
font-size: 100%;
padding: 5px;
margin: 0;
border: 0px solid #fff;
background-color: ;
background-image: url("");
background-repeat: repeat;
}
#menu2 ul{
font-size: 90%;
padding: 5px;
margin: 0;
list-style-type: none;
}
#menu2 li{
margin-bottom: 5px;
}
HTMLの修正
まずはHTMLの以下の赤字部分を切り取ってください。
切り取る部分はplugin2から4までの部分です。
<div id = "main">次に、HTMLの一番下の方にある<!--leftEND-->という記述を探してください。
<div id = "menu">
<!--plugin-->
<!--plugin1-->
<h3 align = "<!--$plugin_title_align-->" title="<!--$plugin_header_explanation-->"><!--$plugin_title-->
</h3>
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_header_explanation-->
</div>
<!--$plugin_data-->
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_footer_explanation-->
</div>
<!--/plugin1-->
<!--plugin2-->
<h3 align = "<!--$plugin_title_align-->" title="<!--$plugin_header_explanation-->"><!--$plugin_title-->
</h3>
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_header_explanation-->
</div>
<!--$plugin_data-->
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_footer_explanation-->
</div>
<!--/plugin2-->
<!--plugin3-->
<h3 align = "<!--$plugin_title_align-->" title="<!--$plugin_header_explanation-->"><!--$plugin_title-->
</h3>
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_header_explanation-->
</div>
<!--$plugin_data-->
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_footer_explanation-->
</div>
<!--/plugin3-->
<!--plugin4-->
<h3 align = "<!--$plugin_title_align-->" title="<!--$plugin_header_explanation-->"><!--$plugin_title-->
</h3>
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_header_explanation-->
</div>
<!--$plugin_data-->
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_footer_explanation-->
</div>
<!--/plugin4-->
<!--/plugin-->
</div>
<div id="e-zone">
下記のように</div>を削除し、<!--leftEND-->の下に先ほど切り取った部分を貼り付けます。
</td></tr></table>すると、次の図のようになります。桃色の部分が貼りつけた部分、赤色はあらたに加えた部分です。
</div> ←ココを消します。
<!--leftEND-->
←ココに切り取った部分を貼り付けます。
<div id="footer"><!--CM1--> / &
<!--leftEND-->
<!--右サイドメニュー追加-->
<div id = "menu2">
<!--plugin-->
<!--plugin2-->
<h3 align = "<!--$plugin_title_align-->" title="<!--$plugin_header_explanation-->"><!--$plugin_title-->
</h3>
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_header_explanation-->
</div>
<!--$plugin_data-->
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_footer_explanation-->
</div>
<!--/plugin2-->
<!--plugin3-->
<h3 align = "<!--$plugin_title_align-->" title="<!--$plugin_header_explanation-->"><!--$plugin_title-->
</h3>
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_header_explanation-->
</div>
<!--$plugin_data-->
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_footer_explanation-->
</div>
<!--/plugin3-->
<!--plugin4-->
<h3 align = "<!--$plugin_title_align-->" title="<!--$plugin_header_explanation-->"><!--$plugin_title-->
</h3>
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_header_explanation-->
</div>
<!--$plugin_data-->
<div style="text-align:<!--$plugin_explanation_align-->">
<!--$plugin_footer_explanation-->
</div>
<!--/plugin4-->
<!--/plugin-->
</div>
<!--右サイドメニュー追加ここまで-->
</div>
補足：（やってもやらなくてもいいコーナー）------------------------------------------
プラグイン部分を左寄せするときは、#menuと#menu2にある
text-align:center;
を
text-align:left;
に変更します。。
またプラグインが左にピッタリついてしまうのがいやな方は更に
padding-left:10px;
を追加し、
width200pxを
190pxに変更します。
これできれいに収まるはず・・・です。
------------------------------------------------------------------------------------------------
これで完成です。「テンプレートの保存」をしてください。
プラグインの設定ですが、左サイドメニューは「プラグインカテゴリー1」で、右サイドメニューは「プラグインカテゴリー2」で行ってください。
プラグイン部分を左寄せするときは、#menuと#menu2にある
text-align:center;
を
text-align:left;
に変更します。。
またプラグインが左にピッタリついてしまうのがいやな方は更に
padding-left:10px;
を追加し、
width200pxを
190pxに変更します。
これできれいに収まるはず・・・です。
------------------------------------------------------------------------------------------------
これで完成です。「テンプレートの保存」をしてください。
プラグインの設定ですが、左サイドメニューは「プラグインカテゴリー1」で、右サイドメニューは「プラグインカテゴリー2」で行ってください。
[0回]
PR
☆こちらも応援お願いしまっす!!⇒人気ブログランキング
http://hackers17.blog134.fc2.com/
いつもブログを見させてもらっています。
どうか、↑のブログをリンクしてください。
お願いします。
ぺぺ様
一方的にリンクしてくださいはちょっと困ります＾＾；
申し込むときは相手先のリンクを設置してから申し込むのが
暗黙のルールだと思いますよ～。
申し込むときは相手先のリンクを設置してから申し込むのが
暗黙のルールだと思いますよ～。
- トラックバックURLはこちら
favorite
Translation Language
多言語変換Blog search
サイト内検索app検索（apptrackr）
カスタム検索
Goods store
【１位】【商品数約10000!携帯グッズのストラップヤ】
なんといっても品数と種類が豊富！私のお気に入りNo.1。まずはここでチェックです♪
【２位】Gizmobies(ギズモビーズ)
選べるデザイン100種以上、選ぶセンスで個性をアピール！iPodが、iPhoneがモテ系アイテムに早変わりする噂のドレスアップアイテムはこちら
【３位】サンワダイレクト（iPhone 3Gサプライ製品）
かなりの商品数で見やすいサイトです。選びやすく言うことなし。周辺機器なども多数あります
questionnaire
オススメGoodsその２
デザインGP受賞のこのデザイン
【詳細を見る】
  お風呂で使えるスピーカー  |
  |
 |
  |
Archive
Favorite links
Recent entry
(10/20)
(09/25)
(09/22)
(08/21)
(08/20)
(08/17)
(07/30)
(07/13)
(06/16)
(06/11)
Profile
Pod狂会:会長(suneipu)
所持pod:iphone 4
iOS4.3.3
redsn0w使いです。
相互リンク募集中です！
お申し込みはコチラから。
Twitterブログパーツ
Analyze
