« 4人目の加入選手 | Main | やっと初詣^^; »

今回のデザイン変更について

ちょっと時間がたってしまったけど、今回のデザイン変更でお世話になったサイトさまへの感謝をこめて、主な改造点を挙げておきます。

まず、サイドバーを折りたためるように変更。
これでサイドバーを右側片方にしても、長くならずにすっきり。
facet-divers」さんの公開されてるスクリプトを使用させてもらいました。状態保持機能といって、閲覧者が折りたたみ部分を開いた場合、次回訪問いただいた時もその状態が保たれている便利な機能つきです。

全体の雰囲気に合うように、ボタンの色付けなどのカスタマイズは「KOROPPYの本棚」さんの記事に参考にさせてもらいました。
私は使わなかったのだけど、折りたたみの開閉でボタンの色を変えるという方法もあるとのこと。

次に、カレンダーの日付をクリックするとその日に更新したエントリをすべて表示できるように変更。
今までは1件(その日最後に更新した記事)しか表示できなかったので、1日に数件エントリをあげることがある私としては何とかならないなかと思って探していて、「札幌日記録」さんの記事を発見!
これでカレンダーが、やっとちゃんと機能を果たすようになった気が(笑)

そして今回一番苦労したのが、サイドバーの上にある「ページ内の記事一覧表示」(現在の設定は7日分) の設置
スクリプトを公開してくださってる「facet-divers」さんや「観測気球」さん、そしてその改造案など、丁寧に説明してくださってるエントリはたくさんあるのだけど、どうにもきちんと設置できなくて…。というか、以前使っていたテンプレートで試したらまったく問題なくうまくいったので、そこで形をととのえてから新しく作った今のテンプレートにもってきたらなぜかきちんと表示できない…。日付はでるのだけど、エントリ名が表示されず…。結局色々探して「facet-divers」さんが後から公開してくださってる方法を利用して成功しました^^
カスタマイズはこちらも「KOROPPYの本棚」さんを参考にさせていただいています。

ただこの「ページ内の記事一覧表示」で、また私が以前に設定したカテゴリ分けが問題に…。カテゴリのバックナンバーを開くとタグが見えてしまって、これを目立つところに置くのは、うーん、みっともないなぁ、やっぱり…。カテゴリ分けの方では以前Suggyさんに教えていただいたインデックス形式での一覧を使っているので、「ページ内の記事一覧表示」を外してしまえれば一番いいんだけど…。

背景画像は引き続き「ひまわりの小部屋」さんから、アイコンは「b-cures」さんからお借りしています。

知識不足な私がここまでカスタマイズできたのも、スクリプトやスタイルシート、画像などを公開し、解説してくださってるサイトさまのおかげです。ありがとうございましたm(__)m

|

« 4人目の加入選手 | Main | やっと初詣^^; »

Computer」カテゴリの記事

  ココログ」カテゴリの記事

Comments

facetさま

レスおそくなりました…。
facetさまのブラウザでもきちんと見られるようでホッとしました^^

標準機能としてカレンダーで前月が表示できるブログサイトもあって便利だなぁと見ていたのですが、ココログだと色々と難しい問題があるのですね…。
ただ、日記的な使い方が強い私としては、日にちから記憶を紐解くことも多いので、カレンダーが使いやすいと嬉しいなと思います。

またいい方法見つかりましたら、教えてくださいませ。よろしくお願いします。m(__)m

Posted by: Yuki | January 11, 2005 10:03

見出し一覧、FirefoxではバッチリOKになりました〜(^^)

ところで。

カレンダーのリンク先を固定リンクから日別に変える話ですが、ベーシックコースでは難しいですね。そもそも、日別バックナンバーを生成している人は少ないですし、日別にすると月別をつくれない(一つしか作れない)ですからね...

バックナンバーを月別にしている人なら、カレンダーのリンク先を月別バックナンバーのその日のところに飛ばすということなら、可能かもしれません。

あと、考え得るのは、固定リンク先のページからその前のページを取得して、そのページが同じ日ならまたその前のページを取得して...という風に次々とページを取得して、該当記事部分だけを全部並べる...とかならモシカシテできるかもしれません。めちゃくちゃ強引ですし、さすがにこれは作る気もないですけど(^^;

それから、カレンダーのところで前月に飛べるようにするという件ですが、月別バックナンバーを作成している人なら可能だと思います。

ただし、前月に飛んだ時に、そこに表示されているカレンダーは今月(最新更新月)のカレンダーのままということになるので、前後に飛ぶリンクを作るのは無理だと思います。

前後に飛べるようにするためには、カレンダー自体を新しく生成しなくてはならないでしょう。実は以前、作ろうかなと思ったことがあるのですが、カレンダーを作ること自体が難しくて、さっさと断念しました(^^;

ということで、マイリストのメモ欄にコードを貼るだけで前後に飛べる機能付きのカレンダーを生成してくれるようなものを作ること自体は可能なように思いますが、ハタシテ...。

Posted by: facet | January 08, 2005 23:57

>facetさま

この度は本当にお世話になりました。ありがとうございます。しかもスタイルシートの心配までして頂きまして…。重ねてお礼申し上げます。
見出し一覧につきましては(2)の方法を使わせて頂きました! これだけで問題解決だったのですね。全然気づきませんでした…。これで私の方は満足です^^

IEだと5.5でも6でも一応大丈夫だったのですが、別のブラウザだとやはりおかしなことになってしまうのですね…。facetさんのアドバイスをもとにスタイルシート少し変更しました。IE以外でもちゃんと見れるのか、まだちょっと心配です…。

これからも便利なスクリプトの公開など、楽しみにしております^^

>Koroppyさま

いつもとてもキレイにカスタマイズされているので、勝手にお手本にさせていただいています。すみません…。

カレンダーで日付ごとに表示するのは、どうなんでしょうか、これもリンクリストへの貼り付けなどで動かす方法があるのでしょうか…? もしできたら、本当に便利ですよね^^
他のブログサイトのように前月に飛べたり、もうちょっとカレンダー機能が使いやすかったらいいなぁと思っています。
そのあたりのことはfacetさまにお願いしてみてしまうとか!?

Posted by: Yuki | January 08, 2005 02:34

トラバありがとうございました。
私もfacetさんとtsupoさんのスクリプトには、
お世話になりっぱなしです。

カレンダーでその日のエントリ全てを表示する方法があるのですね。
これは便利です!
でもテンプレートをいじるから、プロだけでしょうか。

Posted by: KOROPPY | January 07, 2005 08:00

トラックバックありがとうございました。

見出し一覧の件ですが、一覧のタイトルをそのページのタイトルから動的に取得しているため、タグが含まれていると、どうしてもそういう問題が表れてしまいます。

これを解決するには、
(1)ページタイトルからタグを取り除くスクリプトを新しく作って設置し、その後で見出し一覧スクリプトを呼び出すようにする。
(2)どのページでもデフォルトタイトルのみを使うようにする
という二つの方法が考えられます。

(1)をご希望の場合は、新しいスクリプトを作るのはそんなに難しくないので、その旨ご連絡下さい。

(2)をご希望の場合は、メモ欄で、
useOnlyDefaultTitle = false;

useOnlyDefaultTitle = true;
と書き換えていただければOKです。

それから、もう一つ、この問題とは関係ないのですが、私の使っているブラウザ(Firefox)では、生成した見出し一覧とカレンダーが重なって表示されてしまっています。

これは、styleの#content-headingの部分に、float:right;を使っていることが原因のようです。

以下、私なりに調整してみたstyleを下記に書いておきますので、御参考まで。

#content-headings {
width: 164px;
font-family: Verdana, Arial, sans-serif;
color: #003366;
margin: 20px 5px 5px 15px;
padding: 5px 10px 5px 5px;
font-size: small;
line-height: 150%;
border: double 3px #003366;
}

#content-headings .title a {
display: block;
margin: 1px;
padding: 2px;
font-size: medium;
font-weight: bold;
color: #003366;
text-decoration: none;
text-align: center;
}

#content-headings a {
text-decoration: none;
}
#content-headings a:hover {
text-decoration: none;
}

#content-headings .level-2 {
font-weight: bold;
margin-left: 5px;
}

#content-headings .level-3 {
display: block;
margin-left: 5px;
font-size: small;
background-image: url(http://half-time.tea-nifty.com/ontimeofftime/images/a.gif);
background-repeat: no-repeat;
background-position: 2px 6px;
padding: 0px 3px 3px 15px;
line-height: 150%;
}

# このstyleは、Firefoxで最適化したため、IE6ではあまり見栄えが良くないかもしれません。適宜変更してください。

Posted by: facet | January 07, 2005 06:25

Post a comment



(Not displayed with comment.)




TrackBack


Listed below are links to weblogs that reference 今回のデザイン変更について:

« 4人目の加入選手 | Main | やっと初詣^^; »