『02Tシリーズ』プラグインメニュー(サイドバー)の位置を右から左に変えたい |
||
せっかくお気に入りのテンプレートを発見しても、プラグインメニューの位置が気に入らなければ、使いもんにならなくなってしまいますよね。
そんな人のために('∀`)
スポンサードリンク
【テンプレートの設定】→【02T_White(の編集をクリック)】→【02T_White のHTML編集】を見てください。
①、02T_White のHTML編集をしていきます。
<div id="left">
</div><!--/left-->
<br class="c-both" />
</div><!--/left_center-->
<div id="right">
<!--index_area-->
<!--/index_area-->
<!--▼▼ プラグイン カテゴリー1 ▼▼-->
<!--plugin-->
<!--plugin_first-->
<div class="plugin1_outline">
<div class="plugin1_title ta_<%plugin_first_talign>"><%plugin_first_title></div>
<div class="plugin1_body ta_<%plugin_first_align>">
<!--plugin_first_description-->
<div class="p1u_description ta_<%plugin_first_ialign>"><%plugin_first_description></div>
<!--/plugin_first_description-->
<%plugin_first_content>
<!--plugin_first_description2-->
<div class="p1d_description ta_<%plugin_first_ialign>"><%plugin_first_description2></div>
<!--/plugin_first_description2-->
</div><!--/plugin1_body -->
</div><!--/plugin1_outline-->
<!--/plugin_first-->
<!--/plugin-->
<!--▲▲ プラグイン カテゴリー1 ▲▲-->
<!--▼▼ プラグイン カテゴリー2 ▼▼-->
<!--plugin-->
<!--plugin_second-->
<div class="plugin2_outline">
<div class="plugin2_title ta_<%plugin_second_talign>"><%plugin_second_title></div>
<div class="plugin2_body ta_<%plugin_second_align>">
<!--plugin_second_description-->
<div class="p2u_description ta_<%plugin_second_ialign>"><%plugin_second_description></div>
<!--/plugin_second_description-->
<%plugin_second_content>
<!--plugin_second_description2-->
<div class="p2d_description ta_<%plugin_second_ialign>"><%plugin_second_description2></div>
<!--/plugin_second_description2-->
</div><!--/plugin2_body-->
</div><!--/plugin2_outline-->
<!--/plugin_second-->
<!--/plugin-->
<!--▲▲ プラグイン カテゴリー2 ▲▲-->
</div><!--/right-->
こんな箇所があると思います。
これらを以下の記述のように書き換えてください。
<div id="left">
<!--▼▼ プラグイン カテゴリー1 ▼▼-->
<!--plugin-->
<!--plugin_first-->
<div class="plugin1_outline">
<div class="plugin1_title ta_<%plugin_first_talign>"><%plugin_first_title></div>
<div class="plugin1_body ta_<%plugin_first_align>">
<!--plugin_first_description-->
<div class="p1u_description ta_<%plugin_first_ialign>"><%plugin_first_description></div>
<!--/plugin_first_description-->
<%plugin_first_content>
<!--plugin_first_description2-->
<div class="p1d_description ta_<%plugin_first_ialign>"><%plugin_first_description2></div>
<!--/plugin_first_description2-->
</div><!--/plugin1_body -->
</div><!--/plugin1_outline-->
<!--/plugin_first-->
<!--/plugin-->
<!--▲▲ プラグイン カテゴリー1 ▲▲-->
<!--▼▼ プラグイン カテゴリー2 ▼▼-->
<!--plugin-->
<!--plugin_second-->
<div class="plugin2_outline">
<div class="plugin2_title ta_<%plugin_second_talign>"><%plugin_second_title></div>
<div class="plugin2_body ta_<%plugin_second_align>">
<!--plugin_second_description-->
<div class="p2u_description ta_<%plugin_second_ialign>"><%plugin_second_description></div>
<!--/plugin_second_description-->
<%plugin_second_content>
<!--plugin_second_description2-->
<div class="p2d_description ta_<%plugin_second_ialign>"><%plugin_second_description2></div>
<!--/plugin_second_description2-->
</div><!--/plugin2_body-->
</div><!--/plugin2_outline-->
<!--/plugin_second-->
<!--/plugin-->
<!--▲▲ プラグイン カテゴリー2 ▲▲-->
</div><!--/left-->
<br class="c-both" />
</div><!--/left_center-->
<div id="right">
<!--index_area-->
<!--/index_area-->
</div><!--/right-->
②、次に02T_White1 のスタイルシート編集します。
/******************************************* ▼ サイトの幅 ▼ */
#outline {
min-width:1050px;
width:100%; /* 全体 */
margin:0 auto;
}
#outline_main {
width:1050px; /* 全体 */
margin:0 auto;
}
#center {
width:735px; /* 中央 */
float:right;
}
#left {
width:0px; /* 左 */
float:left;
}
#right {
width:305px; /* 右 */
float:right;
}
#center-left { /* 計算して設定してください ------ */
width:735px; /* (全体-左-中央-右)/2 + 左 + 中央 */
float:left;
}
/******************************************* ▲ サイトの幅 ▲ */
上記の記述を以下のように書き換えてください。
/******************************************* ▼ サイトの幅 ▼ */
#outline {
min-width:1050px;
width:100%; /* 全体 */
margin:0 auto;
}
#outline_main {
width:1050px; /* 全体 */
margin:0 auto;
}
#center {
width:735px; /* 中央 */
float:right;
}
#left {
width:305px; /* 左 */
float:left;
}
#right {
width:0px; /* 右 */
float:right;
}
#center-left { /* 計算して設定してください ------ */
width:1045px; /* (全体-左-中央-右)/2 + 左 + 中央 */
float:left;
}
/******************************************* ▲ サイトの幅 ▲ */
これで、プラグインメニュー(サイドバー)を右から左、あるいは左から右に変えることだって可能になりますね。
- 関連記事
-
- 【スマホ】ドロップダウンメニューバーを作成したい
- 関連記事リストを任意の場所に表示したい
- 「続きを読む」を画像に変えたい
- 『02Tシリーズ』3カラムにしたい(サイドバー2つ)
- 『02Tシリーズ』プラグインメニュー(サイドバー)の位置を右から左に変えたい
- プラグイン3を記事の上に常に表示したい
- ブログタイトル名を画像に変更したい
- ブログの幅、プラグインエリアの幅を変更したい
- 記事毎のサムネ画像を消したい