2005年07月16日

サイドバーを折りたたむ方法そのA


サイドバーを折りたたむ方法そのA



サイドバーを折りたたむ方法の違うのを見つけました。

素浪人サマのSeesaaでサイドメニューの開閉です。

これをちょっぴりアレンジしてみました。
サイドバーを折りたたむには、この間説明した方法ともう一つあります。



こっちの方が簡単です。


σ(´Д`*)オィラのサイドバーで一つつけてみました。

+過去ログ+を見て下さい。

過去ログの隣に★があり、他とちょっぴり違ってますね(*´艸`)ンプッ



ribon.gifココからjavascriptをダウンロードしてください。



ウィルスチェックをしてあるのでご安心を(*´艸`)ンプッ



中にside.jsというjavascriptが入っていますので、それを



ツールのファイルマネージャーにアップしてください。





ribon.gif次に、デザインのコンテンツを追加します。


***************************



種類:自由形式



追加先ページ:全ページ



配置:ヘッダー



並び順:適当(* ̄m ̄)プッ

***************************




<script type="text/javascript" src="アップしたファイルの絶対パス"></script>

最初にダウンロードしたファイル名でアップするならアップしたファイルの絶対パス



http://*******.seesaa.net/保存したディレクトリ/side.jsにします。

ribon.gif次にサイドメニューで開閉したいメニューを



「コンテンツ」⇒ 「タイトル名」もしくは「追加/変更」より開きます。



ちょっと大変ですが、タイトルのところに、下記文を入れます。



タイトル名<a href="javascript:void(0);" onClick="showHide('C1');">▼</a></div><div class="sidehide"id="C1"><div class="side">

これで保存O━━━━d(゚Д゚●)━━━━K



青い部分で書かれているC1ですが、メニューを増やすなら



CI,C2と番号を変えていってください。





そして、変更したサイドメニューの編集の部分に戻り、



挿入テキスト下部 のところに、




</div>

を入れてください。



これで、再構築をすれば完成☆-(ノ゚Д゚)八(゚Д゚ )ノイエーイ


前の記事で説明した方法より、かなり簡単ですね。



しかし、これは文字のすぐ隣に開閉ボタンが付きます。



好きな方ほうでやってみてください。
posted by あぃ at 21:13 | 千葉 🌁 | Comment(2) | TrackBack(0) | 【カスタマイズ】

2005年07月15日

サイドバーを折りたたみました


seesaだけではなく、livedoor系にもできるみたいです。


KOROPPYの本棚サマのseesaaサイドバー折りたたみボタンの色を開閉で変える

でベンキョしました。

KOROPPYの本棚サマのブログはものすごぃキレイです(*ノ・ω・)ノオオオオォォォォ
是非A行ってみてください。
私なりに判りやすく、書いてみました。
私のでわからない場合はKOROPPYの本棚サマのところに行ってみてください。

とりあえず、下にやり方を書いておきました(*´艸`)ンプッ











***最初に注意したいこと****



この編集にはjavascriptを使用するので、

文字コードがEUC-JP(日本語 EUC)でやらなければ、javascripsが起動しません。

windowsしかわかりませんが、

windowsに付属されているメモ帳では使えません

ので、テキストエディタをダウンロードしてから編集してください。

σ(´Д`*)オィラが使ってるのはterapadです。

javascriptも文字化けしませんし、使い勝手がとても・:*:・゚☆d(≧∀≦)b゚+.゚イイ!です




ribon.gif まず、コチラ(圧縮ファイルlzh)をダウンロードしてください。
解凍した中にsidetatamu.jsというjavascriptのファイルが入っています。

それをテキストエディタで開いてください。

テキストエディダによっては文字化けする場合がありますので、

そういう場合はterapadがお勧めです。

この中に、ココと同じHTMLファイルが入っています。

私のブログは右クリ禁止にしてあるので、わからない方は

HTMLファイルを見てください。



ribon.gif
26行目からret = 〜</div>;と書いてあるところがありますが、

これは、タイトル⇒開閉ボタンの順になってマス。



開閉ボタンを前に持ってきたい場合はret = 〜</div>;の部分を



下のソースに入れ替えてください。






ret = '<div align="left">'+'<input type="button" value="' + val + '"
id="btncolumn' + i + '" class="btncolumn" onclick="toggleOpenClose(\'column' + i
+ '\',this.value);"/>'+'<label for="btncolumn' + i + '"
class="columntitle">' + sInner + '</label>'+'</div>';



ribon.gif次に説明するのは開閉する場所です。

最初にコピーしてテキストエディタに貼り付けたものに

下のように書かれてる場所があります。



これは、サイドタイトル名を入力する必要があります。

自分で、サイドタイトル名を変えていたりすると思いますが、

開閉したいところのサイドタイトルを入力してください。





aryTitle[1] = "最新記事";

aryDefault[1] = false;



aryTitle[2] = "メロメロパーク";

aryDefault[2] = true;



今二つしかありませんが、沢山増やしたい場合は



aryTitle[○] = "サイドタイトル名";

aryDefault[○] = false;




これの○の場所の数字を増やしていってください。








true=開いておく状態 false=閉じておく状態



なので、ブログを開いた時にサイドバーが開いている状態か

閉じてる状態かを選んでください。


ribon.gif編集が終わったら、これを保存する必要があります(当たり前か(*´艸`)ンプッ)



*文字コード:EUC-JP(日本語EUC)

*ファイルの種類:javascript(拡張子が【.js】

注意:JAVAとは違いマス。

無い場合はファイルの種類を【すべてのファイル】にして

ファイル名.jsにして保存してください。

保存したファイルが巻き物みたいなマークが出てれば成功です


ribon.gif保存したファイルを「ツール」⇒「ファイルマネージャー」に保存します。

自分のわかりやすいように、新しくディレクトリを作ると便利かもしれません。

σ(´Д`*)オィラはディレクトリ名を「file」にしています。



保存できたらとりあえず、O━━━━d(゚Д゚●)━━━━Kです。


ribon.gif次は、スタイルシートに足す記述です。

下のをコピーして貼り付けてください。



文字の色やサイズ、枠の種類や色を変えるといいと思います。




ribon.gif最後です(|||-ω-)チカレタ…

「デザイン」の中に「コンテンツ」に追加します。

***************************

種類:自由形式

追加先ページ:全ページ

配置:サイドバー(両サイドに設定してある場合は右サイドバーにする。)

並び順:100(これは何でも良いが、一番最後にする為、100に設定)
***************************

追加を押し、html編集で、下記をコピーして貼り付けます。

わかりやすいように、フレームを使いませんので

コピーしてください。









<SCRIPT language="JavaScript" type="text/javascript"
src="http://***.seesaa.net/file/***.js" charset="EUC-JP"></SCRIPT>


青い文字で書かれている部分を変更します。

まず、http://***.seesaa.net/の部分を自分のブログのIDにします。

次に、/file/sidetatamu.jsfile部分を自分の設定したディレクトリ名にします。

sidetatamu.jsは、先ほどツールのファイルマネージャーに保存したファイル名.jsにします。

これで、再構築をすればできあがりだと思います。

かなりメンドクサイですが、やってみてください♪

posted by あぃ at 21:22 | 千葉 🌁 | Comment(4) | TrackBack(0) | 【カスタマイズ】

2005年07月13日

ドロップダウン式のナビゲーションバーをつけました。


今までナビゲーションバーをつけていましたが、

ドロップダウン式のものに変更しました。


これだとサイドバーがごちゃごちゃしなくていいかな.+:。(´ω`*)゚.+:。ポッ

って思ったのですが、どうでしょうか?

訪問してくださった方にも見やすくなったんじゃないかな?って思います。

posted by あぃ at 16:44 | 千葉 ☁ | Comment(11) | TrackBack(0) | 【カスタマイズ】

広告


この広告は60日以上更新がないブログに表示がされております。

以下のいずれかの方法で非表示にすることが可能です。

・記事の投稿、編集をおこなう
・マイブログの【設定】 > 【広告設定】 より、「60日間更新が無い場合」 の 「広告を表示しない」にチェックを入れて保存する。


×

この広告は1年以上新しい記事の投稿がないブログに表示されております。