久しぶりにデザイン変更

ちょっと気が向いたのですご～く久しぶりにブログのテンプレートを作ってみました。
素材は「ミントblue」さんで新しく追加された800px幅のタイトルバナーを1枚、これに合わせた壁紙と葉っぱのアイコンを「web*citron」さんからそれぞれお借りしました。
いつもありがとうございます♪

ここのところずっとテンプレートを変えるときも以前作ったものの再利用で誤魔化していたので、CSSを触るのも久しぶり。
今回も最初から書いたのではなく、以前のデザインのものをベースに必要な部分を足したり引いたりしただけなのですが、今は使っていない指定が入っていたり、何度も使い回ししているので同じ部分の指定が何度も入っていたりして思い通りになるまでかなり時間が掛かりました^^;

シンプルですが、秋らしい温かみのあるデザインに仕上がったかな～と思います。（自画自賛（笑））

一応、IE8、Firefox3.5、Opera10.0で確認済みですが、「画像が重なってる」、「端が切れてる」、「記事が読めない」など不具合がありましたらご一報下さい。
出来る範囲で対応致します。

デザイン変更

左サイドバーをfloat:rightを使って一番右に持ってきてサイドバーを右2列に、更にその2列のmargin-topにマイナス値を設定して表示位置を上に上げる、というかなり強引なレイアウトにしてみました^^;
こういうのってCSS的にアリなんでしょうか？ちょっと不安…。
それ以外の色の設定などは前回のデザインと同じ。
背景も写真を右下に置いただけであとは白メインなのでパッと見はシンプルなデザインかも。

 

背景のフランス菊の写真は「ミントblue」さんからお借りしました。
いつもありがとうございます(^^)

記事下部に表示される「同一カテゴリー内タイトル」部分をカスタマイズ

4月10日からココログで、固定リンクページの記事下に同一カテゴリーの過去記事5件が表示されるようになった。

■記事下部に同じカテゴリの記事タイトルが表示可能に

早速設定してみたら、やけに昔の記事が載ってくる。
もう一度説明を読んでみたところ、過去記事は「作成日」ではなく、「更新日」が新しい順に掲載される、とのこと。
つまりずっと昔の記事でも何らかの理由があって更新（再保存）をすることで掲載されるわけだ。
補足したり、修正した記事を目立たせることが出来るし、読んで貰いたい記事は定期的に再保存すれば常に上位に表示できるので使い方を工夫すればアクセスアップを期待できるかも。

ただ、記事本文が短いものだとどちらが本編か判らなくなりそうだし（例えばこの前の記事とか）、たくさんカテゴリーを設定している場合表示がすごく長くなってしまってちょっと邪魔かも。
（私の場合、通常1～2個、最大でも3つくらい。この程度なら許容範囲かな？）

デフォルトのままだと表示があまり目立たないので、KOROPPYさんのカスタマイズを参考にさせて頂いて私もCSSで調整してみた。

設定したCSSは次の通り。

.entry-recent-posts{
height:190px;/*全体の高さ*/
background-color:#ffffff;/*背景色*/
border:1px solid #768f10;/*枠線*/
padding: 5px; /*枠線の内側余白*/
}

.date-header
{
font-weight:bold;/*タイトル文字の太さ*/
padding-left:30px;/*タイトル文字の位置*/
}

.entry-recent-posts li{
background-image:url(画像のアドレス）;/*リスト行頭の画像*/
background-position: left;/*画像の位置*/
background-repeat:no-repeat;/*画像の繰り返し*/
padding-left:15px;/*リスト開始位置*/
text-align:middle;/*画像に対する文字の位置*/
}

こうやって書くとパパパッと出来たみたいに見えるけど、実はちゃんと書いてるはずなのに思ったように反映してくれなくてかなり長い時間「う～ん…？」と悩みつつ設定→確認を繰り返していた。
（特にリストマークのところ）
セレクタの「.entry-recent-posts」の最後の『s』が抜けていたことに気が付いたのは1時間以上経ってからでした…（泣）
そりゃあ、反映しないわけだ^^;

KOROPPYさんの該当記事にトラックバックさせて頂きました。

デザイン変更：菜の花

気に入っていた桜のデザインですが、季節もそろそろ終わりなので「菜の花」に変更しました。
（この時期だと菜の花でもちょっと遅いかな？^^;）

背景の菜の花の写真は「||| 空色地図 |||」さんからお借りしました。
柔らかな光を浴びた緑と黄色のコントラストが春らしくて爽やかです。

この菜の花もそうですが、春の花は黄色が多いですよね。
これはみんなが感じることみたい。
多分、自然の中で植物が生きるための進化の結果なのでしょうけど、それが人間の脳にもインプットされて「緑＋黄色＝春」という図式が出来上がっているような気がします。
それから、やはりこの菜の花を始め、春の野菜はちょっと苦みがあるものが多くて、しかもそれこそが「美味しい」と感じる部分だというのも興味深いです。
「苦み」って普通は「身体に悪いもの」という判断基準だと思うけど、この春野菜の微かな「苦み」「えぐみ」は逆に「身体を浄化してくれる」というイメージがあるのも不思議です。

デザインで工夫したのは下記の2点。
1.左サイドバーと記事部分に画像が掛かったときに文字が読みにくくならないように、背景に疑似半透明用の画像を敷いた
※エントリー部分は、この後「半透明」から「背景色：白」に変更しました。
2.左サイドバーはトップの位置を少し下げた

CSSはこんな感じです↓。参考まで。

/*記事表示欄の設定*/
.entry-body{
background-image:url(画像のアドレス);/*背景画像の指定*/
background-repeat : repeat ;/*背景画像繰り返し*/
border:1px solid #768f10;/*枠線*/
padding: 5px;/*枠線から本文までの余白*/
}

/*左サイドバーの設定*/
#left{
background-image:url(画像のアドレス);/*背景画像の指定*/
background-repeat : repeat ;/*背景画像繰り返し*/
margin-top:60px;/*表示開始位置下げ*/
}

デザイン変更：桜

使える期間が限定されてしまうのでどうしようか迷ったのですが、今年も業務多忙でお花見が出来そうにないので、ブログだけでも…と思い桜のデザインにしてみました。

透き通った青空に映えるきれいな桜の写真はいつもお世話になっている「・・・NOION・・・」さんからお借りしました。
他の装飾は殆どありません。
写真の美しさを楽しんで下さい。

ココログ：記事タイトルに付加されたリンク下線の消し方

3月22日、ココログの有料版（ベーシック/プラス/プロ）のバージョンアップが実施された。
有料版ユーザーにとって、このバージョンアップによって一番大きく変わったのは、

メインページ、日付ベースのバックナンバー、カテゴリー別のバックナンバーに表示される記事のタイトルに固定リンクを追加しました。

「ココログベーシック/プラス/プロ　アクセス解析メンテナンスのお知らせ」より

という部分だったと思う。

つまり、今までは記事のタイトルを表示していただけの部分が、上記で指定されている表示場所に限っては個別ページへのリンク（「固定リンク」）としての働きも持つようになった、ということ。
この仕様について私は以前から「そうなってたほうがいいなあ」という希望があったので、個人的には導入を歓迎している。
ただ、テキストがリンクになると表示のされ方が変化する、ということをもっとココログは意識するべきだったと思う。
単純にテキストにリンクが付加されるだけならまだしも、今まで何も表示されていなかった部分に急に意図しない下線が表示されるようになるのって見てる方にとってはけっこう違和感大きい。
（私も含め）「自分のブログの見え方」に拘っている管理人さんはすごく多いはず。
それなのにこうした変更についてただ「リンクが追加されました」だけで、デザイン的な部分に言及がないのはかなり不親切だなあ、という印象。
この仕様を導入して更にデザイン画面も変更するのだったら、ついでに「タイトル部分のリンク設定」もカスタム・テーマから簡単に設定できるような項目を追加すればいいのに…。

ということで、夕べやはりこの件で困惑していらしゃった涼さんのブログにもコメントを残してきたのだけれど、タイトル部分のリンク下線の消し方について。
（以下はカスタム・テンプレートを利用している場合の方法です）

管理画面にある「デザインの編集」から「カスタムCSSを編集」を開き、中のテキストボックスに

.content h3 a{
text-decoration: none;
}

と入力して保存→反映でOK。
これで下線が消えます。
下線が付いて困っている方は試してみて下さい。

ちなみにここは他の部分に設定してあるリンクのCSSが反映しているので、文字の下に点線が表示されるようにしてあります。
同じようにしたい場合は、

.content h3 a{
text-decoration: none;
border-bottom: 1px dashed #cccccc;
padding-bottom: 2px;
}
といった感じでどうぞ。
「border-bottom: 1px dashed #cccccc;」は線の太さ・種類・色、「padding-bottom: 2px;」は文字と線の間隔の設定です。
お好きなように変えて設定して下さい。

【'07/03/26 追記】
本日付けの「お知らせココログ」にこの件について機能追加予定である旨の報告が掲載された。

この機能変更により、現在のところ、デザインのカスタムテーマで記事タイトル色の変更はできませんが、近日中に色の指定ができるようにすることを検討しています。また、オリジナルテーマにつきましても、以前と同様の見た目になるような対応を行います。

「記事タイトルへの固定リンク追加につきまして」より

ココログにしては対応が早かったのはまあ評価するけど、導入は「いつ」と具体的な期日が書いてないのがちょっと気になる。
お知らせだけ出しておいて、延々待たせるということのないようにしてもらいたい。
ところでコレ、単純に「機能追加のお知らせ」であって「お詫び」ではないのね。
「別に悪いことしたわけじゃないし」ってスタンスなわけね、ふ～ん…。
（と、つい斜めから見てしまう^^;）

「最近の記事」を日付別にツリー化してみた

『風柳亭－別館：書庫のある庵』さんで、サイドバーの「最近の記事」を日付別にツリー化するスクリプトが公開されていたので、早速試してみました。

■【ココログ】『最近の記事』を日付別ツリー表示するスクリプト

設定方法は、風柳さんのブログにあるスクリプトをコピーしてサイドバーに貼り付けるだけ。簡単です(^^)
（但し、これは事前に「コメントのツリー化」をしてあることが前提。コメントがツリーになっていない場合は、あといくつか手順が追加されます。この手順も風柳さんの記事でちゃんとフォローされてます）

風柳さん、便利なスクリプト提供ありがとうございました♪

ついでに新着記事に「new」のマークが付くようにしてみました。
3日（72時間）以内に投稿した記事のトップに表示されます。
（このカスタマイズについても風柳さんのページに書いてあります）
ここの画像は「IMAGE」さんからお借りしました。
ありがとうございました(^^)

【追記】
下記の件について、風柳さんがスクリプトを修正して下さいました。
現在公開されているスクリプトでは、表示順（日付の降順/昇順、同じ日付に複数記事がある場合の降順/昇順）が任意で選択できます。
また、サイドバーのどの位置に置いても希望通りの表示になります。

※以下、もしかしたら私のブログだけの症状かもしれませんが、念のため。
最初、「最近の記事」より後ろにスクリプトを置いたら日付の表示が「古いものが上」になってしまったので、設置場所を「最近の記事」よりも前に変更してみたところ無事に「新しいものが上」（今の形）になりました。
表示順が思ったようにならなかったら、設置場所を少し変更してみるといいかもしれません。

別館ブログ（FC2）のデザインを変更

本の感想の過去ログだけを置いている別館「*untitled message* annexe」のテンプレートを変更してみた。

前回「テンプレートを変更したよ」と書いたのは'05年の10月16日のこと。
シンプルなデザインだった前のテンプレートはかなり気に入っていて特に変える必要がなかったのでそのまま使っていたけどさすがにちょっと飽きてきていた。
更には、せっかくあれだけの数の共有テンプレートがあって、私も管理画面には気に入ったのをたくさんストックしてあるので「そろそろ変えてみるか」ということに。

新しいテンプレートはlovehelmさん作の「13th_lovely」。
もう随分前にダウンロードしたテンプレートなので、またしてもプラグイン非対応^^;
でもこのブログにはそんなにいろんな機能を付ける予定もないし、何よりこのテンプレの雰囲気がとてもステキなのでこれに決定。

今回変えるに当たって、カスタマイズも少々。

■タイトル下に作家別インデックスヘのリンクを設定
前のテンプレートでは、記事の一番上に設置されたフリースペースに置いていたんだけど今回はそういうスペースがなかったのでタイトル部分にメニュー的にリンクを設置。
（フリースペースは自分で作れば出来そうだったけど、そこまで調べる気力はなかった^^;）

■アーカイブ（月別、カテゴリー）をプルダウン化
月別のアーカイブは前のテンプレでもプルダウンにしていたので、今回はカテゴリーも同様にしてみた。
設置方法は「はじめてのFC2ブログカスタマイズ」からスクリプトコードを拝借。

■「最近のトラックバック」表示方法の変更
サイドバーへの表示方法が、トラックバック送信元のブログ名だけだったので相手の記事タイトルも表示出来るように変更。
これは前のテンプレートがそういう表示方法だったので、その部分のHTMLをそのままコピーして置き換え。

■前/次エントリーへのナビリンクの設置
これが一番面倒臭かったかな。
FC2ではテンプレートの中で「ブロック変数」というのを使うことで、いろんな項目を設定できるんだけどココログにはないものなのでどうにも使い方がよく判らなくて出来上がるまでにかなり悩んだ。
でも「FC2ブログユーザーフォーラム」のトピックなどを検索して何とか無事設置。
出来てみれば「ああ、なるほど。こういうことなのね～」と理解できるから、やはり「自力でやる」というのはけっこう重要である。

■ブログ内検索の追加
これも前のテンプレートのソースをコピペで設置。

以上がHTML部分。
CSSは「リンクの装飾」「引用」「行間の設定」「フォントの種類」など細かいところをいくつか。

前回のときはまだココログのカスタマイズでCSSがすこ～しだけ判ってきた程度の頃だったのであまりにも自由すぎるFC2のカスタマイズは敷居が高すぎて付いていけなかったけど、今回はそのときよりはちょっと理解度が深まって「こうしたい」という希望と自分の出来ることがリンクしてきた感じ。
ここ1年ほどカスタマイズのブログ開設などを通してCSSの記述を試したり、確認したりしているうちに少しは知識が付いてきたと見える（笑）
（最近「FC2ブログフォーラム」もほぼ毎日覗いて自習してるし）
判ってくれば、HTMLを書き換えることでデザインや表示内容、方法を大きく変更できるFC2はやはり魅力的。
特にナビゲーション（「前」または「次」のページやエントリーへの誘導とか、エントリーの表示方法とか）部分が自分が好きなように変更できるのはすごく便利。
さすがに1から自分でデザインしようとは思わないけど、カスタマイズ用のテンプレートを拾ってきてそれを基に自分の思い通りに作ってみるのもいいかな～なんて大きな夢を見たりして（笑）

これからはもうちょっとこっちのブログのデザインも触ってみるようにしよう。
次はプラグイン対応のテンプレートにしてみようっと。

デザイン変更＜クリスマス＞

…と言っても見てお判りの通り、去年作ったデザインの使い回しです^^;

この間、PC内の画像の整理をしていたらこのタイトル画像を久々に見つけて、「けっこうよく出来てる（自画自賛^^;）から今年もこれでいっか～」ということに。
壁紙やラインも新しく選ぶのは大変なので、もう全面使い回しで行こう、と決めました。

但し、引用と個々のエントリーにちょっとだけ追加。
一番下の部分に別の背景画像を「横リピート」で敷いてます。
白い切り絵のような森のシルエット画像なので、その下（body）の壁紙と合わせると森に雪が降ってるみたいになりました。

タイトル画像は「A.SLASH」さん、その他の素材（壁紙、ライン）は「季節素材 雲水亭」さんの作品です。
（追加した壁紙も「雲水亭」さんからです）
ありがとうございました。

そういえば、「ココログデザイン」にもクリスマス仕様のテンプレートがいくつかありますね。
ココログのリッチテンプレートってあまりピンと来るものがないのですが、最近追加された『クリスマスリース』のテンプレートは、ココログにしては珍しく^^;シンプルで、文字が読みやすくて、しかも季節感がちゃんと取り入れられたいいテンプレートだな～と思います。
季節限定ものなのでお手軽に雰囲気を変えるにはちょうどいいのではないかと思います。
『雪の楽団』はたんじあきこさんのイラストはすごく可愛いけどクリスマスとは微妙に違う感じ…。
その分、もうちょっと長く「冬用」として使えるかも。

壁紙を変更しました＜コスモス＞

昨日、今日と涼しかったのでなんとなく気分は「秋モード」。
思わずデザイン（壁紙）を変えてみました。
（明日からまた暑くなったりして…^^;）

コスモスの写真素材はいつもお世話になっている「NOION」さんからお借りしました。
大胆な構図と透けるような繊細な色合いが美しいです(^^)

エントリー欄に透過っぽい（笑）壁紙を敷いておくと、下に画像を入れても文字がちゃんと読めるので使い易いです。
その代わりサイドバー部分はちょっと読みにくいかな～^^;
※この部分のカスタマイズについては下記のページで解説しています。
※興味があったら読んでみて下さい。
■第29回：半透明フィルター（CSS）を使わずに、画像を半透明っぽくみせてみよう（「初めてのココログ・カスタマイズ」より）

その他、壁紙の色味に合わせてタイトル文字（画像）と、記事タイトルや日付の文字色や枠線あたりをちょっと変更しました。

デザイン変更しました＜Fly away…＞

どこまでも遠くまで続いていきそうな草原と空、そしてそこを横切る一羽の燕が印象的な写真です。

いつもお世話になっている写真素材サイト「NOION」さんで去年の秋くらい （もっと前だったかな？）に見つけて、ずぅっと「いつか使うぞ！」とキープして置いたお気に入りの一枚です。
今の季節に合うかな～と思って、満を持して（笑）使ってみました。
（残念ながら現在は配布されていないようです）

今回のデザインで工夫したのは、 ちょうど文字が載る部分に燕がいたり画面下の緑の部分がけっこう濃い色だったりするので読みにくくなるのをどうしたら回避できるか、 というところ。
CSSで背景を半透明にする「filter: alpha(***);」とかっていうワザがあるのは知っていたのですが、いかんせんこれはIE専用。
それ以外のブラウザでは機能しないのはちょっとね～と思って、画像そのものの色を調整したりしていたのですが、先日ふと他のブラウザでも （多分）大丈夫な方法に気が付いたのでやってみたらなんとかいけそうだったので公開してみました。
（昨日「browsershots」 でチェックしてみたところ、Mac＋safariではOKでした）
この方法についてはカスタマイズのほうのブログで近いうちに説明記事を書く予定です。
（と、出し惜しみするほどのことでもないんですけどね。実は（笑））

背景以外はほとんど画像を使っていないのでシンプルに見えるかもしれませんが（そんなことない？^^;）、 今回もかなりCSSを足したり引いたりしています。
あまりにもいじりすぎているので自分でも「どこをどうしたらココがこうなったのか判らない…」という部分があったりして（笑）
使っているうちに不具合が出るかも知れませんので何かありましたらご連絡下さいませ。

背景画像以外の素材（サイドバーのアイコン）は「IMAGE」さんからお借りしました。

デザイン変更しました＜手帳＞

前回のデザインがページ全体に画像があるタイプだったので、反動なのか（笑）かなりシンプルなデザインに変更。
（といっても、CSSはかなりあちこちいじっていて自分でもわけが判らなくなっていたり^^;）
イメージとしては「新しい年度を迎えて気分一新頑張るぞ」って感じかな。
（実際のところはともかく「気分」だけでも（笑））

最初、背景画像をスクロール有りにしたら、下の方に来るとホントに何もない寂しい画面になってしまったので固定に変更してみた。
右サイドバーにかかるとちょっと邪魔かな～？

＜'06/04/10 追記＞
この後また調整して、結局body部分にはチェック柄の壁紙（「web*citron」さんからお借りしました♪）を置いて、手帳の写真はcontainer部分に移動、スクロールに設定し直した。
これだったら、右サイドバーが写真で隠れることがないので見易いかと。
また、サイドバーのタイトルを、記事タイトルと同じような付箋紙風に変更。
更に手帳っぽさアップです（笑）

「カスタムCSS」が編集出来るようになったので、変更はもっと楽かと思ったらやっぱりけっこう時間がかかった。
でも、デザインのコピー（マイリストの表示項目も含めて）が出来るのはありがたい。
基本形が決まれば、あとはそれを元に画像を差し替えるだけで済みそう。
といっても、その画像を探すのがまた一苦労なんだけどね。

今回の素材は

• 背景、引用部分、コメント部分の写真
  ■「ミントblue」さん
• サイドバーのアイコン、記事の区切り用のラインなど
  ■「IMAGE」さん

からお借りしました。
ありがとうございました。

CGI設置に惨敗…（泣）

フリーの方のブログにゲストブックみたいなのがあったらいいかなあと思って、 それ用のCGIを設置してみようとチャレンジしていたんだけど… 2時間くらい格闘してもまともに設置出来ず結局諦めてしまった^^;
設置しようと思ったスペースは、放置中（笑）の＠homepageのCGIスペースなので間違いなければアップできるはずだったんだけど…。

もう最初のところからよく判らない。
CGIファイルの中身を自分のサーバーに合わせて書き換えろ、 というのだけれどその書き換え方が合っているのかどうか不安なまま取りあえずそれらしい感じに書き換え。

で、それをCGIスペースにアップロードするんだけど…これがまた、何をどこに入れるのか散々迷う。
お借りしたCGIファイルにはちゃんと「read me」ファイルが入っていて、ディレクトリの並び方もちゃんと書いてあるんだけど… それを見ても合っているのかどうか判らない状態^^;

そして次のパーミッションの変更とかいうのも判ったような判らないような…？？？

一旦（不安ながらも）全部設定が終わったので、ページにアクセスしようと思ったら「ページが存在しません」…。
ガガ～ン…。
このあと何度か各段階をやり直してみて「ページが表示されました」までは行くようになったんだけど、 そこには何もない真っ白なページがあるばかり。

結局、その後2時間くらいやってもダメだったので諦めてしまった(T_T)

もうちょっと集中して基礎知識のサイトを読んだりすれば違うんだろうけど…今日はそこまで集中力がないのでパス。
それにどうしても今すぐ必要なものでもないし。
また時間と気持ちに余裕があるときに再チャレンジしよう。

それにしても、インターネット周りにはいろんな技術があるんだなあ…。

デザイン変更しました＜れんげ＞

やっぱり春は「ピンク」のイメージ。
時期的に「桜」も考えたのですが当たり前すぎるかな～と思って他のを探した結果、あまり使っている人がいない「れんげ（蓮華）」 を選んでみました。
この間までが（寒いのに何故か（笑））寒色だったので、一気に雰囲気が変わりました。
（ちょっと可愛らし過ぎるかも？^^;）

↑クリックで拡大します。

今回は久々に背景一面の大きな写真素材を使いました。
お借りしたのはいつもの「NOION」 さんから。
手前の方だけしか映っていないのにふんわりと焦点をぼかしたことで、どこまでも続くピンクのじゅうたんを想像させてくれます。
蓮華はやっぱり少し咲いているよりも一面にブワ～ッとピンクの花が広がっているのが素敵ですよね。
最近は見る機会もなくなりましたが、 小さい頃母の実家に行くと近所に畑一面に蓮華が咲いている場所があってそこを走ったり寝っ転がったりするのが大好きでした。
重なる文字色との調整のため、元の画像から若干色を飛ばしています。

タイトルバナーと記事の区切り線の画像は「雲水亭」さんから。
「れんげ」にしようと決めたのは、この画像があったからです。
とてもグラフィックとは思えない精密さ。
蓮華草の可憐で、でも力強い感じがよく出ていますよね。

サイドバーのタイトル横に付けたピンクのテントウムシは 「webcitron」さんから。
何かもう一つポイントになるものを…と探していて発見。
ピンクの色味もちょうど合っていたのでお借りしてきました。
小さいのに存在感がある素材ですね。

素材をお借りしたサイト様、ありがとうございました。

カレンダーを過去の日付に遷移出来るようにするスクリプトを発見！

ココログのカレンダーは何故か当月分しか表示してくれなくて、 殆どナビゲーションとしての役割を果たしてくれてないくせに場所ばっかり取ってハッキリ言って邪魔だった。
なのでここしばらくカレンダーはサイドバーから外していたんだけど…先日、「LONGER THAN FOREVER」さんでカレンダーを過去に遷移させることが出来るスクリプトを発見！

■ ココログのカスタマイズ 【カレンダー編（導入）】

実は見つけた後すぐに一度試してみたんだけどどうも上手く行かなくて、ちょうど忙しい時期だったのでその時は一旦諦めてしまっていた。
それからそのまましばらくクリップだけしておいたんだけど、さっきふと思い立って記事を読みつつ再度挑戦してみたのだ。

今回やり直したところ、どうやらスクリプトをアップロードする場所を勘違いしていたらしいことに気が付いた。
「LONGER THAN FOREVER」さんの解説にはちゃんと

利用しているブログのURL直下（http://*****.cocolog-nifty.com/*****/） にファイルをアップロードして下さい。

と書いてあるのに、私はhttp://*****.cocolog-nifty.com/ の下に設置してしまっていたのだ。
ここをもう一回やり直してみたら…出来た！
左サイドバーに設置したカレンダー（折り畳んであります）を見ると、年月表示の横に「≪」が付いているのが判るはず。
この「≪」を押すと、カレンダーが前月に変わる！
そうそう、こういうカレンダーが欲しかったんだよね～♪
しかもこれ、月が動くと記事自体もその月の記事に差し替わるみたい。
ということは月別バックナンバー的な役割もしてくれている、ということね。

難点は一度当月として表示されたカレンダーがスクリプトを読み込んでから表示が変わるので、ちょっとタイムラグがあることかな。
でも「LONGER THAN FOREVER」さんではそれについての回避策も合わせて提案して下さっていて、 私もこの方法で設置しなおしたら殆ど気にならなくなった。
しかも、この方法だとカレンダーが他のリストと同じに扱えるのでむしろ管理しやすいかも。
※スクリプトの設置場所は「サブタイトル」欄となっているけど、「マイリスト」への設置でも問題なく動くようです。

やっぱり出来る人は何でも自分で工夫出来ちゃうんだな～。
素晴らしいです♪

「LONGER THAN FOREVER」さん、ありがとうございました。
ありがたく使わせて頂きます。

デザイン変更しました＜blue cloth＞

 素材サイト「ミントblue」 さんで配布されているタイトル用素材をお借りして、 それに合わせて背景とサイドバー及びエントリーのタイトル部分の画像を薄いブルーに変更しました。

背景画像は 前の＜梅＞で使っていたのと同じタイプの色違いバージョン。
（提供元は「Simple Life」 さんです）
この壁紙素材はシンプルで使い易いけど、使うと全体がキュッと締まる感じでお気に入り♪
「何か他の素材を…」と思っていろいろ探してみたけど、結局この素材に戻って来てしまったという感じ。

全体的に一気に寒色になってしまったので少々寒い感じがするけど…デザイン的には気に入ったのでしばらくはこれで行きます。

「ミントblue」様、「Simple Life」様、 ありがとうございました♪

掲示板＆コメント欄の注意書きを設置

またカスタマイズ魂に火が点いております（笑）
昨日のメールフォームに引き続き、本日はサイドバーに掲示板を設置してみました。

掲示板の提供はメールフォームと同じ「Team Chobies」 さん。
こっちはデザインを選んで作成ボタンを押せばすぐに掲示板用のタグを発行してくれるのでメールフォームより更に簡単に借りられました。
ただ、デザインをカスタマイズするのはちょっと面倒…。
CSSで設定出来るらしいのですが、 どこが何と対応しているのかがなかなか見えてこないのでちょっと手を付けてすぐに挫折してしまいました^^;
で、ちょっと探しに行ったところ 「ブログパーツを探せ」の管理人satokotoさんがご自分でカスタマイズしたCSSファイルを公開して下さっていたので、 それをお借りして壁紙と文字色だけブログ本体に合わせてちょろっと変更してアップしてみました。

お気軽にお試し下さい。
こちらもメアドとURLは任意ですが、お名前だけは書いて下さいね。

＜使い方＞
「よむ/かく」ボタンをクリックすると別画面で書き込みフォームが開きますので、そこに入力してください。
（「アイコン」も使えますが…ちと微妙なセレクションかも^^;）
「送信」ボタンを押すとコメント内容が、入力フォームの下に表示されます。
また、ブログを再読込するとサイドバーにも表示されます。

このメールフォームと掲示板の設置に伴って、コメント欄への注意書き用のスクリプトを「facet-divers」 さんからお借りして表示してみました。
facetさん、いつも「痒いところに手が届く」スクリプト、ありがとうございます♪

■コメント欄の設定を明示する （「facet-divers」）

サイドバーのスクリプトがすごく増えてしまったので、最近あまりチェックしてないし「track word」と内容がかぶっていた「Serch Word Cloud」を外したものの代わりに上記2つを追加してしまったので結局1つ増加してしまいました^^;
重くなりそうなのはなるべく後ろの方に置くようにしているのですが…動作に問題があるようでしたらご連絡下さい。

サイドバーにメールフォームを設置

サイドバーにメールフォームを設置してみた。

ブログって記事ごとにコメントを頂けるのでWebサイトの掲示板より初めての方とでも交流し易いと私は思っていてそこが気に入っている反面、 記事に関係ない話題について書き込むところがないとちょっと不便…と感じるときも時々あった。
で、そんなときのために掲示板かメールフォームみたいなものを付けた方がいいのかな～とボンヤリ思っていた。

と言ってもそんなに差し迫っていたわけでもないのでしばらく放って置いたんだけど、 今日何となく気になったので探してみたらちょうどサイドバーに収まるメールフォームを発見。
設置も簡単そうだったので試しに借りてみた。

お借りしたのは「Team Chobies」 さんの「chobi（ちょび）メール」。
登録画面にメールアドレスを入力して送信するとメールの返信が来て、 そこに書かれたURLにアクセスすると自分用のスクリプトのタグが入手出来る、という仕組み。
ココログの場合だったらそれをマイリストのメモ欄に貼り付けてサイドバーに設置すればOK。

基本のタグのままだと本文入力欄がちょっと狭かったので、マニュアルの説明に従って大きさを調整。
うちはサイドバーは幅200pxで設定してるんだけど、その場合"width（幅） =30"くらいでちょうどサイドバーの幅いっぱいになる感じ。
"height（高さ）"はお好みで。（私の場合は"10"にしてあります）

これで「ちょっと用があるんだけど、どこに書き込めばいいか判らない」とか「伝言があるんだけど、コメント欄には書きたくない」 とかいう要求に応えられたらいいんだけど。

ブログのご意見、ご感想などお待ちしています。
尚、ご利用の際はメールアドレス、URLは任意ですが、お名前だけは必ずお書き下さい。
（ブログ、またはWebサイトをお持ちの方は出来ればURLを書いていただきたいです。遊びに行きます♪）

※書き込み内容の確認画面はありませんのでご注意下さい。
※使ってみて不具合があるようだったら取り外す可能性もあります。

ちなみに、メッセージが投稿されると最初に登録したメールアドレスにこんな件名のメールが送信されてきます。

引用部分の背景に画像を入れてみる

デザインにあわせて引用部分にもちょっと一工夫。

タイトルで使ったのと同じ梅の花の写真を背景にしてみました。
タグはこんな感じです。

/*引用部分*/
blockquote {
background-image:url(画像のurl);
border:1px solid #990033;
margin:10px 15px;
padding: 10px; }

画像は元の写真を不透明度70％くらいの白のマスクで覆ってます。
画像だけ見るとかなり白いかなと思ったのですが、これでも上に文字を載せると「もしかしたらちょっと邪魔かも？」と心配になりますね。
元々全体的に白っぽい写真でもこんな感じなので、色つきの写真の場合はもっと色を飛ばさないとダメかも。
背景を使わなくても、線（border:の部分）の太さ、種類、色を変えるだけで随分雰囲気が変わりますので試してみて下さい。

コメント欄で絵文字が使えるようにしてみた

KOROPPYさんが 「テンプレートをいじらずにコメント欄で絵文字を使う方法」で紹介しているスクリプトを、私も設置してみた。

殆どの部分をKOROPPYさんが記述して下さっているので、 私は画像をアップしてそのファイル名とurlを追加した後サイドバーに設置するだけ…なのに巧くいかないっ！
HTMLやCSSならなんとなく「ここが間違ってるかな」ってのが判るけど、スクリプトになるとまるで意味不明。
でもKOROPPYさんはもちろん他の方も成功しているので、違っているとしたら自分が修正したところだよね、やっぱり…（←当然です） と思いつつ一つ一つ当たって行ったところ…発見！
画像名を指定するところの「'」（シングルコーテーション）が一箇所だけ「"」（ダブルコーテーション）になってしまっていた。
こういうところにガサツさが出るのよね～^^;
ここを修正して再度読み込んだところ、無事設置完了。
テストもうまく行きました。

KOROPPYさん、スクリプトお借りします。
いつもありがとうございます(^^)

画像もKOROPPYさんと同じ「PEPPER」 さんの吹き出しシリーズを拝借。
これは私も大好きで、以前Webサイトに付けていた掲示板でも使っていた素材。
あの大きさなのにちゃんと存在感と意味があるのがスゴイと思う。
作成者さんのセンスに敬服します。

というわけでここのコメント欄でも絵文字が使えるようになりました。
使い方は入れたい場所で入れたい絵文字をクリックして頂けばOKです。
コメント欄、及び確認欄では、絵文字に付けた名前が文字で（「ハート」とか「汗」とか）表示されますが、 投稿していただくと画像に変換されるようになってます。
もし気に入りましたらご利用下さい。

デザイン変更しました＜梅＞

     東京は今日も寒い一日でしたが、暦の上では「立春」 だというのでデザインをちょっと春っぽくしてみました。

タイトルの梅の花の写真は「Four seasons」 さんから。
本当は右下固定の背景として使えるもっと大きな写真だったのですが、何となくページの上に持ってきたいな～と思ったので「加工はご自由に」 という管理人さんのお言葉に甘えて上下を大きく切り取らせて頂いてタイトル画像にしてみました。

背景用には 「+++Simple Life+++」 さんで柔らかい色味のタイル柄画像をお借りしました。
通常の背景とともに、サイドバー、記事のタイトル部分にも設定してみました。

「Four seasons」さん、「+++Simple Life+++」さん、ありがとうございました。

サイドバー、記事のタイトルへの（背景）画像の挿入用タグは以下の通り。

/*エントリータイトルの画像*/
.content h3{
background-image:url(画像のurl);
padding:5px;
}

/*サイドバータイトルの画像*/
.sidebar h2{
background-image:url(画像のurl);
}

デザイン変更しました＜ニット＞

前回替えたときに「多少長めに使える…云々」なんて書いたのに、 冬用に作ったデザインがまだ残っていたのでまた替えてしまいました^^;

白（アイボリー）の毛糸と木製の編み針だけという、 あまり色の変化のない写真なのに何故か暖かみを感じるのが不思議です。
こんな糸でケーブル編みのざっくりしたセーターなんか編むとよさそうですね。

久々に「NOION」 さんの写真素材を使わせて頂きました。
ありがとうございます♪
相変わらずシンプルだけどクッキリした印象の綺麗な写真が満載です。
春の新作がアップされるのが楽しみ(^^)

タイトル画像変更しました＜snowman＞

クリスマスの次なのでお正月っぽくしようかと思っていたのですが、 またすぐに変えるのも大変なので^^;多少長めに使える冬素材を選んでみました。
（ちょっとだけ新年用のメッセージも入れたのでお正月“風”ということで（笑））

今回の画像もクリスマスのときと同じ「A.SLASH」 さんからお借りしました。
ありがとうございます(^^)
「BG IMAGE」のところにある幅650（または700）*高さ180の大きさの画像がタイトル用には使い易いです。

それ以外の背景とかタイトルのラインは前のままでも違和感なかったので、使い回ししてしまいました^^;
「雲水亭」さんの素材です。 ありがとうございます(^^)

アクセス解析を「Acsess Analyzer」に変更

ここしばらく「忍者ツールズ」 を使っていたアクセス解析を、「Acsess Analyzer」 に変えてみた。
理由は「ページごとの訪問件数が判るから」。

「忍者ツールズ」も軽くてよかったんだけど、アクセス数は全ての合計になってしまって各ページごとの訪問件数が見られなかった。
（各ページごとに別々のページのタグを入れれば出来たけど…ブログの場合、それはちょっと面倒くさい。しかもページ数は100までだったし）
それが「Acsess Analyzer」だと、Bodyダグの中に一つだけタグを追加すれば全ページ分のページごと解析をしてくれるのだ。
しかも、アドレスでの表示だけでなく、タイトルを自動的に読みとってタイトルごとに表示されるので非常に判りやすい。

ちなみにこのブログの本日午前中のページごとアクセスはこんな感じ。↓（クリックすると別画面で表示されます）

それ以外にも、いろいろ便利な機能満載。
例えば、

• 複数のサイトを一括管理出来る（しかも登録数の制限なし）
• ログの保存は1年間
• 生ログの細かい絞り込みが可能（時間、ホスト名、IPアドレス、参照元ページ…などなど。複数指定も可。）
• 期間をfrom～toで指定して、累積表示も可

などなど。
もちろん、リンク元や検索語句の参照も出来る。
そして何より、この機能で「無料」なのが偉い！

実は以前（ブログを始める前）Webページの管理がメインだった時に、 ページごとアクセスを知りたいがために某サービスの有料版を利用していたことがあった。
年間で確か3000円くらいだったかな。つまり月にすると250円。
まあ、毎日眺めてはそれなりに楽しんでいたのでそんなに高い金額でもない（雑誌だってこのくらいするでしょう）かなと思えるけど、 こうやって無料でも高機能なサービスがあるのが判ってくるとやっぱり「知ってる」と「知らない」 ではいろんなところで差が出てくるものなんだなあ、と思う。
（ちなみにその有料サービスよりも、この「Acsess Analyzer」の方が機能が上、だと思う（笑））

無料版だとページを開いた直後に数秒画面の上部にサイトロゴが表示されるけど、そんなに大きくないしすぐに消える （5～10秒くらいかな？）からデザインを損なうほどのことではない。
有料版もあるけど、現在はこの広告があるかないかだけの違いで機能的には同等とのこと。
（今後はログ保存期間の延長など機能の付加を検討中らしい）

登録もメールアドレスだけで出来るので、アクセス解析サービスをお探しの方は候補の一つに入れてみてはいかがでしょう。
ちなみにココログへの設置方法は解析タグをサブタイトル欄に放り込んで保存すればOKです。

アクセス解析話ついでに、 「Google Analytics」について。
あんなに大騒ぎをして導入したのに、最近はあまりチェックしてないのが現状^^;
やっぱり私のような楽しみのためだけに記事を書いている単なる一ブロガーには高機能過ぎる感じ。
どこが自分が見たい項目なのかを見つけるだけで大変なのだ。
こういうのはサイトの全体を管理して、ある地点（ページ）に上手く導く方法を常に考えているような管理人さんに適したサービスなんだろうな。
でもそういう、ちゃんと管理しようとしている人より私のように遊びでネットをフラフラしているようなタイプのほうが、 こういう情報を見つけてくるの早かったりするのかも。
で、「そんなに必要なじゃないけど、目新しいから導入しちゃおう」みたいな人が多いから、 アクセス過剰でレスポンスが遅くなったり登録できない状況になったりしてるのかな。
そう考えると、こういう本当の意味で高機能なものは多少でも有料にした方が本当に使いたい人が使える環境を維持できるのかもしれない、 と思ってみたり。
（一番初期にダッシュで入れたお前が言うな、ですね^^;）
まあ、これを無料で「ポン」と提供できてしまう底力をGoogleは示したかったのかも知れないけど。
最近は導入当初に比べれば表示のスピードも速くなっていて内部の改善、容量拡大も進んでいる印象。
新規の登録が再開されて必要な人が一日も早く使える日が来るのを祈っております。

---

＜関連記事＞
■ 「ココログ（プラス）で『Google Analytics』は使えるか」（'05.Nov.17）
■ 「『Google Analytics』、ようやくデータ取得開始」（'05.Nov.23）

トラックバック欄にスクロールバーを表示

トラックバックをたくさん頂くとトラックバック表示欄がどんどん長くなってしまいその下にあるコメント欄にたどり着くのが大変だな～というのは以前からボンヤリ感じていた。
そんな私のハッキリ形にもなっていない不満を解消してくれる技をKOROPPYさんのブログにて発見！

■トラックバック欄にスクロールバー

早速お借りしてCSSに追加してみた。
トラックバック欄の長さが固定されて、トラックバック数が増えてその長さからはみ出ると自動的にスクロールバーが表示される設定。
これだとどんなにトラックバック数が増えてもコメント欄が下がりすぎてしまうことがなくてとても見易い♪
（例えば こことか ここで確認してみて下さい）

そっか～、CSSに何行か書き加えるだけでこんなことも可能なんだ。
何となく働き方はわかるものの、こんなふうに組み合わせて自分のやりたいことを実現するアイディアを考え出すまでには至ってないんだな。
まだまだ修行が必要だ^^;

KOROPPYさん、便利なCSSありがとうございました♪

「トラックワード」（α版）を設置してみる

トラックフィードを提供して下さっているサイドフィード（株） さんから（トラックフィードユーザーあてに）「新しいツールを作ったのでテストしませんか？」とのメールを頂いた。

その名も＜ブログSEO専用。キーワード分析ツール＞ 「トラックワード」。

SEO自体には特に興味がない、というかよく判らないけど、 どんなキーワードでアクセスしてくれてるのか判るツールは好きなので早速使ってみる。
メールアドレスと自分のブログのURLを入力し、IDとパスワードを設定してログインすると自分用のタグが発行されるので、 それをブログに埋め込み。

これで待っていれば自動的に検索ワードがブログの該当ページに表示されるらしい。
このへんは 「Serch Word Cloud」と似てる感じかな。
違いは「Serch Word Cloud」が複数の言葉で検索されても単語一つ一つの検索回数にばらけてしまうのに対して、 「トラックワード」ではその複数の単語をそのままひとまとめで表示してくれる（らしい）ところ。
それと、自分の管理画面にログインすれば、キーワードごととページごとの集計が見られる、とのこと。
（管理画面の集計は1日分をその日の夜集計して翌日表示みたいなのでまだ見えない）

なんだかまだ今ひとつ使い方がピンと来ないけど、検索ワードをチェックするだけでも楽しいのでそれだけでもいいか（笑）
左サイドバーの下の方に表示してますので、興味があったら覗いてみて下さい。

しかし解析ツール、いくつつければ気が済むのだ＞自分^^;

「ACR WEB」さん提供のブログパーツを設置

記事別のアクセス数を表示するパーツをお借りしていた 「サイドバー.jp」さんのメンテナンス終了を待っていたのですが長引いているようなので、 ちょっと他のを使ってみることにしました。

「ブログパーツをさがせ」 さんの紹介記事を参考に選んだのが「ACR WEB」 さんの 『アクセスランキング』と『ページランキング』。
『アクセス～』はどこからこのブログに来たか、『ページ～』はこのブログ内の記事ごとのアクセス数になってます。
集計は過去1週間の累計の設定。
右サイドバーの「最近のアクセス状況」に表示してあります。
尚、サイドバーでの表示はどちらもトップ5までにしましたが、全てのランキングは以下のページで参照できます。
興味のある方は覗いてみて下さい。
■『*second message*へのアクセス元ランキング（全表示）』
■『*second message*内の人気ページランキング（全表示）』
※但し、URLをサイト名、または記事名に置き換えるのは手作業になるので、殆どがURLのままになっています。ご了承下さい。

気分を変えて…デザインをX'masバージョンに変更

クリスマスまでちょうどあと1ヶ月、ということでデザインをX'masバージョンに変更してみました。

変更するのは12月になってからにしようと思っていましたが、昨日変に盛り上がってしまったので気分転換に丁度いいかな、 と思ってちょっと早めに。
これからクリスマスまでの一ヶ月、このデザインで行こうと思います。

ここしばらく白背景の写真素材を固定して背景にしていたのですが、 今回はタイトルバナーにクリスマスリースの写真を使って背景には雪の結晶模様イラストの壁紙を敷き詰めました。
それから、サイドバーのタイトルと記事のタイトル、そして記事のフッターに雪模様のラインを配置。
ちょっと煩いかな、と思ったのですが、期間限定のお祭り気分なのでちょっと華やかな感じにしてみました。

タイトルに置いた文字の縁の処理がヘタクソでギザギザになっているのが何だかな～ですが…ま、ご愛敬ということで （←自分で言うな^^;）。
あと、いつもはブログ名「*second message*」は全部小文字で書いているのですが、 今回のフォントは大文字が入った方が雰囲気がよかったので頭1文字だけ大文字にしてみました。

今回の素材は、タイトルのリースの写真を「A.SLASH」 さん、雪模様の壁紙とラインは 「季節素材 雲水亭」さんからお借りしました。
ありがとうございました(^^)

サイドバーの表示項目をちょっと変更

右サイドバーのトップに置いていたカレンダーを外して代わりにサイト内検索を移動しました。

カレンダーはココログを始めてからずっと表示していたのでどうしようか迷ったのですが、 わざわざカレンダーの日付をクリックして記事を読む人もあまりいないかなあと思ったのと、 何よりココログのカレンダーは当月しか表示できない（何故？）というのが一番の要因ですね。
これでは過去記事へのナビゲーション機能は殆ど期待できないであろう、だったら検索が上にあった方が便利かな、 ということで思い切って外すことに。

ホントはもうちょっと移動しようかと思っていたのですが、今日はココログがなんだか重いので（私だけ？）この辺で。
またヒマを見て調整します。

「サイト内検索」を変更

以前、 「表示ページ内エントリーのタイトルのみを表示させる」でスクリプトをお借りした『暴想』 のなおゆきさんがまた素晴らしいスクリプトを発表されました。
「自分のココログを全文検索するJavaScript」です。

何だかよく判らないけど（笑）すごい勢いで検索してくれるし、しかもついさっきエントリーした記事まで検索可能（←これ重要）。
AND検索も出来るし、検索語を赤で表示してくれるし、設置も簡単だし…他に何か不具合ある？って感じの使い勝手。
素晴らしい！

早速導入させて頂きました。
ありがとうございます♪

左サイドバーに設置いたしましたのでご利用下さいませ。

※ただ、検索結果のリンク先を開くと新しいページになってしまうのはちょっと気になる…けど仕方ないのかな。

---

＜この記事のTB先＞
■「暴想」さんの該当記事

アクセス元の都市を地図上で表示する「gVisit」を設置してみた

「設置してみた」シリーズ連続投稿（笑）

朝からRSSであちこちのブログをうろついていたら「gVisit」というサービスがあるのを発見。
一番参照されている「百式」さんの 「今までとは違う解析」の記事から引用させて頂くと、「gVisit」とは

gvisitはいわゆるアクセスログなわけであるが、Google Mapと組み合わせてある点が新しい。

自分のサイトを訪れた人がどこから来ているか、その位置を地図上で示してくれるというわけだ。

面白そう～♪
しかも「ここの人が見に来てますよ」というのを表現しているのであろう地図上のピンクの吹き出しが妙に可愛い♪（→サンプル画面）
早速サイトにジャンプして登録。

これもスクリプト（「gVisit」のサイト上でブログ名とurlを入力すると自動生成してくれる）をコピペするだけなので簡単。

設置して3時間ほどしてチェックしてみたら既にログが残っていた。
その中にはアメリカのサンディエゴからのアクセスが！
インターネットは世界中に繋がっているというのは頭では理解しているし実際自分だって他の国のサイトへもアクセスしたりしてるわけだけど、 逆に自分のサイト（ブログ）に他の国の誰かが来てくれているというのをこうやって地図上で示されるとまた違った感慨があるなあ…。

同様のサービスでBlogflux提供の「Map Stats」ってのがあって、 こちらは更に詳しいログが取得出来るみたい。（→サンプル画面）
ただ、登録時の情報入力が結構細かいのが難点。
私はサイト名とurlで登録できる「gVisit」で充分かな。

「Search word cloud」を設置してみた

いつもスクリプト関係でお世話になっているfacetさんが「Search word cloud」という 面白いツールを紹介されていた。
※提供元はこちら→ 「YappoLogs」 さん  『ページがどんなキーワードで検索されたかをTagCloud風に表示させるくっつきサービス』

なんでも、

そのページに訪問した際に使われた検索キーワードを自動的に検知してそのキーワード達をTagCloud風に表示させる物

とのこと。
最初は「TagCloudって何？」って感じだったんだけど、まあ検索結果関連のことなのねというのは判ったし、 設置方法も簡単で邪魔にもならないだろうということで私も真似っこさせてもらうことに。
で、早速右サイドバーの下の方に設置したんだけど… こんなアクセス数の少ないブログではなかなか結果は出てこないのであった^^;
どんな風に表示されるのかなあ。楽しみ♪

ちなみに「TagCloud」とは 「はてなダイアリー」のキーワードによると

FolksonomyにおけるTagを雲状に配置し、一覧表示させる手法

らしい。
更に「Folksonomy（フォークソノミー）」とは

【folksonomy】(folks(民衆)とtaxonomy(分類学)の合成語)
多数の人々が思い思いに入力した情報に基づく、ネットワーク的かつフラットな情報の構造。
諸概念を階層的に組織する従来の分類学的発想に対して言う言葉。

…む、難しいっ！^^;

背景画像変更

またしても背景画像を変更してしまいました。
落ち着かなくてスミマセン^^;

今回の写真素材は「-Natural Breeze-」さんから頂きました。ありがとうございます。
センスのいい写真素材ばかりですが、私は何より素晴らしくきれいなお花の写真が大好きです♪
おしゃれなFlash素材も豊富。
こんな素材をさりげなく置いて違和感のないサイトを作りたいものだ…。

画像の変更に合わせて文字色を変更しました。

---

ここのところ、コロコロ画像を替えているのは、 本当は背景画像だけでなく全体的なデザインも含めて変更したいな～と思っているからです。
で、いろいろ他のブログを覗いたり素材を探したりしているのですが、なかなか「これだ！」という案がまとまらないので、 背景だけ替えて自分を納得させている…というわけ。
まあ、別に納期があるわけでもないので気長に考えようと思っています。
それまでの間は今回のように気まぐれでデザイン（画像）が変わることがあるかもしれません。
表示上の不具合などありましたらコメントにてお知らせ下さい。

宜しくお願いします。

背景画像を変更しました。

＜秋バージョン part2＞です（笑）
今月の始めに「落ち葉」に変更したばかりでしたが何だか毎日見ていたらちょっと暗いかな～と思えてきたので、思い立って変更してみました。

写真の花が何なのかハッキリしなかったのですが（多分「千日紅」だと思うのですが）、 色の組み合わせが秋のイメージだったので選びました。
もしかしたら秋の花ではないかも知れませんが、その際は笑って見逃して下さい^^;
オリジナルはもっとクッキリした色味だったのですが、上に文字を載せるのでちょっとだけ明るくしてあります。

今回の写真は「Four seasons」 さんからお借りしました。ありがとうございます♪
すごくキレイでセンスがよくてカッコイイ写真素材がたくさんある素材屋さんです。

1枚の画像を背景にする場合、画像を下に配置するよりも右、または左上に配置するほうが簡単みたいな気がします。
上配置だと背景だけ設定すればそのままで何となく様になるけど、 下配置だとタイトル部分がすごく寂しくなってしまうのでもう一つ何か画像を入れないと締まらないんですよね。
でも、背景とタイトルに入れる小さめの画像を揃えるのがなかなか大変で…^^;
自分で素材も準備できれば一番いいんですがね…。

表示ページ内エントリーのタイトルのみを表示させる

記事を書いているとどんどん溜まってきて検索しにくくなってきます。
私の場合、地味～に超手動で（笑）月別インデックスやら読了本インデックスやらを作ってるわけですが… 自分で好きで始めたこととは言えかなり面倒くさい。
おかげで最近は1週間分、10日分をまとめて処理する…って感じになっていました。

そんな私の「あったほうが便利だけど、面倒くさい、手間がかかる！」というジレンマを解決してくれるスクリプトを発見しました！
「暴想」さんの 『便利！ココログベーシックでタイトルのみを表示させるJavaScript』がそれ。

このスクリプトをマイリストに入れて右サイドバーに設置（ここがポイント。 左サイドバーでは動かない、とのこと）すると、表示されているページの真ん中（タイトルのすぐ下）に「タイトルのみ表示」 というリンクが出てきます。
（詳しい設置方法は「暴想」さんの記事をご参照下さい）
これをクリックすると…そのページのエントリーがタイトルのみ表示されるのです！しかもナンバリングされて！
もちろんタイトルにはその記事へのリンクが張られています。
これ、すごく便利～！

来月から「月別インデックス」はもう作らなくていいや、って勢いです。
だって、月別バックナンバーのページを表示してこの表示にすれば、私の作ってるインデックスとほぼ同等のものが出来るんですから。
カテゴリー分けはされてないけど、それはカテゴリー一覧で同様にタイトル一覧を見てもらえばいいのかな、と。
※「読了本インデックス」は作家別に分けたいので引き続き作成します。

実を言うと、以前からこういう仕事をしてくれるスクリプトはずっと探していて実際にいくつか試してみたこともあるのですが、 設置の方法が（私には）難しかったり、表示され方が何となく気に入らなかったりで導入するまでには至らなかったのです。
でも、「暴想」さんのスクリプトは設置方法も簡単だし、何より表示がシンプルで必要最小限ってところが気に入りました。

「暴想」のなおゆきさん、便利なスクリプトの提供ありがとうございました。
活用させていただきます。

---

設置してみての感想なのですが、これをより便利に使うには「いかに判りやすいタイトルを付けるか」もかなり重要みたい。
いくら一覧になっても内容が判断できないタイトルではあまり意味がなさそう。
今まで以上に注意しよう。

デザインを秋バージョン＜落ち葉＞に変更しました

夏は＜海＞の他にヒマワリか何かでもうワンパターン作ろうと思っていたのですが、結局そのまま夏の終わりまで来てしまいました…。

というわけでちょっと季節は早いような気がしますが、秋バージョンに模様替えです。
秋は色味が渋いので落ち着いた感じになりますね。

今回の写真は壁紙用のベンチが 「a day in the life」さん、タイトルの落ち葉は 「q__fuul in my room__p」さんからお借りしました。
ありがとうございました(^^)

写真を選んだり加工したりしていたら、エネルギーが尽きてしまったのでリンク色や文字色はまだちょっと適当です^^;
また気が向いたら後日変更するかも。

デザインを夏バージョン（海）に変更しました

梅雨が明けたら変更しようと思って作って置いたデザインなのですが、 なかなか梅雨明けしないし丁度今日は「海の日」だしということでちょっと早いですが変更してみました。
（と思っていたら、今日関東まで梅雨明けしたようですね。いよいよ夏本番です）
変更と言っても背景写真とタイトル、文字色を変えただけで他は殆ど前の「梅雨バージョン（紫陽花）」と同じなのですが、背景が変わると一気にイメージが変わりますね。

私自身は夏も海も苦手なのですが^^;、写真で見る限りでは涼しそうでいいですよね～♪
こんなキレイで、しかも誰もいない海だったら行ってみたいかも。

今回の背景写真は 「自然いっぱいの素材集」さんからいただきました。
ありがとうございます(^^)

そう言えば、今日は 「feed meter」も「海の日バージョン」で波模様になってますね。
（うちでは左サイドバーの一番下に設置してあります）
ここはこんなに小さなスペースなのに祝日とか行事に合わせてさりげな～くデザインを変えてくるんですよね。
機能としては最近殆ど活用していないのですが^^;、その遊び心はお気に入りです。

サイドバーに「cirClock」を設置

サイドバーに時計が必要だと思ったことはなかったんだけど、偶然「K::M-t b.g.s」さんの「cirClock」 を発見してその微妙な色合いと雰囲気に一目惚れ(^^)
早速お借りして左サイドバーに貼り付けてみた。

オリジナルの色（淡くてくすんだグリーン）も良かったけど、サイトの中にある「Tag-Maker」 という機能を使うと利用者が自分で本体の色を自由にカスタマイズ出来るようになっている親切設計。
（しかも適当に動かしても透明感のあるきれいな色に仕上げてくれる♪今回は背景に合わせてブルーと紫を選んでみました）
更にブログに投稿した時間を表示出来る「RSS Time」も付いているというスグレモノ。

心配なのは、ココログのサーバー状態によっては読み込みが遅くなるかな、ということ。
最近は安定してるので大丈夫かと思うのだけど。
重くなったらその時また考えよう。

今回設定を始めてみたらちゃんと表示されるまで2時間近く掛かってしまった（汗）
原因は私が説明をちゃんと読まないまま始めたので必要事項に見落としがあったため。
説明はちゃんと読みましょう^^;
（読んでからやれば簡単です）

プロフィールページのカスタマイズ

ブログ本体のカスタマイズをしたので、プロフィールページも直しておこうと思って触ってみたけどタイトル画像とか文字色は設定できても、 背景画像が持ってこられない。
この背景こそがメインなのに～！とちょっとヘコむ。
でも絶対なにか手があるに違いない！と思い直して「ココログ プロフィール カスタマイズ」（そのまんまだ^^;） をキーワードにしてググってみた。

そうしたら、ありました！
「36ph engine」さんの「プロフィールのカスタマイズ」の記事が！

なるほど、CSSへのリンクを自己紹介欄に埋め込めばいいのか！
早速やってみる…。

…おお、ちゃんと紫陽花がプロフィールページにも♪

ついでにその下に書いてあった「戻る」ボタンも付けさせて頂く。
うん、イイ感じ。

この「36ph engine」さんは去年の4月でココログからは撤退してMTでブログをしていらっしゃるらしい。
（新しいアドレスはこちら）
ココログの記事を残しておいて下さってありがとうございました。
おかげで助かりました♪

あっ、今別のやりかたを思いついた。
プロフィールページにもマイリストを表示出来るんだから、CSSへのリンクを埋め込んだリストをここにも表示させるようにすればいいのでは。
（私は右サイドバーの下の方のリストに埋めてある）
やってみる…OKでした。
ちょっと頭使えよ、ってことですね～^^;

---

そう言えば、「プロフィールページのテンプレート」（管理画面→コントロールパネル→プロフィールページ）のところで、いつのまにか 「自作のテンプレートを使用する」ってのが使えるようになっていた。
「ココログヘルプ」によると

「自作のプロフィールページ用テンプレートを使用する」は、ココログプロのユーザーのみご使用になれます。

とのことなんだけど。（私はプラスプラン）
もしかしてこれも 先日のエラー（？）の一部なのでしょうか？
（こんなところ滅多に見ないので気が付かなかったよ（笑））
明日のメンテナンスで直るのかな？

※今夜も重いです…(T"T)

デザイン変更しました

先日関東地方も梅雨入りしたので（笑）、季節に合わせてデザインを変えてみました。

このあじさいの写真はすごく綺麗だったのでいつか使いたいと思っていろいろ設定を考えていたのですが、この間までの 「CSSを使ってあれもこれもやってみる」路線には合わなくてしばらく保留にしてあったもの。
ここに来てようやく「いろいろくっつけるのも飽きてきたな～」と思えたし季節もちょうど良かったので、 この写真だけを背景に使ってあとの装飾は殆どなくしたデザインに変えてみました。
残ったCSSは背景、フォント、引用とカレンダーの日付の部分くらいかな。
こんなシンプルで綺麗な写真にはこのくらいの方が合うと思うのですが、いかがでしょうか。

ちなみに今回のデザインのポイントはサイドバーと本文の透明化。
文章が乗る部分を透明にして、その下の背景を全面に表示させるという方法です。
透明化の方法は以下の通り。

#container, #banner, .content, #left, #right
{background-color: transparent; }

このやり方だと背景の画像を変更することでどんどん雰囲気を変えていけるので、 今後は季節に合わせて変更していこうかなと思っています。
いろいろな素材サイトさんがきれいな写真を提供して下さっているので次はどの写真を使おうか今から楽しみです。
今回のあじさいの素材は前回と同じ 「NOION」さんから頂きました。
いつもありがとうございます(^^)

やっと元に戻った…（タイトル画像部分の余白修正）

今日ココログが長い時間メンテナンスしていたので何かあるんじゃないかと思っていたら…不安的中。
このブログのタイトルの画像が前に使っていたピンクバージョンの時のに戻ってしまっていた！

今日は会社でもネットワークの不調でWebが殆ど見られなかったので、家に帰ってきて開いてみてビックリ！
何だかすご～く間が抜けたデザインになっていて、見ていて悲しくなってしまった(T_T)

で、早速画像の変更を管理ページのデザインのところで実行したんだけど…今度は、 タイトル画像の上下左右に余白が出来ちゃうじゃないですかっ！
せっかくこの間CSSを書き換えて消したのに～っ！
「もしかして画像を間違えてる？」（同じイメージで文字の色や位置を微妙に変えたのを幾つか作ってあるので） と思って確認したけどやっぱりあってるし、「じゃあCSSファイルをもう一回アップしたらどうかな？」 と思ってアップロード→反映をしてみるけど効果なし。
（この時、反映するまでに恐ろしく時間がかかって2回くらい途中で接続切れになってしまったのにはイライラしたっ！）

「う～ん…」と思いながら、CSSファイルを見比べていたら…書いてある内容が変わっているのを発見！

以前はバナー画像の部分は

a#banner-img {
display: block;
background:url("画像のurl")
no-repeat 15px 15px;
padding: 15px;
height: 150px;｝

ってな感じになっていて、この中の「no-repeat」の後ろの15px 15pxをどちらも0pxにすると余白が消えたんだけど、 今回のCSSファイルでは

#banner-img {
background: #FFFFFF url("画像のurl")
no-repeat 15px 15px;
height: 180px;
}

となっていた。
以前は「a#banner-img」だったのが「#banner-img 」に変わっていたのだ。
このため、以前の設定のままでは適用されなかったと思われる。（多分）
と言うことで、この部分の「15px」を「0px」に、それと私のバナーは高さが150pxなので「height 180px」を 「150px」に修正。
更に、その次に

div.img-link a {
display: block;
height: 180px;
text-decoration: none;
}

と言う部分があって、ここでも高さの設定があるので、ここも180を150に修正。
この2箇所を元のファイルと置き換えて、改めてアップロード→反映してみたら…やっと元に戻った～♪
あ～、良かった。

確かに本来は触れないはずのCSSを無理に読み替えさせているのはこちらの都合だからCSSの要素が変更になるのは仕方ないと思うけど、 バナー画像自体が変わってしまうっていうのはちょっとひどい
これはココログ側が提供してくれた仕様の中で、ちゃんと設定したものなんだけど。

バージョンアップしてくれるのは嬉しいけど（と言ってもまだ何も検証していないので、どのくらい良くなったかは判らない。 後でツッコミ記事を書くかも）、ユーザーのデザインを勝手に変更するのは勘弁して下さい。
お願いします。

投稿した日のカレンダー日付に色を付ける

投稿した日のカレンダー日付に背景色が表示されるように設定してみた。

#calendar a {
background-color:#e8ebc7;
width: 20px; line-height: 20px;
display: block; margin: 0 auto; }

赤字の部分の色が背景色、青字の数字が塗りつぶされる一つのマスの大きさ（widthが幅、line-heightが高さ）。
ご自分のブログで利用する場合は、文字の（リンク）色や大きさに合わせて変更してからどうぞ～。

新デザイン（グリーン）の変更ポイント

今回のデザインで使った（変更した）主なCSSタグを覚え書きも兼ねてアップしておく。

■背景
「NOION」さんで頂いた画像 （1024px×400px）を「画面下中央に固定」で設定。

body {
background-color: #ffffff;
background-image: url(画像のアドレス);
background-position: center bottom;
background-repeat: no-repeat;
background-attachment: fixed;
}

■タイトルバナー
背景画像に使った画像から815px×150pxの大きさを切り抜いて別名で保存。（PhotoShopLE使用）
そこにタイトル文字とサブタイトルを載せて上書き。（HPビルダー付属ウエブアートデザイナー使用）
これをココログ管理画面の「デザイン」→「スタイル」→「タイトルバナー」のオプション設定でアップロード。
「タイトルバナーに画像を使用する」にチェックを入れておく。
このままだと画像の上下と左に余白が出来てしまうため、CSSファイルを変更してその部分を削除。
（この余白の意味は何？）
a#banner-img部分を抜き出して、変更用のCSSファイルにコピー＆ペーストした後

a#banner-img {
display: block;
background: #FFFFFF url(タイトルバナーのアドレス) no-repeat 0px 0px;
padding: 15px;
height: 150px;
 }

変更前は赤字の部分が15px15pxになっているのでこの数値を「0」に変更して保存。

※自ブログのCSSファイルの取り出しは「るるが株式会社」 さんのこの記事を参考にさせて頂きました。
　 普通に「ソース」を表示して出てくるのとは違うファイルなのね^^;
　 この中から該当箇所を見つけるのがまた大変…。
　

■サイドバーのタイトル画像
画像をアップロードして、.sideber h2の部分に反映させる。

.sidebar h2 {background-image: url(画像のアドレス);
background-repeat: no-repeat;height: 28px;padding-left: 23px;}

赤字の部分は実際の画像の大きさに合わせて。
今回のピンは実際には28px×20pxだったが、20pxだと文字との間隔がキツキツになってしまったので23pxに設定。

■カレンダーのタイトル画像
前回サイドバーのタイトルに画像を入れた時、カレンダーだけは反映されないので「む～(T"T)」と思っていたのを今回は何とか対応。
CSSファイルの#calendar captionに対応しているらしいのでこの部分を抜き出して、

#calendar caption {
 color: #336600;
 font-family: 'Trebuchet MS', Verdana, sans-serif;
 font-size: medium;
 border-bottom: 1px solid #849284;
 text-align: left;
 padding: 3px;
 letter-spacing: .3em;
 background-image: url(画像のアドレス);
background-repeat: no-repeat;
height: 28px;padding-left:23px}

と、サイドバーのタイトル画像の設定と同じ一文を追加したら無事成功。

■引用部分

blockquote {
background-color:#ffffff;
border:1px solid #5a755a;
padding: 5px; }

赤字の部分を変更すると好きなように引用符を設定できる。

■記事タイトルの背景
画像を使ったり、グラデーションにしてみたりといろいろ試してみたけど、結局付箋紙風味のボーダーに落ち着いた。

.content h3{padding: 5px;
background-color: #ffffff;
border-right: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
border-left: 15px solid #adb27b;
width: 300px;position: relative;left: -20px;}

右と下にグレーの細い直線、左に濃い色の太い直線を持ってくることで付箋紙を貼ってあるみたいに見せちゃうところが面白い。
更に、positionをマイナスにすることで記事本文よりもちょっと手前から表示されているのがポイント。

以上が、今回手を加えた部分。
もし使える部分がありましたら、ご自由にどうぞ。
但し、私は自力でCSSを記述することは全く出来ないので、 上記の変更部分は全てどこかよそのブログ様やカスタマイズ用書籍からの頂き物です。
かつ、自分で勝手に改変しているので、正式な記述として正しいかどうかも不明…^^;
自分で使った分には思った通りに表示されているようなので大きなミスはないと思いますが、 ご自分のブログへの適用については自己責任でお願いいたします。

---

最後にいつもお世話になっているブログ、本のご紹介。

ブログについてはあまりにも色んなところを回ってちょこちょこ使わせて頂いているので、全てを覚えているわけではないので （申し訳ありません（汗））記憶やブックマークにある分のみで。

★「詞織」さん
★「埼玉住人」 さん
★「ケセラセラ」 さん
★「KOROPPYの本棚」 さん
★「るるが株式会社」 さん

などなど。
いつもありがとうございます。

本は「ポータル、プロバイダ別 blogデザインカスタマイズ辞典」（毎日コミュニケーションズ）が大活躍中。
「ココログ」だけでなく、「Movavle Type」「はてな」「Livedoorブログ」「エキサイトブログ」「JUGEM」 「Doblog」「2ちゃんブログ」 の計8つのブログに対応してそれぞれの変更方法が書いてあるので1,000ページを超える電話帳のような厚さで値段も2,980円（税別）と安くはないけど、 やりたいことを探してそこをそのまま書き写すだけで反映されるので簡単！
「ウェブログ・デザイン」（エムディエヌコーポレーション刊。「ココログ」「Movavle Type」「Blogger」の3つに対応） がココログのプランの区別をきっちり守った「純正品」なのに対して、「ポータル、プロバイダ別～」は裏技満載の「海賊版」 （と言う言い方はあんまりか…^^;）と言う感じだけど、私のようなCSSの知識はないし「プロ」 プランじゃないけど自分のオリジナルなデザインにしたいなあと思っている人には最適かと。

ポータル、プロバイダ別 blogデザインカスタマイズ事典 外間 かおり by G-Tools

ウェブログ・デザイン こもり まさあき by G-Tools

※「ポータル、プロバイダ別blogデザインカスタマイズ事典」の内容はこちらのページで確認出来ます。

デザイン変更！

この間ピンクに変えてからまだそんなに経っていないのでこんなに早く変えるつもりはなかったんだけど、 作っているうちに気に入ったのが出来てしまったのでエイッ！と切り替えてみた。

いろんな色を組み合わせてキレイに見せるセンスがないので、 ある1色をテーマにしてそれのグラデーションや類似色でまとめるのが私には一番やりやすいみたい。
と言うことで今回のテーマカラーは「グリーン」…見たまんまだ（笑）
でもテーマカラーを決めてもそれに合わせて「文字色」とか「線の色」とか一つ一つ決めていくのは一苦労。
ちょっと色味が変わると雰囲気も随分変わってしまうので、読みやすく かつ 自分のイメージに近い色を探すのに何度も設定してはチェックして…を繰り返したので、ここが一番時間がかかった。
しかもそこまでしても記事本文に使った茶色はどうも今ひとつ納得出来ていない…。
もうちょっとどっしりしてるけど、色味は「茶色」だって判るような色が欲しかったんだけど… なかなかその辺の微妙な調節が上手く行かなくて思ったよりも明るめの色で妥協してしまった。

私の場合プランが「プラス」で同じアカウントで3つまでブログが作れるので、これを利用してデザイン変更時確認専用のブログを作ってある。
これは別に公開はしていなくて、ただCSSファイルを書き換えたり、画像をアップして「これをこう変えるとどう表示されるのかな～」 とテストしたりするためだけの場所である。
（と言っても非公開には出来ないので、テストで記事を書くときは日付を過去に指定して新着に載らないように注意している）
　　※上記内容は間違っていたので削除致します。
　　※「公開用設定」で「更新通知をしない」にしておけば、現時点の日付で保存しても新着には登録されません。
　　※涼さん、ご指摘ありがとうございました。（05/03/21 追記）
実際に動いているブログでこれをやると、時間によっては読み込むたびに表示が変わったり最悪デザインが崩れている場合もあったりするし 何より意味もなくカウンターが回るのがすごく気になってしまうのだ。
デザインを変更・ 修正する場合は反映させる前に確認することが今の状況でも出来るけれどあの確認用の小さい画面では今ひとつ全体を把握しきれない （特に今回のように背景に画像を持ってきている場合は）ので、この方法は自分でもなかなかいいアイディアだったと思っている （←自画自賛^^;）。

今回のデザインの「要」とも言うべき素敵な背景画像を提供して頂いたのは写真素材サイト「NOION」さん。
透明感があって使い易いサイズ別の写真素材が満載のステキな素材サイトさん。
素材の加工に関して『原形を留めなくても構いません。』と言い切る気っぷの良さが好きです♪
私の使い方は如何でしょうか？
（サイドバータイトルのピンの画像も同じく「NOION」さんからお借りしました）

画像とかで見た目は変わったように見えるかもしれないけど、使っているCSSは前回と殆ど同じ。
変えたのは記事タイトルの表示くらいかな？
これらの詳細については次の記事で。
（と言っても殆ど全てよそ様のblogや本からのパクリだったりはするわけだが^^;）

サイト内検索ツールを変更

今まで「ココログル」 を利用したサイト内検索ツールを設置していたんだけど、これを「Google」に変更してみた。

「ココログル」の検索結果はRSS対応のため更新後すぐに反映するところは良かったんだけど、更新日によって「最近の○○日間の検索結果」 と区切られてしまうため古い記事だとページ移動がかなり多くなってしまうのがちょっと不便。
で、「変えようかな」と思っていたところ、 「無意味なブログを検出しました！」さんの『記事検索リニューアル』で「Google」で「フリー検索（カスタマイズ版）」 と言うサービスがあることを知り早速試してみることに。

自分のサイト（blog）のロゴ画像の挿入や、文字色・リンク色の指定などが出来るのでこのブログの設定に合わせて入力してみる。
プレビューしながら調整して、OKな状態になったところで「送信」を押す（このときに自分のメールアドレスやサイトの記入が必要） と画面に変更した内容を含んだタグを表示してくれるので、それをコピーして「マイリスト」（リンク）のメモ欄に貼り付け→保存。
画面を確認してみるとサイドバーからはみ出してしまうので、googleのロゴの大きさと項目の並び方、テキスト入力欄の大きさを変更。

次に検索結果を確認したところ、文字化けしてしまうことが判明。
調べたところ、同じgoogleの「サイト検索 （ベーシック版）」のところに

もし不具合が発生した場合はコードの ＜input type=hidden name=ie
value=Shift_JIS＞ の部分を＜input type=hidden name=ie value=EUC-JP＞ もしく
は ＜input type=hidden name=ie value=UTF-8＞ に変更してください。

と言う記述があるのを発見。
で、試してみたら私の場合「UTF-8」で文字化けが解消された。
（上記の引用は誤作動防止のため＜＞を全角に修正してあります）

と言うことで「見た目」はなかなかいい感じに出来たんだけど、
1.検索対象がタイトルと記事本文だけでなくフッターとかサイドバーの記述も読んできてしまうため検索結果が驚くくらい多くなる
（「トラックバック」なんて言葉で検索するとほぼ全ての記事が結果として表示される）
2.記事を登録してから3日くらい経たないと検索対象にならない
と言う欠点もあり。

と言っても1.については、タイトルや記事にその言葉が入っているものが上位に来ることになるようだし、 2.は最近のものだったらトップページには表示されるからその辺でカバー出来る問題かな。

左サイドバーに設置してあるのでどうぞご利用下さい。

「サイドバー.jp」のツールを設置

バックナンバーのプルダウンの記事を見に「facet-divers」 さんに行ったとき、サイドバーに「『リンク元』と『ページごとのアクセス数』のリスト」 が設置してあるのを見て面白そうと思いサービス提供元の 「サイドバー.jp」に行ってみた。

サイドバーに取り付けるいろいろなパーツを提供してくれているサイトらしい。
早速私もfacetさんのところと同じ「リンク元」と「ページごとのアクセス数」を表示する『統計設定』を選んで右サイドバーに付けてみた。

みたんだけど…う～ん、やっぱり読み込みが重くなってる感じ？
結構見えない部分にスクリプトをいくつも埋め込んでいたりするからねえ…。

こういうの好きなんだけどなあ…しばらく使ってみてどうしてもダメならまた考えよう。

※右サイドバーの下の方に「最近のアクセス状況」として表示してあるので参照してみて下さい。

「月別バックナンバー」をプルダウンメニュー化

夕べRSSリーダーでココログの新着記事を流していたら以前サイドバー折り畳みの設置でお世話になった「facet-divers」 さんのブログに 『月別バックナンバー プルダウンメニュー』の記事を発見。
以前から「出来たらいいなあ」と思っていたカスタマイズだったので、早速試してみた。

最初何も考えずいつものように「マイリスト」の「リンク」 のメモ部分に頂いてきたスクリプトを貼り付けてそのまま追加したらサイドバーの折り畳み部分が変な風に開いたり閉じたりする。
「ムムム…」としばし考えたあと、ふと思いついて折り畳みスクリプトに記述してあった「バックナンバー」 部分の折り畳み用記述を削除して再度確認。
今度は無事、思った通りに設置出来ていた！
嬉し～い(^^)

ココログのバックナンバーだと10ヶ月分しか表示されないらしいが、これだと自分がココログを開始した年月から全部表示できるとのこと。
但し、

ブログを書いていない月があっても問答無用でリンクが張られてしまいます。月に一度は記事をかいていないと不具合がでますので、 その場合は記事を捏造してください（笑）

との注意書きが。
私は今のところ1ヶ月丸々何も書かないということはなさそうだけど、注意しておこう。

■facetさん、いつもありがとうございます♪上記記事にトラックバックさせて頂きます。

デザインを変更しました

一日なにもやることがなかったので久々にデザインを変更してみた。

タイトルに使わせて頂いた写真は「Stylish」 さんから。
この透明なゼリーのきれいなピンクが気に入って、白とピンクと灰色を基調に色をまとめてみたんだけど…ちと甘すぎるかな？
まあ、テーマは「春を待つ心」って感じで…^^;

全体の背景に壁紙を持ってこようと思ってあちこち探してみたんだけど、どうしても「これだ！」と言うものに出会えず。
「いいな」と思うのはもちろんあるんだけど、いざ壁紙として試してみると何となくイメージが違う…。
で、結局色指定だけにしてしまった。
残念。

リンク色なども、色を揃えながらもなるべく見易い、判りやすいように選んだつもりだけどどうかな。
もし、「見難い」「紛らわしい」など意見がありましたら考慮しますのでご遠慮なくコメントして下さい。

■追記
＜その1＞
背景素材をしつこく探していたところ、「+++SimpleLife+++」 さんで優しくて微妙な色合いのタイル柄を発見。
早速頂いてきて変更。

＜その2＞
タイトル画像の文字がちょっとぼやけた感じだったので、気持ちハッキリした色で作り直し。
ちなみにサブタイトルを書いたフォントは「しねきゃぷしょん」という映画の字幕をイメージしたオリジナルフォント。
雰囲気があって可愛らしくて気に入っている(^^)
※こちらでダウンロード出来ます。→ 「窓の杜」

コメントのツリー化に成功！

前から何度も試しては「上手く行かない…」と諦めていたコメントのツリー化に遂に成功した。
参考にさせて頂いたのは「くくさんののっぺりブログ」 内『ブログ人でコメントをツリー化」の記事。
（ブログ人じゃないけど出来ました♪）

こちらはスクリプトの記述の説明と共にツリー化する際の画像もダウンロード出来るように準備されていてとても助かった。

くくさん、どうもありがとうございました。
トラックバックさせて頂きます。

サイドバーのタイトルにアイコンを設置

思い切ってデザインを変えてみようかな～と思ったんだけど、最後までやり遂げる集中力に不安があったので取りあえずちょっとだけ変更。
サイドバーのタイトルの前にアイコンを設置してみた。

参考にさせて頂いたのは、 「ケセラセラ」さんの＜タイトルとサイドバーのリストにワンポイント画像をつける。＞の記事。
これだけ丁寧に書いてあるのに、一度目はアップした画像の名前を間違えて上手くいかずにやり直ししている自分が情けない… (T_T)
でも、出来てみるとこれだけでもちょっと変わった感じがして嬉しい♪

「ケセラセラ」のゆっこ様、ありがとうございました。
該当記事にトラックバックさせて頂きました。

ココログでのカウンター設置方法

＜事前準備：タグの入手＞
無料のカウンターレンタルサイトに登録して、カウンター用のタグを入手する。
※入手方法はサイトによって異なるので、サイトの説明に従って手続きして下さい。

レンタルサイトは主なところでは、
・忍者TOOLS
・スゴいカウンター
などがあります。
＠Niftyの会員なら「＠Homepage」 のカウンターも無料で利用可能。
その他、検索サイトで「カウンター 無料 レンタル」などのキーワードで検索すればたくさん出てきますので、お好きなところを選んで下さい。

＜カウンターの設置＞
■タイトル部分への設置

1. ココログの管理画面にログインし、「ブログ」タグ→（便利メニューから）「設定の変更」をクリック。
2. 「ブログの基本情報」が表示されるので、その中の『ブログのサブタイトル （キャッチフレーズ）』が記入してある部分に、上記で入手したタグを全てコピー＆ペーストする。
3. 画面下の「変更を保存」ボタンを押す。
4. 画面が切り替わった後に表示される「サイトに反映」ボタンを押す。

■サイドバーへの設置

1. ココログの管理画面にログインし、「マイリスト」タグをクリック。
2. 「マイリストの新規作成」で『リストのタイプ』が＜リンク＞のリストを作成する。
   ※名前の欄は入力した文字がサイドバーにタイトルとして表示されます。（例：カウンター など）
3. 「最近の項目」というページに切り替わるので、ここで「項目の追加」をクリックする。
4. 「項目を追加する」ウィンドウが表示されるので、その中の「メモ」 欄に入手したカウンター用のタグをコピー＆ペーストする。
5. 「追加」ボタンをクリックする。
6. ウィンドウが消え、元の「最近の項目」ページに戻るのでそのページに表示されている「設定」タブをクリックする。
7. 画面の一番下の「メモの表示」を『テキスト表示』に変更し、 「変更を保存」ボタンを押す。
8. 「ブログ」タブ→（便利メニューから）「デザインの編集」→「コンテンツ」をクリック。
9. 「マイリスト」の一覧の中から、2.で作成したカウンター用のリストを選択しチェックボックスにチェックを入れ「変更を保存」。
10. 「並べ方」をクリック。
11. 「表示コンテンツの並べ方」画面が表示されるので、作成したカウンターを好きな場所に移動して「変更を保存」。

サイドバー不具合修正

夕べ記事をアップした後に自分のブログをチェックしたらサイドバーの折り畳みが開きっぱなし状態になっているのに気付いた。
多分昨日のココログのメンテナンスによる影響だと思う。
気になったけど時間が遅かったので夕べはそのままして、今日帰ってきてから修正を始めた。

「他にも同じ状態のブログがあるかも？」と思い、ココログルで探したところ早速「Daa's Blog-ちょっとしたメモ-」さんの『サイドバー折り畳み不具合修正』の記事を発見。
そこからのリンクでこの折り畳みスクリプトの作者facetさんの『ブログ人のHTML変更に伴うjavascriptの不具合について』と言う記事に辿り着いた。
この中の＜暫定的な対処方法＞に記述してある方法を試したところ無事解決。
良かった良かった♪

実はfacetさんのブログには「もしかして？」と思って夕べちょっと行ってみたんだけど、昨日の日付での更新がなかったので「まだ記事にはなってないんだな」と諦めてしまっていたのだ。
それが「ブログ人」の不具合対応の記事の中に解決法があったなんて！
Daaさんの記事がなければ気付けなかったと思う。

Daaさん、そしてfacetさん、ありがとうございました。
それぞれトラックバックをつけさせていただきます。

サイドバーの折り畳み

サイドバーがあまりにもダラダラと長くなってしまったので、公開されているscriptをお借りして折り畳んでみた。
参考にさせていただいたのは「facet-divers」さん内の「サイドバー折り畳み２：状態保持機能付き」の記事とscript。

実は随分以前にも（多分）こちらのscriptを利用して折り畳みをしてみようと一度挑戦したことがあった。
でもその時は何故か思った通りの場所で折り畳むことが出来ず、でもこの手の知識が全くない私はどこが悪いのかさっぱり判らずで結局「ムキ～ッ！」となって投げ出してしまったのだった。

で、今回思い立って再挑戦してみたら意外にもサクサクと出来て15分ほどで無事設置完了♪
別に前回と今回で私の知識に何かがプラスされたわけではないんだけど…。
このscript自体、改良が加えられたとのことなので、その中に私に決定的に足りなかったものを補完してくれる「何か」があったのでしょう。
それは何かは判らないけど、まあ、無事に出来たのでヨシとしよう（笑）

facetさん、ありがとうございました。
お借りいたします♪

デザイン変更しました。

秋らしい渋めの色か、暖色系にしようと色々組み合わせていたのですが、結局自分の好きな薄いブルーがメインになってしまいました。
色だけだとちょっと寒々しかったので、写真入りのバナー作りに挑戦。
そんなに凝ったデザインではないのでそのものを作るのにはそんなに時間が掛からなかったのですが、タイトルと記事の間にスペースが空いてしまうのがどうも納得行かない。
時間をかけて何度も調整したのですが、結局どうやっても上手く行かないのでそのままアップしてしまいました。
多分CSSファイルあたりを触れば調整できるかと思うのですが…今日はそこまでやる気になれませんでした（汗）
また気が向いたら勉強して挑戦したいと思います。

タイトルの画像は写真素材サイト「ｆｕ*ｆｕ」さんから頂きました。
（「fu*fu」さんは04年12月で残念ながら閉鎖されました）
透明感のある綺麗な写真がたくさんあって、以前からよく利用させていただいています。
ありがとうございました。

デザイン（配色）変更

今までの配色が濃い色でちょっと暑かったので、思い立ってデザインを変えてみた。
最初は背景や文字の配色を自分で全部設定してみようかと思って始めたけど、考えているうちにどれとどれを組み合わせるのがいいのか段々判らなくなってきてしまい挫折（汗）
結局、既存のテンプレートを元に変更することに。
本当はブルー系が好きなので青を基調にしようかと思ったんだけど、何となくアクセントに「オレンジ」色が使いたかったのでグリーン系の「ボックスカーキ：3列」を選択。
文字色とか背景を微妙に変えて設定してみた。
以前よりは色味が薄くなったので多少は涼しく見えるかな？

それにしてもココログは（原則的には）プロ以外ではデザインのCSSは触れないって事になってるんだから、その分もう少しテンプレートを増やす努力をしてくれてもいいと思うんだけどなあ。
私は自分で画像を準備して…なんてところまで凝るつもりはないので、今あるのを利用しようと思っても結構ビックリするような色の組み合わせのものが多くてあまり使えるのがないのよね。
せめて自分で組み合わせが出来るように、配色の色見本だけでも置いてくれると嬉しいんだけど。
素養がない人間には自分で一から考えるのはキツイっす…（泣）

サイト内検索を設置

Curryさん（「ココログル」の作者さん）の「健康な生活を送ろう！」＜自分のココログ内だけをココログルで検索する方法＞を参考に設置してみました。

左サイドバーにありますので、ご利用下さい♪