<< 彼についての一考察 | main | 0の位置 >>

#2007.04.20 Friday    スポンサーサイト

一定期間更新がないため広告を表示しています


| - | - |

#2007.01.12 Friday    三日月ショコラーデ
「もうすぐバレンタイン」とか知人に言われて、目ん玉ひん剥きました。
もうそんな季節か……

ということで、バレンタインと関係ありそうでなさそうなテンプレを急ごしらえ。


【三日月ショコラーデ】



右2カラム。
リネン系は好きって方が多いみたいなので。微妙に使いまわし。

→SAMPLE
→DOWNLOAD


(2007.01.12 ver1.0)


【追記】
・このテンプレをロリポブログでご使用なさる場合
・このテンプレにカレンダーを挿入したい場合
について、下にその方法を書いておきました。参考になさってください。


.


◆このテンプレをロリポブログでご使用の場合

このテンプレをロリポブログでご使用の場合は、htmlを多少変更していただく必要があります(jugemの独自タグを使用しているため)。
方法は以下になります。


html内に、

<h3><img src="http://img-cdn.jg.jugem.jp/54b/2458/20070112_275147.png" border="0" /></h3>
<!-- BEGIN category -->
<ul><!-- BEGIN category_items -->
<li><a href="./?cid={category_item_id}">{category_item_name}</a></li><!-- END category_items -->
</ul>
<!-- END category -->

<h3><img src="http://img-cdn.jg.jugem.jp/54b/2458/20070112_275144.png" border="0" /></h3>
<!-- BEGIN archives -->
<ul><!-- BEGIN archives_items -->
<li><a href="./?month={archives_item_id}">{archives_item_eng}</a></li><!-- END archives_items -->
</ul>
<!-- END archives -->



<!-- BEGIN recent_comment -->
<h3><img src="http://img-cdn.jg.jugem.jp/54b/2458/20070112_275148.png" border="0" /></h3>
<ul><!-- BEGIN recent_comment_items -->
<li><a href="./?eid={recent_comment_item_entry_id}#comments">{recent_comment_item_title} : {recent_comment_item_name} ({recent_comment_item_date})</a></li><!-- END recent_comment_items -->
</ul>
<!-- END recent_comment -->



というタグがhtmlの中にありますので、
これを


<h3><img src="http://img-cdn.jg.jugem.jp/54b/2458/20070112_275147.png" border="0" /></h3>
<!-- BEGIN category -->
{category_list}
<!-- END category -->

<h3><img src="http://img-cdn.jg.jugem.jp/54b/2458/20070112_275144.png" border="0" /></h3>
<!-- BEGIN archives -->
{archives_list}
<!-- END archives -->

<!-- BEGIN recent_comment -->
<h3><img src="http://img-cdn.jg.jugem.jp/54b/2458/20070112_275148.png" border="0" /></h3>
{recent_comment_list}
<!-- END recent_comment -->



↑こちらのタグと置き換えてください。
なお、都合上、ここではタグの<>を全て、全角の<>で表示しています。
コピペなさる際は、メモ帳の「すべて置換」機能などを使って、半角の<>にしてください。




◆このテンプレにカレンダー機能を追加する場合

htmlとCSSに少しタグを追加していただく必要があります。

まずhtml編集で、
<div id="SIDE">
<h2>contents</h2>
と書いてある部分があると思いますので、そのすぐ下に

<!-- BEGIN calendar -->
<div class="calendar">
<table border="0" cellspacing="1" cellpadding="0"><tr><td class="weekday">S</td><td class="weekday">M</td><td class="weekday">T</td><td class="weekday">W</td><td class="weekday">T</td><td class="weekday">F</td><td class="weekday">S</td></tr></table>
{calendar}
</div>
<!-- END calendar -->



↑このタグを付け加えてください。
(こちらも都合上、タグの<>を全角の<>で表示しています。
コピペなさる際、全て半角の<>に直してください)


それから、CSS編集で
/* CALENDAR------------------------------------------- */

.calendar {
font-size:10px;
font-family: "Verdana";
text-align:center;
line-height: 200%;
margin-bottom:30px;

}

.calendar table {
width:100%;
margin:0px auto;
text-align:center;
font-size: 10px;
line-height: 200%;
}

.weekday { padding: 2px;}
.cell { font-size:10px; padding: 2px ;}

.cell a {color:#ffa0ac;text-decoration:none;border-bottom:none;}
.cell a:link {color:#ffa0ac;text-decoration:none;border-bottom:none; font-weight: bolder;}
.cell a:visited {color:#ffa0ac;text-decoration:none;border-bottom:none;}
.cell a:active {color:#ffffff;text-decoration:none;border-bottom:none;}
.cell a:hover {color:#ffffff;text-decoration:none;border-bottom:none;}


このタグを付け加えてください。
これでカレンダーが表示されるようになると思います。

| template | comments(41) |

#2007.04.20 Friday    スポンサーサイト

| - | - |


comment



やま
テンプレかわいいです!
使わせていただいます★
ナツさんが新しいの作られるたびに変えてるな私・・。笑

こないだ年明けたと思ったら、もうバレンタインのこと考える時期
なんて、ほんとに早いですよねー。
来週くらいからちょこちょこバレンタインの会場がデバートなんか
だとでてくるんでしょうねぇ。



chie
ナツさん

もう素敵すぎです!!!!

可愛らしくて大好きです。
早速買えてしまいました。
ところで、この素材ってナツさんオリジナルですよね??
だとしたら、リネンやレースをお持ちなんですか?



はるか
はじめまして。以前からこっそりお邪魔させていただいております。
ナツさんのテンプレが大好きでして、ものぐさな私も
これからブログを始めてみようと思っております。

ところで、今回のテンプレにブログタイトルの下に
ブログの紹介文を入れたりすることってできませんか…?
もしよろしければ教えていただけると幸いです。
よろしくおねがいします!



ナツ
>やまさん

こんばんは。
テンプレ早速使っていただいてありがとうございます(´∀`)嬉しいです!

ほんと、やっと年が明けたのに、ドンドコ次のイベントが来ますねー。
一年のうちで一番ヒマなのって秋ですよね…。
またデパートがあちこちピンク色に飾られる時期なんですね。
デパートはチョコの特設売り場、畳1枚分のスペースで一億円稼げるとかいう噂ですが…。
凄いですよね…。



>chieさん

こんばんは。
テンプレお気に召していただけましたか?良かったです。
急いで作ったので詰めの甘い部分もあると思うのですが、
そう言っていただけて一安心です。

素材はですね、海外の、改変・再配布可の写真ダウンロードサイトで拾ってきて、
それを適当に切ったり繋ぎ合わせたりしてるものも多いです。
あとは自分で、画像ソフトでちょこちょこ作ったりとか。
だからよく見ると、結構荒い部分とかあったりしますw
俺自身はレースとか全然持ってないですよ、もちろん(笑)



>はるかさん

はじめまして!こんばんは。
以前からいらして頂いていたとのことで、なんだか緊張しますwありがとうございます。
ブログは楽しいですよー、この超絶飽き性な俺でも続けられるくらいですし!

ブログの紹介文を入れられる場合は、
CSSの編集で

div#HEADER p.text,hr.none,
div#MAIN h2, div#SIDE h2{display: none;}

という部分がわりと下のほうにあると思うのですが、
それを

div#HEADER hr.none,
div#MAIN h2, div#SIDE h2{display: none;}

と入れ替えてください。
そしてそこに、

div#HEADER p.text{
color: #333333;
text-align:right;
margin-right: 6em; background: transparent;
text-decoration: none;
margin-top:15px;}

このタグを付け加えていただくと、紹介文が表示されるようになると思います。

またいつでもいらしてくださいね!



チカ
はじめまして、チカと申します。
とってもステキなテンプレを発見できて、幸せです!
早速使わせていただきました!かわいいです〜vv
黒のリボンとリネン、レースのキュートさにクラクラ
しましたvv


それで…あの質問なのですが、右のフレーム(?)の
CategoryとArchivesが表示されません…(><)

ジュゲムはロリポップとも相互性があるということ
ですが、テンプレート自体がロリポップには対応して
いないのでしょうか?
もし打開策がありましたら教えてください!



ナツ
>チカさん

はじめまして、こんばんは。
テンプレ、ご趣味に合ったでしょうか?
お褒めいただけてとても光栄です(´∀`)


チカさんのブログはロリポブログなのですよね?
このテンプレにはjugemの独自タグを使用しているので、
ロリポブログでご使用なさる場合は、htmlを多少変更していただくことになります。

html編集で、

<h3><img src="http://zyniker.img.jugem.jp/20070112_275147.png" border="0" /></h3>
<!-- BEGIN category -->
<ul><!-- BEGIN category_items -->
<li><a href="./?cid={category_item_id}">{category_item_name}</a></li><!-- END category_items -->
</ul>
<!-- END category -->

<h3><img src="http://zyniker.img.jugem.jp/20070112_275144.png" border="0" /></h3>
<!-- BEGIN archives -->
<ul><!-- BEGIN archives_items -->
<li><a href="./?month={archives_item_id}">{archives_item_eng}</a></li><!-- END archives_items -->
</ul>
<!-- END archives -->


という部分があると思います。(htmlの真ん中あたりです)
そこを、

<h3><img src="http://zyniker.img.jugem.jp/20070112_275147.png" border="0" /></h3>
<!-- BEGIN category -->
{category_list}
<!-- END category -->

<h3><img src="http://zyniker.img.jugem.jp/20070112_275144.png" border="0" /></h3>
<!-- BEGIN archives -->
{archives_list}
<!-- END archives -->


このタグに置き換えてください。
なお、ここでは都合上、<>を全て全角の<>で書いていますので、
コピペなさる場合は<>を半角の<>に置き換えてください。

恐らくこれでロリポブログでもご使用いただけるようになると思いますので、
ぜひ試してみていただけると幸いです。
お手数おかけしますが、よろしくお願いいたします。



nao
ナツさん、初めましてです。
ナツさんの作るテンプレと、文に惹かれて、密かにファンだったりします☆

今、「グラリ、君に揺れて」を使わせて頂いています。
ありがとうございます♪♪
とっても可愛くてひと目惚れですv

「今夜、星屑の底で君と」もDLさせて頂いたのですが、
ロリポップのため、「三日月ショコラーデ」と同様CategoryとArchivesが表示されないんです。。
三日月ショコラーデ同じようにタグを置き換えてみたら、枠が消えてしまいました。
どうしたらロリポップでも上手く表示できるんでしょうか?

もしわかるようでしたら、教えてくれると嬉しいです。
よろしくお願いします(><)



ナツ
>naoさん

初めまして!
ファンだなんて勿体ないお言葉、もう滅相もないです。
まだまだまだまだまだ拙いテンプレばかりで…。
でもとても嬉しいです(´∀`)
ありがとうございます!
これからもご利用いただけるようなテンプレを頑張って作りたいと思います。


「今夜〜」のテンプレについてですが、確かにこちらにもjugemの独自タグを使用してます。
すっかり忘れていて、言っていただくまで気づきませんでした(;´д`)
ご迷惑おかけして申し訳ありませんでした。


「今夜〜」をロリポブログでご使用なさる場合は、
htmlとCSSを書き直さなければならない部分が「三日月ショコラーデ」よりもかなり多くて大変なので、
こちらでロリポ版のものをご用意いたしました。

http://zyniker.web.fc2.com/hoshikuzu-lolipo.txt

こちらのテキストファイルにhtmlとCSSを書いてありますので、コピペして頂ければご使用いただけます。

jugemのほうがロリポよりも自由度が高いので、あちらと完全に同じにすることはできないのですが、
一応、おおむね同じだとは思います。
よろしければ、試してみて頂ければと思います。

お手数おかけしますが、よろしくお願いいたします。



miho
はじめまして!
ナツさんのテンプレお借りしてます☆
今回はカスタマイズにあまり詳しくないので・・・
ぜひ教えていただきたいことがあり、コメントさせていただきました。
記事タイトルのみ文字のサイズを大きくしたいのですが、
可能ですか?可能でしたら、どのように変更したらよいのでしょうか?
お忙しいとは思いますが、ぜひ教えていただきたいです。
よろしくお願い致します<m(__)m>



nao
ナツさん!!
早速の対応ありがとうです!!
対応の速さに感動です。。。
ちゃんと、ロリポでも表示されました♪(o´∀`o)

それにしても、どれもこれもあたし好みのテンプレで、全部使いたいです☆
いや、全部使います(笑)

これからも、楽しみにしてます♪♪



ナツ
>mihoさん

はじめまして。
テンプレご利用いただいてありがとうございます!

ご質問の件についてですが、記事タイトルの文字を大きくするには、
CSS編集で、

div#MAIN h3, div#SIDE h3{text-align: right;
border-bottom: 1px solid #ffa0ac; padding: 0 0.7em;}

というタグがあると思います。
そこを消して、代わりに

div#MAIN h3{font-size:12px;
text-align: right;
border-bottom: 1px solid #ffa0ac; padding: 0 0.7em;}

div#SIDE h3{text-align: right;
border-bottom: 1px solid #ffa0ac; padding: 0 0.7em;}

↑このタグを追加してください。
これで記事タイトルのみ文字を大きくなると思います。
ここでは12pxにしていますが(デフォルトの状態だと10pxです)、お好みに合わせて調節なさってくださいね。

試してみていただけると幸いです。
よろしくお願いいたします。


-----------------------


>naoさん

こんばんはー。
うまくいったみたいで、良かったです!
テンプレもお気に召して頂けて何よりです( ^ω^)
是非じゃんじゃん使ってやってください(笑)

こちらこそありがとうございました!
またいつでも遊びにいらしてくださいね



mami
ナツさん、おはよーございます☆
素敵なテンプレート、使わせてもらってます。

事後になっちゃうのですが、
ちょこっと改修しちゃったのですが
よかったでしょうか・・・。
もしNGならばオリジナルをもっかいDLしなおしますので
言ってくださーい。

このテンプレートかわいいから大好きです☆
またリネンを使ったもの
UPしてくださーい!




ナツ
>mamiさん

おはようございます!初めまして。
テンプレご利用いただいてありがとうございます。

ブログ拝見しましたが、もちろんOKですよー。
「北極星ソーダ」のメニュー画像に変えてくださったのですね(´∀`)
ボーダーのブルーがいい差し色になってて、いいですね!
素敵なカスタマイズをしていただいてありがとうございました。

リネン系はホントに人気があるみたいなので、俺もまた作ろうと思ってます。
その折には是非またチェックしてみていただけると嬉しいです。

余談ですが、mamiさんは福岡在住なのですね!
俺も福岡なので、なんだか嬉しいです( ^ω^)



mami

福岡仲間ですか?!
えー、すごーい、奇遇ぅぅ。
ならば遠慮なくカスタマイズさせてもらいます♪
0から作るのはまだ自信ないので
ナツさんのかわいい作品を自分色にちょこっと変えて楽しみます♪

また遊びにきまーす♪



テンプレートお借りしました。すごくかわいいです!


本題なのですが、質問させてください!自分であがいたのですがどうにも…
記事下部のカテゴリ名とコメント各左側にある空白、ブログ右側のプロフィールとアーカイブスの各左側にある空白をなくしたいのですがどうしたらいいでしょうか?



ナツ
>mamiさん

そうなんですよ、奇遇ですよね!
記事を拝見していて、「博多」と書いてあったのでもしやと思ってさらに色々拝読していたら、
どうもmamiさんも福岡らしいと気づいてビックリしました(笑)
テンプレ、mamiさんのお好みに合わせてどんどんカスタマイズなさってくださいね(゚∀゚)

またいつでもいらしてくださいね
俺もまたそちらに遊びに伺います!


--------------------------


>希さん

初めまして。
テンプレご利用いただいてありがとうございます!

ご質問の件についてですが、
カテゴリ名とコメント左側の空白をなくすには、
CSS編集で

div#MAIN ul.entry li{display: inline;
margin: 0; padding: 0 0.5em;}

という箇所があると思います。
これを、

div#MAIN ul.entry li{display: inline;
margin: 0; padding: 0;}

と置き換えてください。

ブログ右側のプロフィールとアーカイブスの空白というのは、メニュー画像の部分でしょうか?
デフォルトではこれが右寄せになっている状態ですので、
同じくCSS編集で

div#MAIN h3, div#SIDE h3{text-align: right;
border-bottom: 1px solid #ffa0ac; padding: 0 0.7em;}

という箇所がありますので、これを消してから、

div#MAIN h3{text-align: right;
border-bottom: 1px solid #ffa0ac; padding: 0 0.7em;}

div#SIDE h3{text-align: left;
border-bottom: 1px solid #ffa0ac; padding: 0 0.7em;}

↑この二つのタグを付け加えてください。

これでメニュー画像が左寄せになると思います。


以上を、よろしければ参考になさってください。
よろしくお願いいたします。



Rei
ナツさんこんにちは。さっそく使わせていただいています。
うっかり女性が作成されているのかと思いました。とてもすてきですね!

アップした写真画像と、そのまわりのsolidの間に余白ができるよう(ちょうどフィルム写真のようにですね)paddingがCSSにちゃんと打ってありますのに、反映しないのはなぜなのでしょうか。
よくわかりません。(自分でもいろいろいじってみたのですがだめです。。)
お忙しいところ恐縮ですがお教えいただけるとうれしいです。



ありがとうございます!非常に分かりやすい説明ですぐできました!
あともうひとつまた質問があるんですけど構いませんか?
右側のサイドメニューの
プロフィールとアーカイブスの文字
と、
ハートマーク
の間に空白がありますよね。それを消してカテゴリやアザーズのようにハートマークのすぐ横に来るようにしたいのですが…

たびたびすみません。よろしくお願いします。



ナツ
>Reiさん

こんばんは。
テンプレ、ご利用いただけて嬉しいです。ありがとうございます!
あ、やっぱりそう思われましたか(笑)
結構よく言われます、「女性かと思ってた」って。

ご質問の件についてなのですが、
一応こちらではReiさんのブログの写真の周りにもsolidとの間の余白を確認できました。
Reiさんの環境では反映されていませんか?
もしかしたらブラウザなどの違いによるのかもしれません。
俺のほうはWindowsで、IEとOperaで動作確認を行っているのですが、
他のブラウザや、あるいはMacとかの場合だと、どう表示されているのか正直俺にも分からないです、ごめんなさい。
ですがもしこちらと環境が同じなのでしたら、また別の原因だと思います。

こちらで調べてみますね。
ご迷惑おかけして大変申し訳ありません。


-----------------------


>希さん

あ、空白ってそこの部分のことでしたか!
意味を取り違えていたようです、お手数おかけしてしまい申し訳ありません。

そこはハートマーク+メニュータイトルの文字で一つの画像になっていますので、
空白をなくした画像を作り直しました。

html内の↓この部分を、

<!-- BEGIN profile -->
<h3><img src="http://zyniker.img.jugem.jp/20070112_275145.png" border="0" /></h3>
{user_list}
<!-- END profile -->

↓これに入れ替えてください。

<!-- BEGIN profile -->
<h3><img src="http://zyniker.img.jugem.jp/20070128_280960.png" border="0" /></h3>
{user_list}
<!-- END profile -->

同様に、↓この部分も

<h3><img src="http://zyniker.img.jugem.jp/20070112_275144.png" border="0" /></h3>
<!-- BEGIN archives -->
<ul><!-- BEGIN archives_items -->
<li><a href="./?month={archives_item_id}">{archives_item_eng}</a></li><!-- END archives_items -->
</ul>
<!-- END archives -->

↓これに入れ替えてください。

<h3><img src="http://zyniker.img.jugem.jp/20070128_280959.png" border="0" /></h3>
<!-- BEGIN archives -->
<ul><!-- BEGIN archives_items -->
<li><a href="./?month={archives_item_id}">{archives_item_eng}</a></li><!-- END archives_items -->
</ul>
<!-- END archives -->


<>は都合上、ここでは全角にしていますので、コピペの際に全て半角にしてくださいね。
それでは、よろしくお願いいたします。



いえいえ、こちらこそ説明不十分な点があって申し訳なかったです!
作り直してくださって本当に感謝です!
きちんとカスタマイズできました。

ナツさんのテンプレートでずっと使っていこうと思ってます。
ありがとうございました!



ナツ
>希さん

カスタマイズできましたか、よかったです(゚∀゚)
こちらこそありがとうございました。
また機会がありましたら是非いらしてくださいねー



Rei
ナツさんこんにちは!ごていねいにありがとうございました。

>一応こちらではReiさんのブログの写真の周りにもsolidとの間の余白を確認できました。

わー!そうなんですか〜。
私もIEのwinなのですが、でも環境(?)のちがいによっては反映されてるんだと知るとうれしいです
思えばこまかいことなんですけどね^^; 
じつは、私より前からJugemでblogをはじめている兄のサイトに、まったく同じことを私がclass指定した時も、あっさり反映してくれたのに、(これは私の環境でも兄の環境でも確認できてます)おかしいなと思いまして。。^^;
この件以外にも、前から、自分のblog以外のファイルなどでもこのこと(場合によって反映したりしてなかったりする)が気になっていたので、思い切って質問してみました。。

結局、あのあと 自分の場合は写真を右寄せしたり左寄せしたりジグザグしたいので、その際にどちらにしても文章と写真の間が空くようにするために、float leftとrightと別々にclass指定をすることにしました。
あいかわらず私の環境では例のpaddingに関しては反映をみてないままですが、まぁ...ちいさいことですし場合によっては反映してる、というのを知って!ほっとしています。^^;

ほんと、ご丁寧にありがとうございました。
ナツさんもやはり眼が痛くなったりされることがあるのですね。
お体気をつけてくださいね
新しいテンプレートの案もあるとかでたのしみにしています。

あ、このテンプレ兄にもすごく好評です。画面みるたびにいいねーと言っています




ナツ
>Reiさん

こんにちは。
やっぱりReiさんもwin+IEですか。
色々ググって調べてみてはいるのですが、原因が今ひとつはっきり分かりません…。
勉強不足でお力になれず、申し訳ないです。
一応、引き続きこちらで原因や対処法を調べてみるつもりです。

眼は無理するとすぐ痛くなってしまいますねー。Reiさんもでしょうか?
でも最近はブルーベリーのサプリを飲むようにしてるので、いくらかマシになった気がします。
まだまだ寒いですし、Reiさんもお風邪など召されませんようご自愛ください。

テンプレ、お兄様にもご好評いただいてるとのことでとても嬉しいです(´∀`)
仲がよろしいんですねー。俺は一人っ子なので羨ましいです。
お兄様によろしくお伝えください。



みい
なつさん、はじめまして!
こちらのステキなテンプレートを使わせていただいています。
シックな可愛さが、とても気に入ってます。

質問なのですが、アップした画像にテキストを回しこむ時に、テキストと、画像の間にもう少しスペースが欲しいのですが、タグに詳しくないためよく分かりません。教えていただけませんでしょうか?

あと、絵文字を入れた際、絵文字がテキストから、一段ずれるのですが、テキストの中心に絵文字が配されるようにすることって、出来ますか?

お忙しいところスミマセンが、お時間がありましたら、アドバイスしていただけるとうれしいです。





ナツ
>みいさん

はじめまして、こんにちは。
テンプレご利用いただいてありがとうございます!

ご質問の件についてですが、
テキストと画像の間のスペースを広げるには、
CSS編集で

img.pict{border: 1px solid #cccccc; padding:8px;}

こういうタグが一番最後にあると思います。
これを、

img.pict{border: 1px solid #cccccc; padding:8px;
margin-left:10px;
margin-right:10px;}

これに書き換えてください。
この場合は10pxの空白が空くように設定していますが、
もっと広いほうがいい場合は、2つの「10px」の部分をお好みにあわせて適宜変更なさってくださいね。


それから絵文字の件なのですが、
絵文字についてはjugem側の独自タグのようなものですので、こちらで高さの位置を変更することはできないと思います。
どうしてもという場合は絵文字ではなく、素材屋さんなどで配布されている小さいアイコンを絵文字がわりに使用していただく方法がありますが、多用なさる場合はちょっと面倒くさいかもですね…。

あまりお力になれず申し訳ありません!



みい
 ナツさん

ご親切に回答いただき、ありがとうございました。
参考にさせていただきました。

また、ステキなテンプレート楽しみにしてますね。



ナツ
>みいさん

こちらこそありがとうございました。
今後ともよろしくお願いいたします(´∀`)



ショコラユーザー
はじめまして、こんにちは。
ブログを始めるきっかけになったナツさんのテンプレートが好きで利用させていただいているのですが、
最近気になっている疑問があります。
お忙しい中申し訳ないのですが、もし良かったら目を通していただけないでしょうか。

1:アクセス解析のバナーがページの隅にぴったり付かずに上の方に隙間が空いてしまいます、
HTMLへソースを貼り付けた箇所が問題ではないようなのです。

2:アーカイブやリンクなどが多くなってくることを予想して、雄弁〜 テンプレートと同じようにスクロールバーをつけたいのですが、

html{
scrollbar-face-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-3dlight-color: #ffffff;
scrollbar-arrow-color: #ffffff;
scrollbar-track-color: #000000;
scrollbar-darkshadow-color: #ffffff;

}

scroll、で検索してみて 多分ページ全体のスクロールバー?しか見つけられませんでした。
(これはCSSで見つけました)正しい箇所が知りたいです。

以上2点です、長々と失礼致しました。



ナツ
>ショコラユーザーさん

初めまして。こんばんは。
テンプレご利用いただいてるとのことで、ありがとうございます。
しかも俺のテンプレがきっかけだそうで、本当に光栄です。

ご質問の件についてなのですが、
まず1番目のページ上部に隙間ができるという現象に関しましては、
考えられる原因としてはCSSで設定してある、

div#HEADER{
padding: 4em 0;
(後略)
}

の”4em”の部分です。これでHEADERの上部に隙間を設定していますので。
この4emを削って、padding: 0; にして頂ければ、
あるいは直るかもしれません。
ただ俺はアクセス解析を貼っていないので、これで確実に隙間ができなくなるかは確認できていません。申し訳ありません。

一応可能性はあると思いますので、もしよろしければお試しになってみてください。
その場合、ブログ名の表示も上にずれますので、
htmlの<h1>{blog_name}</h1>の前に、
二つほど改行タグを追加したほうがいいかと思われます。


2つめのスクロールバーの件に関してですが、
スクロールバーをつけるには、
まずCSS編集で、


.link_bar {
width: 100%;
height: 80px;
overflow: auto;
margin-bottom:20px;
}

こちらのタグを追加なさってください。
それからhtml編集で、スクロールバーをつけたいメニューのタグを少しいじります。
例えばここではアーカイブにつけるとすると、

<h3><img src="http://zyniker.img.jugem.jp/20070112_275144.png" border="0" /></h3>
<div class="link_bar">
<!-- BEGIN archives -->
<ul><!-- BEGIN archives_items -->
<li><a href="./?month={archives_item_id}">{archives_item_eng}</a></li><!-- END archives_items -->
</ul>
<!-- END archives --></div>

こういう形になります。
</h3>のあとに<div class="link_bar">を追加し、最後に</div>で閉じます。
他のメニューでも同様です。
これでスクロールバーが出ると思います。

なお、ここではメニューが80px以上の長さになるとスクロールバーが出る設定にしていますが、
この高さを変えたい場合は、先ほど追加したCSSの中の、
height: 80px;
の数値の部分を適宜変更なさってください。

それとここでは都合上、タグの<>を全て全角で表示していますので、その点ご留意ください。


説明が下手なので、よく分からない部分があったり、
あと何かショコラユーザーさんのご質問の意図を取り間違えていたりした場合は、
ご遠慮なく仰ってくださいね。

それでは、よろしくお願いいたします。



ショコラユーザー
こんばんは、アドバイスありがとうございます!
自分の考えていたように出来てとても助かりました。
ブログを始めたのは、最初サーバーをどこにしようか悩んでいたときに
ジュゲムのユーザーテンプレートでナツさんのを見つけてカワイイなって思って・・・
テンプレもそうですけど、普段の日記も好きで毎日読んでます。

1→隙間がなくならないようなので
解析タグを左上隅、右上隅にではなく、任意の箇所に貼り付けることにしました。
メニュー部分に設置しても変じゃないし良かったです。

2→詳しい解説でとても良くわかりました!
これでブックマークやアーカイブが多くなってきてもすっきり見せることが出来ます。

ほんとにありがとうございました(*- -)(*_ _)ペコリ



ナツ
>ショコラユーザーさん

こんにちは。
アドバイス、少しでもお役に立てたなら嬉しいです。

レンタルブログのサーバーって、どこにするか最初は迷いますよね。
俺も結構迷って、あれこれ試したりしてました。
結局俺にはjugemが一番使いやすかったので、jugemにしたのですが。テンプレもいじりやすいし。
おかげでこうやって温かいお言葉をかけて頂く事ができて、とても幸せです。
日記も読んでくださってるとのことで、ありがとうございます(´∀`)


隙間、やっぱりなくなりませんでしたか…
うーん、原因が俺にもよく分かりません。申し訳ないです。
ですが任意の箇所に貼ることもできるのですねー。良かったです。
スクロールバーのほうはうまくいったようで、何よりです!

こちらこそありがとうございました。
また何かありましたらいつでもいらしてくださいね



はる
はじめまして^^とてもカワイイテンプレートでぜひ使用させていただきたいです^^
質問なのですが、コメントに載せてくださっている方法で、
ブログの説明文を載せるように書き換えたのですが、
そうすると、レースの画像と記事の間あたりに線のようなものがでるのですが・・・これは消すことができるのでしょうか?
私のやり方が何か間違っているだけかもしれませんが・・・^^;
すみませんm(__)m
お時間のあるときにご回答いただけたらうれしいです。



ナツ
>はるさん

はじめまして、こんばんは。
テンプレ、お気に召して頂けたようで嬉しいです。
ご質問の件についてなのですが、どうやらIEで見ると線が出るみたいですね。俺は普段Operaなので、気づきませんでした。ご迷惑おかけして申し訳ありません。

線を消すには、
まずCSS編集で、

div#HEADER hr.none,
div#MAIN h2, div#SIDE h2{display: none;}

div#HEADER p.text{
color: #333333;
text-align:right;
margin-right: 6em; background: transparent;
text-decoration: none;
margin-top:15px;}

この部分を消してから、


div#HEADER p.text,hr.none,
div#MAIN h2, div#SIDE h2{display: none;}
.text{
color: #333333;
text-align:right;
margin-right: 10em; background: transparent;
text-decoration: none;
margin-top:15px;}

このタグを付け足してください。
それからhtml編集で、

<p class="text">{blog_description}</p>

という部分がわりと上のほうにあると思いますので、
それを

<div class="text">{blog_description}</div>

に入れ替えてください。

これで恐らく線が消えると思いますので、よろしければお試しになってください。
それでは、また何かありましたらいつでも仰ってくださいね。



はる
ナツさま。

早速教えていただきましてありがとうございましたm(__)m
書き換えまして、線消えました!
お忙しい中、丁寧にご回答いただきまして
本当に感謝してます!!!
これからも活用させていただきます(^-^)♪
かわいいテンプレでとてもお気に入りです♪
また何かありましたら宜しくお願いしますm(__)m



ナツ
>はるさん

こんばんは。
線、うまく消えたとのことでよかったです。
お手数おかけしてしまい申し訳ありませんでした。
拙いテンプレですが、ぜひ今後ともよろしくお願いいたします。
可愛いと言っていただけて嬉しいです(´∀`)
それでは、失礼します。



ショコラユーザー
以前こちらでお世話になりましたショコラです。
テンプレを使わせていただいて3ヶ月目に入ったのですが、
アーカイブ部分が2ヶ月分しか表示されていないことに気がつきました。
私はIEなのですが、どうすればアーカイブが2ヶ月以上表示されるようになるのでしょうか・・?
(こちらのブログでサンプルさせてみた所、アーカイブは全て表示されていました)



ショコラユーザー
すみません、勘違いでした!
1月の記事を2月に編集移動させたので、前の月の記事がなくなっていただけでした。
お騒がせして申し訳ありませんでした・・



ゆかな
初めまして書き込みさせて頂きます。
実は以前からお世話になっていました^^
素敵なテンプレートなのでいつも使用させて頂いております。
私はロリポブログユーザーなのですが、詳しい説明が載って
いるのでとても助かります。このテンプレート、お借りしますね^^

それでは失礼しました。



ナツ
>ショコラユーザーさん

テンプレ、3ヶ月もご使用いただいてるとのことで、とても嬉しいです。ありがとうございます。
テンプレのバグじゃなくて良かったです(笑)
また何かありましたらいつでもいらしてください。


---------------------


>ゆかなさん

初めまして。
以前からご使用頂いてたのことで、とても光栄です、ありがとうございます。
ロリポとjugemはベースはほとんど同じなわりに妙に互換性に乏しいので、
ロリポで上手く表示されてなかったことに後になって気づいたりして、テンプレを作ってる身としてはなかなか歯痒いのですが(笑)
そう言って頂けると、ロリポブログ用に調整した甲斐があります。
拙いものですがどうぞ使ってやってくださると嬉しいです。

コメントありがとうございました!



ボン
はじめまして!
リネン素材大好きです。シンプルなおかつかわいいです。
気に入ってます。
メニューにNew entryes追加したいのですが、どうすれば宜しいでしょうか?それとメインの日付を題名?の左側に入れたいのですが、どうすれば宜しいでしょうか?



ナツ
>ボンさん

初めまして。
ご質問の件についてですが、
まずnew entriesを表示するには、html編集内の

<!-- END archives -->

という行の下に、

<h3><img src="http://zyniker.img.jugem.jp/20070312_296204.png" border="0" /></h3>
<!-- BEGIN selected_entry -->
{selected_entry_list}
<!-- END selected_entry -->

こちらのタグを追加なさってください。
なおここではタグ内の<>を全角にしていますので、コピペの際には全て半角に直してください。


それから投稿日を記事タイトルの左側に表示するには、同じくhtml編集で

<ul class="entry">
<li>{entry_date} | </li>
<li>{category_name} | </li>
<li>{comment_num}</li>
</ul>

と書いてある箇所がありますので、そこから
<li>{entry_date} | </li>
の部分だけ消してください。

そしてその少し上に

<h3>{entry_title}</h3>

と書いてあると思いますので、そこを

<h3>{entry_date}&nbsp;&nbsp;&nbsp;&nbsp;{entry_title}</h3>

に置き換えてください。
こちらもタグ内の<>は全て半角にしてくださいね。

ご参考にして頂ければと思います。


コメントする