Spry Archive

TOPページのリニューアルに伴い、別ページとしてポップアップ開く「Episode History」をTOPページ下部に設置しました。

設置にはEpisode5まで使用していたSpry Widget のタブ付きパネルを利用し、エピソードごとのタブを設定しました。

これで少し過疎化していたTOPページが少し意味あるものになりました。

タブ付きパネルの設置には Spry Widget に記述されているソースの他に、SpryTabbedPanels.js と SpryTabbedPanels.cssが必要です

なかなか時間がなくてやっていませんでしたが、TOPページのデザイン変更を行いました。

デザインをBLOGと一致させる（普通はTOPページにBLOGなどのコンテンツを合わせるのが普通でしょうが・・・）事と、サイトとBLOGの一体感を持たせる為に、TOPページとBLOGに同じ、「BLOG記事のカテゴリーアーカイブのメニュー」を設置しました。

この「BLOG記事のカテゴリーアーカイブのメニュー」は現状ではあまり意味がないですが、何気にSpry framework for Ajaxの折りたたみパネルになっています。

今後、この機能を使って、BLOGの記事ページをWEBサイトとして構築していく事が可能になると思います。

ブログをランキングサイト等に登録しだして、そのブログパーツなどをK2style.netのTOPページにも配置していたのですが、段々とゴチャゴチャして見栄えが悪くなってきたので、折りたたみパネルを設置し、全てその内に格納しました。

 TOPページの下部の緑のバーがそれです。

この折りたたみパネルはSpry framework for Ajaxで動作しています。

（いつもお世話になっています）

→ 折りたたみパネルのイメージ

イメージでは、デフォルトでは5個のパネルが開いている状態ですが、私の場合は、1個のパネルを閉じた状態にしています。

閉じた状態にするにはSpryCollapsiblePanel.jsファイル上部にある「this.contentIsOpen = true;」の「true」  を  「false」  に変更して下さい。

Episode6.0まで使っていた「アコーディオン」と少し似ていますが、アコーディオンは常に1つのパネルが開いている状態ですが、「折りたたみパネル」は任意のものを開閉出来ます。

BlogをMovable Typeへ変更し、各ページとのイメージを近づけるために、メニューバーを追加しました。

このメニューバーはSpry framework for Ajaxを使用しており、ボタンの 1 つにマウスポインタを置いたときにサブメニューが表示される、ナビゲーションメニューボタンのセットです。

今現在はサブメニューを表示させない設定にしていますが、本来は下記リンクのように表示できます。

ナビゲーションメニューのイメージ

このメニューバーの設置で、フラッシュメニューバーの存在が危うくなってきました・・・