2008'05.16.Fri
:
トラックバック(-)
コメント(-) ▲
TMP*blog
・FC２ブログテンプレートの作成＆配布と少しの雑記 ・
2006'08.21.Mon
以前に書いたドリコムRSSのブログリスト用のスタイルシートの記事なんですけども、装飾の他に表示部分にスクロールバーをつけたいとのご質問をよく頂戴するので、方法を書いておきます。
まずはこの記事に書いてあるように<div class="drecom">の追加を行って下さい。
（既にこの作業が終わっている方は、下のスタイルシートの追加のみでOKです）
divの追加が終わったら、以下のスタイルシートを追加して下さい。
赤文字部分が高さになりますので、好きなように変更して下さいませ。内容が設定した高さより少ないとリストの下に空白が出来ますので、ブログリストの内容がまだ少ない場合は適当に調節してください。
２００〜３００くらいがちょうど宜しいのではないかと思います。
他の装飾がいらない場合は上のスタイルシートの追加だけでOKです。
（ただしdivで囲む作業は必要です）
まずはこの記事に書いてあるように<div class="drecom">の追加を行って下さい。
（既にこの作業が終わっている方は、下のスタイルシートの追加のみでOKです）
divの追加が終わったら、以下のスタイルシートを追加して下さい。
div.drecom {
height: 200px;
overflow: auto;
}
赤文字部分が高さになりますので、好きなように変更して下さいませ。内容が設定した高さより少ないとリストの下に空白が出来ますので、ブログリストの内容がまだ少ない場合は適当に調節してください。
２００〜３００くらいがちょうど宜しいのではないかと思います。
他の装飾がいらない場合は上のスタイルシートの追加だけでOKです。
（ただしdivで囲む作業は必要です）
2006'08.14.Mon
前にやったドリコムブログリストの装飾ですが
さらにこれにスクロールバーを付けたい、とのことで。
（上記の記事内容をやってあることが前提です）
必要なのはスタイルシートの追加のみです
これだけ追加すればOKです
前に紹介した通りにdivで囲んであれば、このスタイルシートを追加するだけでスクロールバーがつくはずです。
height: 250pxは適当です（汗）これがスクロールバー表示部分の高さになりますので、お好みで設定してください。
また、表示内容より設定した高さのほうが広かった場合。スクロールバーはつかずに下に空白ができてしまいますので、内容が少ない場合は小さめの数字がいいと思います。２００くらいがちょうどいいのかな？
ところで…FC2ブログ新機能のタグのリストは記事の下部に表示できるようにしたほうがよろしいとです（・ω・｀？
（タグ機能でサブカテゴリーを作ろうと思ったんですけど…タグつけるのがめんどくさい…orz）
さらにこれにスクロールバーを付けたい、とのことで。
（上記の記事内容をやってあることが前提です）
必要なのはスタイルシートの追加のみです
div.drecom{
height: 250px;
overflow: auto;
padding-right: 3px;
}
これだけ追加すればOKです
前に紹介した通りにdivで囲んであれば、このスタイルシートを追加するだけでスクロールバーがつくはずです。
height: 250pxは適当です（汗）これがスクロールバー表示部分の高さになりますので、お好みで設定してください。
また、表示内容より設定した高さのほうが広かった場合。スクロールバーはつかずに下に空白ができてしまいますので、内容が少ない場合は小さめの数字がいいと思います。２００くらいがちょうどいいのかな？
ところで…FC2ブログ新機能のタグのリストは記事の下部に表示できるようにしたほうがよろしいとです（・ω・｀？
（タグ機能でサブカテゴリーを作ろうと思ったんですけど…タグつけるのがめんどくさい…orz）
2006'08.06.Sun
利用サービスFeedBurner
相変わらず見本はウチのブログのサイドバーにある（汗）
「TANU-Chihuahua」というところ。これ、わたしがやってるもう一個のワンコブログの記事内容です。（更新あんましてないから今は表示してる意味薄いですが…orz）
こんなかんじで他のブログの記事内容をサイドバーに簡単に設置できるサービスがあります。
それがFeedBurner。
そもそもはRSSフィードを作ってもらえるサービスで、わたしもそれが目的でお借りしていたんですけども、何個ブログを作ろうとやはり人に見てもらいたい欲もでてまいります（笑）でも何個もブログみるのも大変ですよねーって事で、基本となるブログにこの「他ブログの記事内容」を表示してみたらどうかなと。基本ブログにくれば更新されているかどうかわかるってなかんじで。
あとただリンク貼っとくよりも、どんな内容のサイトなのかわかりやすいって利点もあるきがします。
使い方は簡単で、まずはFeedBurnerに自分のブログのRSSを登録。
（１つのアカウントで複数ブログの管理ができます）
フィードの管理で「集客支援」＞「バズ・ブースト」
ここで記事表示用のタグがもらえますので、これをプラグインのフリーエリアに放り込むだけです（・ω・
記事のタイトルを表示するか、時間を上下どこに表示するか等、いろいろ設定できます。
あとは装飾と整形なんですが。
元々記事の書き出され方がリスト形式なので、リスト形式の装飾スタイルシートを定義してあるテンプレートであれば、なにもしなくてもある程度見た目の統一感はでると思います。
（色や文字のサイズが他のサイドバーのメニューと同じになるかんじで）
日付と記事タイトルを太くすると見やすいかなーと言うのと、あとは縦に長くなりがちなのでウチではスクロールバーをつけました。修正はその程度です。
ウチのテンプレートでつかうならこれだけ設定すれば十分かもです。（他テンプレートはどういう設定になっているかわからないもので）
今ウチで使っているFeedBurner用のスタイルシートが以下になります。使う方がいましたらご自由にドウゾ。
（ほんっと少しだけ整形もしてありますね、よくみたら・笑）
/*-- フィード --*/
div.feedburnerFeedBlock{
height: 200px;
overflow: auto;
padding: 0 10px 0 0;
}
div.feedburnerFeedBlock p.date{
font-weight : bold;
}
span.headline{
font-weight : bold;
}
スクロールバーをつけたくない人は赤文字の部分を削除すれば内容すべてが通常表示（スクロールバーがなくなるだけ）になります。
height: 200px;
これが表示する長さの設定。この長さを越えるとスクロールバーがでます。
ここの太字部分の数字は好きな数字に変更可能。長くしたい人は数字を大きく。短くしたい人は数字を小さくしてください。
スタイルシートがわかる方なら、FeedBurnerにほんと細かくクラスが付けられているカスタマイズ見本（？）がありますのでそっちを見たほがいいかな？
けっこう便利で使ってますのでご紹介。
表示を記事タイトルのみとかにも出来るのでうまく使えば更新履歴とかにも使えそう？（ブログの更新履歴のためにブログもういっこ借りるのもナニですが）
相変わらず見本はウチのブログのサイドバーにある（汗）
「TANU-Chihuahua」というところ。これ、わたしがやってるもう一個のワンコブログの記事内容です。（更新あんましてないから今は表示してる意味薄いですが…orz）
こんなかんじで他のブログの記事内容をサイドバーに簡単に設置できるサービスがあります。
それがFeedBurner。
そもそもはRSSフィードを作ってもらえるサービスで、わたしもそれが目的でお借りしていたんですけども、何個ブログを作ろうとやはり人に見てもらいたい欲もでてまいります（笑）でも何個もブログみるのも大変ですよねーって事で、基本となるブログにこの「他ブログの記事内容」を表示してみたらどうかなと。基本ブログにくれば更新されているかどうかわかるってなかんじで。
あとただリンク貼っとくよりも、どんな内容のサイトなのかわかりやすいって利点もあるきがします。
使い方は簡単で、まずはFeedBurnerに自分のブログのRSSを登録。
（１つのアカウントで複数ブログの管理ができます）
フィードの管理で「集客支援」＞「バズ・ブースト」
ここで記事表示用のタグがもらえますので、これをプラグインのフリーエリアに放り込むだけです（・ω・
記事のタイトルを表示するか、時間を上下どこに表示するか等、いろいろ設定できます。
あとは装飾と整形なんですが。
元々記事の書き出され方がリスト形式なので、リスト形式の装飾スタイルシートを定義してあるテンプレートであれば、なにもしなくてもある程度見た目の統一感はでると思います。
（色や文字のサイズが他のサイドバーのメニューと同じになるかんじで）
日付と記事タイトルを太くすると見やすいかなーと言うのと、あとは縦に長くなりがちなのでウチではスクロールバーをつけました。修正はその程度です。
ウチのテンプレートでつかうならこれだけ設定すれば十分かもです。（他テンプレートはどういう設定になっているかわからないもので）
今ウチで使っているFeedBurner用のスタイルシートが以下になります。使う方がいましたらご自由にドウゾ。
（ほんっと少しだけ整形もしてありますね、よくみたら・笑）
/*-- フィード --*/
div.feedburnerFeedBlock{
height: 200px;
overflow: auto;
padding: 0 10px 0 0;
}
div.feedburnerFeedBlock p.date{
font-weight : bold;
}
span.headline{
font-weight : bold;
}
スクロールバーをつけたくない人は赤文字の部分を削除すれば内容すべてが通常表示（スクロールバーがなくなるだけ）になります。
height: 200px;
これが表示する長さの設定。この長さを越えるとスクロールバーがでます。
ここの太字部分の数字は好きな数字に変更可能。長くしたい人は数字を大きく。短くしたい人は数字を小さくしてください。
スタイルシートがわかる方なら、FeedBurnerにほんと細かくクラスが付けられているカスタマイズ見本（？）がありますのでそっちを見たほがいいかな？
けっこう便利で使ってますのでご紹介。
表示を記事タイトルのみとかにも出来るのでうまく使えば更新履歴とかにも使えそう？（ブログの更新履歴のためにブログもういっこ借りるのもナニですが）
2006'08.01.Tue
ドリコムＲＳＳのブログリスト、使ってみたらデフォルトだとカテゴリーとリンクが混ざって非常に見難かったので…。
自分も使う事だしとドリコム用のスタイルシートを組みました。
ちょっとＨＴＭＬタグの追加もいるんですが、プラグインのみでいいので。
（プラグインを使ってる事を前提で話してますが、使ってない場合も同様にタグを追加するだけです）
まずプラグインの修正。
プラグインで追加したドリコムブログリストのタグを
次に以下のスタイルシートを追加します。
相変わらず色は適当なので好きな色に変えてください。
見本はいまウチで表示してるブログリストです。
ドリコムのほうの設定で、表示を「ブログ名」のみにしておくとスッキリしていいかもしれないです。日付とか時間も表示する場合はdrecomrss_blog_list_itemのとこのボーダー表示しないほうがいいかもしれません。とりあえずはお好みでどうぞ。
文字の色は設定してませんので、それぞれお使いのテンプレートの設定色と同じになります。
自分も使う事だしとドリコム用のスタイルシートを組みました。
ちょっとＨＴＭＬタグの追加もいるんですが、プラグインのみでいいので。
（プラグインを使ってる事を前提で話してますが、使ってない場合も同様にタグを追加するだけです）
まずプラグインの修正。
プラグインで追加したドリコムブログリストのタグを
こんなかんじに赤い部分のタグで囲みます。プラグインの修正はこれで終了です。<div class="drecom">
ココはドリコムで配布されたタグを入れます
</div>
次に以下のスタイルシートを追加します。
以上で完了です。/*-- ドリコムＲＳＳ --*/
div.drecom br {
line-height: 0px;
}
.drecomrss_blog_list_category {
font-weight:bold;
display:block;
margin: 3px 0;
background: #eee;
}
.drecomrss_blog_list_item {
display:block;
padding: 2px 0 2px 12px;
font-size: 10px;
line-height: 130%;
border-bottom: 1px dotted #ccc;
}
.drecomrss_blog_list_powered {
display:block;
border-top: 1px dotted #ccc;
margin-top: 5px;
}
相変わらず色は適当なので好きな色に変えてください。
見本はいまウチで表示してるブログリストです。
ドリコムのほうの設定で、表示を「ブログ名」のみにしておくとスッキリしていいかもしれないです。日付とか時間も表示する場合はdrecomrss_blog_list_itemのとこのボーダー表示しないほうがいいかもしれません。とりあえずはお好みでどうぞ。
文字の色は設定してませんので、それぞれお使いのテンプレートの設定色と同じになります。
2006'07.30.Sun
tmp_wblue_boo用のインフォメーションエリアを作るタグ部品です。
他ブログとは少し仕様が違うのでブタテンプレート専用になってます。他テンプレート用も後日追加しますので少々お待ち下さい。これ以外のカスタマイズについても徐々に追加したいと思いますので、申し訳ありませんがそれについてもお待ち頂ければ幸いです<(_ _)>
また、少しカスタマイズについてまとめるつもりの為、現在１ページだけのHTMLページとしておいてある状態です。（しかもかなり適当な作りで…orz）
色々ご不便おかけしますが宜しければお使い下さい。
tmp_wblue_boo用インフォメーションエリアの作り方ページ
他ブログとは少し仕様が違うのでブタテンプレート専用になってます。他テンプレート用も後日追加しますので少々お待ち下さい。これ以外のカスタマイズについても徐々に追加したいと思いますので、申し訳ありませんがそれについてもお待ち頂ければ幸いです<(_ _)>
また、少しカスタマイズについてまとめるつもりの為、現在１ページだけのHTMLページとしておいてある状態です。（しかもかなり適当な作りで…orz）
色々ご不便おかけしますが宜しければお使い下さい。
tmp_wblue_boo用インフォメーションエリアの作り方ページ
TMP*blogはFC２ブログの共有テンプレート配布と作成、それとちょっとした雑記のブログです。どうぞよしなに！
＊テンプレートのテストもここでやってますので時々表示がコロコロ変わったりおかしくなったり致しますがご了承下さい。
-
管理人・ころ
米とエクレアをこよなく愛す人。
FC２ブログはまだまだ初心者ですが、テンプレとか作るの大好きなので挑戦中。独特のタグの群れに頭抱えてます。
《こゆきちゃん捜索にご協力を》
同じ犬を飼う者として
＊ Template by
