子猫にも貼れる Google 検索 1.3

ソネ風呂の記事検索（デフォルト）は冒頭に広告が表示されるなど使い勝手が悪い。広告が目立たない「Google Search」に変更しよう。Googleが無償提供している「フリー検索」は「ウェブ検索」と「ウェブ検索＋サイト検索」の２種類。上が「ウェブ検索」で、下が「サイト / ウェブ」のラジオボタンを切り替えるタイプ。kovaioさんの「検索ボックス」を参考にしてアレンジしました。

　　　　　　s k n y s - s y n k s www

<!-- Google -->
<form method=get action="http://www.google.co.jp/search"> <a href="http://www.google.co.jp/"><img src="http://www.google.com/logos/Logo_25wht.gif" border="0" alt="Google" align="absmiddle"></a><input class="search-tbox" name=q type=text><input class="search-button" value="search" name="btnG" type="submit"><input type=hidden name=ie value=UTF-8><input type=hidden name=oe value=UTF-8><input type=hidden name=hl value="ja"></form>
<!-- Google -->

<!-- SiteSearch Google -->
<form method="get" action="http://www.google.co.jp/search"><a href="http://www.google.co.jp/"><img src="http://www.google.com/logos/Logo_25wht.gif" border="0" alt="Google" align="absmiddle"></a><input class="search-tbox" name="q" type="text"><input name="ie" value="UTF-8" type="hidden"><input name="oe" value="UTF-8" type="hidden"><input name="hl" value="ja" type="hidden"><input class="search-button" value="search" name="search" type="submit"><br>　　　　　　<font size="-1"><input name="domains" value="https://sknys.blog.so-net.ne.jp/" type="hidden"><input name="sitesearch" value="https://sknys.blog.so-net.ne.jp/" checked="checked" type="radio">s k n y s - s y n k s <input name="sitesearch" value="" type="radio">www </font></form>
<!-- SiteSearch Google -->

　　　　　　　　　　　　　　　　　　　　＊

FirefoxやSafariの検索エンジンには「Google Search」が予めインストールされているので、ブログ内（サイト）検索だけにカスタマイズしてみた。参考にしたのはTANさんの「検索ボックス」。"https://sknys.blog.so-net.ne.jp/"を自分のURLに変更します。

　　　　　　 s k n y s - s y n k s

<div id="search"> <form action="http://www.google.co.jp/search" method="get"> 　　　　　　 s k n y s - s y n k s <br><a href="http://www.google.co.jp/"> <img src="http://www.google.com/logos/Logo_25wht.gif" border="0" alt="Google" align="absmiddle"></a><input class="search-tbox" name="q" type="text"><input class="search-button" value="search" name="btnG" type="submit"><input value="sknys" name="userName" type="hidden"> <input name="ie" value="UTF-8" type="hidden"> <input name="oe" value="UTF-8" type="hidden"> <input name="hl" value="ja" type="hidden"> <input name="domains" value="https://sknys.blog.so-net.ne.jp/" type="hidden"> <input name="sitesearch" value="https://sknys.blog.so-net.ne.jp/" type="hidden"> </form></div><br>

<style>
#search .sidebar-body{padding-bottom:6px; margin-bottom:-8px}
.search-tbox{border-width:1px; width:70%; background:#ffffff}
.search-button{border-width:1px; width:54px; color:#339900; background:#ffffff}
</style>

このままサイド欄に置くにはGoogleのカラーロゴが大きすぎてバランスが悪い。下記のようにアレンジしてみました。Googleの文字色はCSSで指定します。

s k n y s - s y n k s　by Google

<div id="search"> <form action="http://www.google.co.jp/search" method="get">s k n y s - s y n k s　by <b><span class="blue">G</span><span class="red">o</span><span class="yellow">o</span><span class="blue">g</span><span class="green">l</span><span class="red">e</span></b><br> <input class="search-tbox" name="q" type="text"><input class="search-button" value="search" name="btnG" type="submit"><input value="sknys" name="userName" type="hidden"> <input name="ie" value="UTF-8" type="hidden"> <input name="oe" value="UTF-8" type="hidden"> <input name="hl" value="ja" type="hidden"> <input name="domains" value="https://sknys.blog.so-net.ne.jp/" type="hidden"> <input name="sitesearch" value="https://sknys.blog.so-net.ne.jp/" type="hidden"></form></div><br>

<style>
#search .sidebar-body{padding-bottom:6px; margin-bottom:-8px}
.search-tbox{border-width:1px; width:70%; background:#ffffff}
.search-button{border-width:1px; width:54px; color:#339900; background:#ffffff}

.red{color:#ea4335}
.green{color:#34a853}
.blue{color:#4285f4}
.yellow{color:#fbbc05}
</style>

検索ボックス＆ボタンの外枠を太くするには {border-width:2px} と指定、左右の幅や上下の余白は各自の使用スキンに合わせてCSSの数値を変えて下さい。

　　　　　　　　　　　　　　　　　　　　＊

新春お年玉として 読者になる（RSSに登録） を英文字にカスタマイズする方法を紹介します。矢印（→）は公式スキンから好みのタイプを借用。「SEARCH & RSS REGISTER」のように s k n y s - s y n k s　by Google（Googleブログ内検索）とセットで並べると良い感じ。"https://sknys.blog.so-net.ne.jp/index.rdf"を自分のURLに変更してね。

SKNYNX RSS REGISTER

<div id="rssRegist"><a href="https://blog.so-net.ne.jp/MyPage/blog/user_rss/list?url=https://sknys.blog.so-net.ne.jp/index.rdf" title="読者になる（RSSに登録）">SKNYNX RSS REGISTER</a></div>

<style>
#rssRegist{margin:0px 1px 6px 0px; padding:4px 4px 4px 20px; background:#339900 url("/_skin/system/12/images/arrowR_large.gif") no-repeat left center; text-align:center; font-weight:bold; line-height:100%}
#rssRegist a{text-decoration:none; color:#ffffff}
</style>

読者になる（RSSに登録） のフォーマットを利用して メッセージを送る ボタンを作ってみました。12桁のPersonalIdを変えるだけ‥‥簡単でしょ？

MASSAGES FOR SKNYS

<div id="rssRegist"><a href="https://www.so-net.ne.jp/blogcruiser/message/post/edit.do?toPersonalId=000205334847" target="msg" title="お友達申請メッセージを送る">MASSAGES FOR SKNYS</a></div>

サイト・ポリシーをアピールして、コピーライト（©）を入れました。

NO AFFILIATE, NO ANALYZE!

© 2008 sknys. All Rights Reserved.

<div id="rssRegist2"> <a href="https://sknys.blog.so-net.ne.jp/2007-05-16" target="_blank">NO AFFILIATE, NO ANALYZE!</a></div>

<address>© 2008 <span class="csknys">sknys</span>. All Rights Reserved.</address></div>

<style>
#rssRegist2{margin:0px 1px 6px 0px; padding:4px 0px 4px 20px; background:#ef5252 url("/_skin/system/12/images/arrowR_large.gif") no-repeat left center; text-align:center; font-weight:bold; line-height:100%}
#rssRegist2 a{text-decoration:none; color:#ffffff}
.csknys{font-size:small}
</style>

　　　　　　　　　　　　　　　　　　　　＊

• 利用停止になったサーヴィス（blogcruiser）など、記事の一部を削除・訂正しました（2014.04.20）


• 「Google検索」のリニューアルに伴い、記事の一部を修整しました（2017.10.12）


• 新しいURL（"https://sknys.blog.so-net.ne.jp/"）に変更しました。旧URLの記事もGoogleが検索してくれます。記事タイトル〈猫にも出来るブログ内検索〉を〈子猫にも貼れる Google 検索〉に改題しました（2008.03.13）


• 検索ボタンを画像に変更したり、検索ボックス内に文字を入れる〈子猫にも出来るプチ・カスタマイズ〉も参照してね（2014.12.25）

　　　　　　　　　　　　　　　　　　　　＊

　 petit customize for kittens 1.3 / sknynx / 125

タグ：original skin kittens Google