2005年08月30日
Blog(ブログ)カスタマイズ(サイドバー内記事の左揃え、オレンジの矢印の表示)
ご質問の件、簡単ですが解説してみます。
続きを読む前に、
ワンクリックの応援をよろしくお願い致します。m(_ _)m
→人気Blogランキングへ
このBlog(ブログ)で利用しているテンプレートのCSSに以下の記述があります。
.side,.avatar,.quote,.profbody{
font-size:x-small;
text-align:center;
line-height:125%;
padding:10px;
border:solid #f90;border-width:0 1px;
background:#fff;
}
この青字の部分が、サイドバー内の記事は中央揃えにしますという定義です。
つまり、普通に記事を書けば中央揃えになるという事です。
これを左揃えにする為には、いろんな方法が考えられますが、私は、以下の様にしています。
■当Blog(ブログ)のプラグイン(99%返信します!)の場合
<div align="left">
ご意見・ご感想・ご質問等をお待ちしております。<!--フォームズ--><a href="http://www.formzu.jp/formgen.cgi?ID=c2484214" target="_blank"><b>こちら</b> </a>のフォームからお気軽にどうぞ。<!--フォームズ--></div>
たった、これだけの追加(青字の部分)です!
ねっ、簡単でしょ!
それと、もう1つありましたね。
同様、CSSに以下の記述があります。
.sidebody{
margin-bottom:5px;
padding-left:20px;
background:url(https://parts.blog.livedoor.jp/img/usr/3c_orange/icon01.gif) no-repeat 0 0;
text-align:left;
}
この青字の部分が、オレンジの矢印を表示する定義です。
これも、いろんな方法が考えられますが、私は、以下の様にしています。
■当Blog(ブログ)のプラグイン(私おくまんのバイブル)の場合
<b><font color="red">24,800円で購入できるのは
</font></b><br />
<b><font color="red">8月31日まで!<br />
</font></b><br />
<div class="sidebody">
<a href="http://www.japanpower.biz/success/index.html" target="_blank">≪ 1億人e-収入革命 ≫</a> <br />
└ <b><font color="red">紹介ID:「972」</font></b></div>
<div align="left">
私が活用している、<br />
市川哲也氏のe-Bookです<br />
関連記事は<a href="http://okuman7.livedoor.biz/archives/cat_50000212.html">こちら</a></div>
<br/>
<img src="http://livedoor.blogimg.jp/okuman7/imgs/0/8/08f24ac3.jpg" alt="1億人 e - 収入革命" border="0" />
たった、これだけの追加(青字の部分)です!
ねっ、簡単でしょ!
カスタマイズは自己責任でお願いしますね。
わからない場合は、お気軽にご質問下さい。
ぜひ、このブログの応援をお願い致します。
人気Blogランキングへ
Tweet
ワンクリックの応援をよろしくお願い致します。m(_ _)m
→人気Blogランキングへ
このBlog(ブログ)で利用しているテンプレートのCSSに以下の記述があります。
.side,.avatar,.quote,.profbody{
font-size:x-small;
text-align:center;
line-height:125%;
padding:10px;
border:solid #f90;border-width:0 1px;
background:#fff;
}
この青字の部分が、サイドバー内の記事は中央揃えにしますという定義です。
つまり、普通に記事を書けば中央揃えになるという事です。
これを左揃えにする為には、いろんな方法が考えられますが、私は、以下の様にしています。
■当Blog(ブログ)のプラグイン(99%返信します!)の場合
<div align="left">
ご意見・ご感想・ご質問等をお待ちしております。<!--フォームズ--><a href="http://www.formzu.jp/formgen.cgi?ID=c2484214" target="_blank"><b>こちら</b> </a>のフォームからお気軽にどうぞ。<!--フォームズ--></div>
たった、これだけの追加(青字の部分)です!
ねっ、簡単でしょ!
それと、もう1つありましたね。
同様、CSSに以下の記述があります。
.sidebody{
margin-bottom:5px;
padding-left:20px;
background:url(https://parts.blog.livedoor.jp/img/usr/3c_orange/icon01.gif) no-repeat 0 0;
text-align:left;
}
この青字の部分が、オレンジの矢印を表示する定義です。
これも、いろんな方法が考えられますが、私は、以下の様にしています。
■当Blog(ブログ)のプラグイン(私おくまんのバイブル)の場合
<b><font color="red">24,800円で購入できるのは
</font></b><br />
<b><font color="red">8月31日まで!<br />
</font></b><br />
<div class="sidebody">
<a href="http://www.japanpower.biz/success/index.html" target="_blank">≪ 1億人e-収入革命 ≫</a> <br />
└ <b><font color="red">紹介ID:「972」</font></b></div>
<div align="left">
私が活用している、<br />
市川哲也氏のe-Bookです<br />
関連記事は<a href="http://okuman7.livedoor.biz/archives/cat_50000212.html">こちら</a></div>
<br/>
<img src="http://livedoor.blogimg.jp/okuman7/imgs/0/8/08f24ac3.jpg" alt="1億人 e - 収入革命" border="0" />
たった、これだけの追加(青字の部分)です!
ねっ、簡単でしょ!
カスタマイズは自己責任でお願いしますね。
わからない場合は、お気軽にご質問下さい。
ぜひ、このブログの応援をお願い致します。
人気Blogランキングへ
★この記事をツイッターにRTする!
【まぐまぐ公認!】 殿堂入りメールマガジン
トラックバックURL
この記事にコメントする