カスタマイズ・レコード８ －サイドバー Part3－

【サイドバー：サイト内検索・「トップ」に戻るボタン】

サイドバーのカスタマイズの中でやり残していた２つのカスタマイズです。
私が参考にさせていただいたブログは、やはり
KOROPPYの本棚さんの「ココログ（ブログ）の裏技＆お役立ちサイト集」 です。
またまた、役立つお智慧を拝借いたしました。　（…感謝！…）

　・サイト内検索
　・「トップ」に戻るボタン　　　を記述します。

１．サイト内検索
こちらのカスタマイズは、KOROPPYの本棚箱さん　経由　爆想さんの
　「自分のココログを全文検索するJavaScript」　と、
KOROPPYの本棚さん　経由　風柳亭 - 別館：書庫のある庵 -さんの
　「ココログ全文検索スクリプトに“本文(続き)”部分まで検索するパッチ」　　を
取り入れています。
（<div> 内の検索も可能になる為、風柳亭さまのスクリプトをお借りしました）

★JavaScript のダウンロード・アップロード
①script のダウンロード
Script を公開されているページで指定されたファイルのURLを
アドレスバーにコピー・ペーストすると、
「開く？　保存？」画面が開きます。
「保存」を選び、保存したいフォルダーに保存します。

② Script のアップロード
ご自分が用意しているココログのフォルダーに
アップロードします。
私は、http://www.hanaduna1416.way-nifty.com/hanashiori/
の下に、＜script＞というフォルダーを作って
アップロードしています。

③＜マイリスト＞の作成
Script を作動させるタグを記入します。
「カスタマイズ・レコードⅡ　－初歩の初歩！？－」　の
★マイリスト：ブログパーツ　に詳しい記入方法が
載っていますから参考になさって下さい。
この時、必ず、＜マイリスト＞の記述を
アップロードしたご自分のURLに書き換えることをお忘れなく！。
でないと、Script を公開されている方の
ファイルに直リンクしてしまい負荷をかけることと
なってしまいます。
必ず、「保存」をしてご自分のフォルダーで
利用するように致しましょう！。
　　↓　
今回の場合は……、
①script のダウンロード
爆想さんの上記ページから
prototype.js
風柳亭さんの上記ページから
cocolog ajax search.js　　　　　　　　　　をダウンロードします。

★サイト内検索 ： ＜マイリスト＞　に記述 >
<script type="text/javascript" src="http://～/prototype.js">
　　　　　　　　　　　　　※ご自分のファイルをアップした絶対パスを記入
</script>
<script type="text/javascript" src="http://～/cocolog_ajax_search.js">
　　　　　　　　　　　　　※ご自分のファイルをアップした絶対パスを記入する
</script>
<form action="javascript:cocologAjaxSearch( '/～/archives.html',
　　　　　　　　　　　　　　　　※ご自分のファイルをアップしたパスを記入
document.getElementById('search_box').value );">
<input type="search" id="search_box" value="">
<input type="button" id="search_button"
onclick="javascript:cocologAjaxSearch( '/～/archives.html',
　　　　　　　　　　　　　　　　※ご自分のファイルをアップしたパスを記入
document.getElementById('search_box').value );
" value=" 検索 " style="border-style:solid;
border-width:1px; border-color:#697497;
　　　　　　　※#～：希望するカラーコードを記入
background:#ecf1fa; font-size:10pt; color:#697497"></form>
　　　　　　　※#～：希望するカラーコードを記入

これで＜花栞＞内の検索がとっても楽になりました。
機能はすこぶる優れものですが、設置方法はいたって簡単です。
是非、お試し下さい！？。

２．「トップ」に戻るボタン
ブログのレイアウトはひたすら　～ 下にぃ下にっ！？ ～。
長く伸びた下の部分から一番上に戻るにもなかなか厄介です。
そんな不便もこちらのタグを活用すると一発解消出来ちゃいます！？。
こちらのカスタマイズも、KOROPPYの本棚さん　経由　えふとーきょーさんの
　「トップページへ戻る　を付けよう」　を、
取り入れています。

★＜マイリスト＞：タイトル　に記述
<a href="http://～/blog/">
　※リンクさせるブログの絶対パスを記入
<span style="color: #CD1076;"><B>
　※文字に色をつけたり太字にしたい場合はタグを記入
◆ Page Top ◆</B><span></a>

ボタン一押しでページのトップに戻れますよ！？。