Powered By FC2ブログ
ブログやるならFC2ブログ
今すぐブログを作っちゃおう!

--年--月--日

スポンサーサイト

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

2007年01月29日

FC2ブログ用テンプレートの、コメント欄の投稿者リンクを修正

ひばりさんよりご指摘いただいて気が付いたんですが、コメントフッター部分の投稿者リンクの方法が間違っていたようです。もちろん表示などには問題ありませんが、気になる方は、FC2ブログテンプレートの修正をお願いいたします。

1.FC2ブログテンプレートの修正部分

修正箇所は次になります。


<div class="comment-footer">
投稿者:<a href="<%comment_url>"><%comment_name></a>
| 投稿日:<%comment_month>月<%comment_day>日(<%comment_hour>:<%comment_minute>)
| <a href="<%comment_edit_link>" title="コメント編集のページへ">編集</a>
</div><!-- comment-footer -->

次のように変更して下さい。


<div class="comment-footer">
投稿者:<%comment_url+name> 
| 投稿日:<%comment_month>月<%comment_day>日(<%comment_hour>:<%comment_minute>)
| <a href="<%comment_edit_link>" title="コメント編集のページへ">編集</a>
</div><!-- comment-footer -->

FC2で使用できる変数をよく理解できていなかったようです。また、この変数自体がFC2のブロック変数一覧にも載っていなかったりします。機能はしますので、これで問題は無いと思います。(メールアドレスリンクもあるんですが、メールアドレスを記入することはまず無いと思いますので設定していません)

2.FC2テンプレート変数一覧表

検索して見つけた隠し変数はこちらで紹介されています。公式のFC2変数一覧よりも便利で使いやすいので、本格的にカスタマイズする場合や、FC2ブログ用のテンプレートを作成する際にご利用下さい。

FC2テンプレート変数一覧表 ( それは仕様?様 )

スポンサーサイト

2006年12月23日

テーブル内のフォントサイズと色の指定

「画像の下にいれた文字のサイズが大きくなる」、という質問を頂いたんですが、考えられるのは画像をテーブル内に配置する場合です。
以前にエントリしていますが、テーブルは使い方が単純ではないので、あえて何もスタイルシートで設定していません。
ですので、文字サイズはブラウザの標準サイズになりますので、たいていは大きくなってしまいます。

特に深く考えない場合は、メイン部分で使用するテーブル全てに対してスタイルシートを適用すれば簡単です。


#box-main img{
margin-right: 16px;
margin-bottom: 16px;
}

#box-main ul{
margin: 10px 0 10px 16px;
line-height: 175%;
}

#box-main table{
font-size: 12px;
color: #000;
}

/* メイン部分 */

赤色の部分をできればこの場所に追加してください。これでテーブルを使用しても、他のテキストと同様に12pxサイズのフォントで表示されます。

また、この場合はメイン部分だけの指定になりますので、ブログ全体で同じサイズ(12px)で表示したい、という場合は以下になります。


.section{
}

table{
font-size: 12px;
color: #000;
}

/*    基本的な設定    */

この場所だけに追加すれば大丈夫です。先ほどの部分の追加は必要ありません。
テーブルを画像組みや、簡単な表でしか使わない場合は、このスタイルシートを追加してしまったほうがよいかもしれません。

これでも画像の下のフォントサイズが治らない場合は、再現していただかないと原因がわかりかねます。

2006年12月02日

ブログ全体のサイズをカスタマイズしてみた例

前回の、ブログ全体のサイズをカスタマイズするの続きです。実際にブログ全体のサイズを変更した例を紹介します

このテンプレートの左右カラムは非対称です。基本的に、左が記事やリンク、コメントなどで、右カラムに画像などの広告やランキングを貼り付けることを想定しています。
ただ、使用目的によって最適なサイズは異なると思いますので、このエントリを参考に最適なサイズで運用してみて下さい。

1.左右カラムが190pxで、エントリ部分が500px

最初は簡単な変更で。左右カラムのサイズを揃えてみましょう。それ以外は標準です。

15
a
190
b
10
c
500
d
10
e
190
f
15
g

構成はこのようになります。計算してみましょう。

15+190+10+500+10+190+15=930px
930-(15+15)=900px(左右マージンを引く)
190+10+500=700px(=左ボックス)
900-700=200px(=右カラム+スペース)
最初に計算してみて、サイズに間違いがないか必ず確認してください。

2.スタイルシートの変更

変更しているのは、左ボックス、左カラム、右カラムですので、その部分のスタイルシートを変更すればいいことになります。


#box-left{
float: left;
width: 700px;
}

#box-sub{
float: left;
width: 190px;
}

#box-right{
float: right;
width: 190px;
}

カスタマイズ
変更した画面です。ちょっとわかりにくいですが、ちゃんと変更されています。実はサイズの変更なら、こんなに簡単です。ただしサイズを変更した場合、HTML部分に変更したサイズよりも大きいもの(画像など)が無いようにしてください。特にエントリ部分のサイズを変更すると、修正はエントリ本文になりますので注意してください。

3.その他の変更例

ちょっと変なサイズにしてみます。計算さえあっていれば、サイズの変更はどのようにでもなります。

左カラム300px、エントリ部分400px、右カラム180px

スペースは変更無しです。変更箇所はこちら。


#box{
width: 930px;
margin-right: auto;
margin-left: auto;
border: solid 1px #000;
}

#box-margin{
margin: 0 15px;
}

#box-left{
float: left;
width: 710px;
}

#box-right{
float: right;
width: 180px;
}

#box-main{
float: right;
width: 400px;
}

#box-sub{
float: left;
width: 300px;
}

カスタマイズ
画像はこのようになります。エントリ上部のボックスも変更されますので、フリーエリアはそのままで大丈夫です。変更箇所はこれだけで済みます。

4.変態なカスタマイズ

極端な例であって、止めた方がいいですよw


#box{
width: 930px;
margin-right: auto;
margin-left: auto;
border: solid 1px #000;
}

#box-margin{
margin: 0 15px 0 25px;
}

#box-left{
float: left;
width: 400px;
}

#box-right{
float: right;
width: 450px;
}

#box-main{
float: right;
width: 300px;
}

#box-sub{
float: left;
width: 80px;
}

カスタマイズ
計算があっていれば、このようなことも可能です。

5.カスタマイズの注意点

  • 全体のサイズも変更できますが、上部のフリーエリアのサイズも変更しないと小さくすることは出来ません。
  • エントリ部分を小さくした場合、コメントなどのフォームが崩れるかもしれません(未確認)
  • エントリ本文やHTML部分に、スタイルシートで変更したサイズ以上のもの(画像など)がある場合には、カラム落ちやサイズの変更不良がおこります。

以上でサイズ変更の解説は終わりです。計算さえ合っていれば、数箇所の変更だけでブログ全体のサイズを好きにカスタマイズできます。好きなサイズに変更してみてください。

2006年10月07日

「使えて+いじれる」FC2ブログテンプレートにようこそ

「使えて+いじれる」FC2ブログテンプレートにお越しいただきましてありがとうございます。
こちらでは、FC2ブログ用のテンプレートの配布、及びカスタマイズの方法についてご紹介していく予定です。フリーエリアを多く含むテンプレートのため、カスタマイズし易い反面、カスタマイズ初心者の方には多少難しい部分もあるかと思います。

後ほど、フリーエリアのサイズ変更やタグの貼り付け方法、リンクやタイトル部分の色の変更方法などについて解説していきますので、しばらくお待ち下さい。

プロフィール

templatetube

Author:templatetube
FC2ブログへようこそ!

最近の記事
最近のコメント
最近のトラックバック
月別アーカイブ
カテゴリー
ブロとも申請フォーム

Appendix


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