掲載:2014年05月21日
 このSeeSaaの記事検索は、複数ワードの検索ではエラーと成るため、ヤフーの「カスタムサーチ(ブログ内検索)」に変更。以前の改装品のHTMLを此処に残す。


@ コンテンツHTML編集内部:

<div class="sidetitle"><% content.title %></div>
<div class="side">
<% content.header -%>
<form action="<% blog.page_url %>pages/user/search/" class="sASform">
<input type="text" name="keyword" size="20" STYLE="background-color:#101410;border:1 solid #ffe2e1; width:115px; " onFocus="this.style.backgroundColor='#ffccd5'" onBlur="this.style.backgroundColor='#101410'"/>
<input value="記事検索" type="submit" class="input-submit" />
</form>
<style type="text/css">
.sASform{margin:0;padding:0;}
</style>
<% content.footer -%>
</div>



A 挿入テキスト(上部):

<div style="text-align:center;"><img src="http://m-jun.up.seesaa.net/Icon/hensin.gif" width="29" height="40" border="0" align="" alt="青鬼変身" /></div>



B 挿入テキスト(下部):

<strong>
<span style="color:#FF0000;">

</span>
</strong>

<span style="font-size:9px;">
 このブログ内記事検索は、複数ワードに対応していない様です。検索するワードは1つ、例えば「上高地」とだけ入力して下さい。複数入れると「該当するページが見つかりませんでした。」となります。
</span>
<BR>



※ SeeSaaブログの記事検索を複数ワード対応「Yahoo!カスタムサーチ」に変更:
 http://m-jun.seesaa.net/category/6238775-1.html

   (*^‥^*)」 イヨッ
掲載:2014年05月21日
20140521-01_s.jpg SeeSaaブログ、今の自分も使わせて貰っている良いブログなのだが、

@ 時々(アクセスが集中時?)、記事投稿にエラーが出て入力記事が消える。記事修正の時にも起こり、他に記事コピーしての修正が必要。

20140521-02_s.jpgA ブログ内記事検索が複数ワードに対応していないので、複数ワードの例えば、「上高地 ホテル」と入れればエラーに成るつて使えない。

 この2つだけは全く不満な点である。アクセス集中は無料ブログで仕方ないとしても、何故今でもこのブログ内記事検索が複数ワード対応されないのかは謎である。

 ブログ内記事検索の複数ワード対応、自分の2004年以前に自分でサーバーに設置したHP/ブログにも附けていた一般的な物である。

 また、このSeeSaaブログの記事検索、設置そのままの状態で複数ワードを入れれば、記事部分が真っ白に成り、ブログのエラーと見間違う。其処で自分はHTMLを改装、「該当するページが見つかりませんでした。」を入れ、検索窓下には

 ----------
●  このブログ内記事検索は、複数ワードに対応していない様です。検索するワードは1つ、例えば「上高地」とだけ入力して下さい。複数入れると「該当するページが見つかりませんでした。」となります。
 ----------

 と記入、対処していた。要は、このSeeSaaブログの記事検索は格好だけで用を成して居ない。

 其処でドメイン指定検索の出来るグーグルの検索窓を設置しようと考えた。昔、自分で設置したブログもグーグル検索に先に掛かり、このブログでも当初70%以上の閲覧者がグーグルからの閲覧者だった。

 しかし、現在の日本の検索エンジンからの閲覧者の様相は全く変わった。そう、ある時期から・・・(爆)。其れは、このブログの検索からの閲覧者の現状からも明らかである。以前はグーグル一辺倒、SeeSaaブログがヤフー全体検索をブログに附けても変化しなかった。

20140521-03_s.jpg 其れが、グーグルがTV等で話題に成って以降、検索はヤフー(エンジンはグーグル)一辺倒に成った。自分のこのブログの近隣の1日の検索からの閲覧者の結果は画像の通り、ヤフー92.1%・グーグル4.2%・bing3.8%である。

 殆どこの記事検索は使われていない格好だけのもの。

 自分も外部検索から自分のブログを検索すると言う自体に陥っていた(爆)。しかし、最近自分でこの自分のブログ内記事検索を行う事が特に多く成った。

20140521-04_s.jpg 自分の昔の記事にリンクを貼る為である。其処で、やっと自分でも腰を上げる時期かと(爆)Yahoo!検索のカスタムサーチを附ける事にした。

※ Yahoo!検索 - 検索窓(サーチボックス)設置方法:
 http://custom.search.yahoo.co.jp/statics/

 利用するのは、この記事の「サイト内検索」である。

 ----------

★ サイト内検索:

 下のHTMLソースをコピーしてあなたのサイトやブログにはりつけ、▲▲▲の部分を、あなたのサイトやブログで使用している文字コードに合わせて(*1)、次のように変更してください。

 Unicode(UTF-8)の場合はutf-8
 Shift_JISの場合はShift_JIS
 EUCの場合はeuc-jp

 また、「●●●」の部分をあなたのサイトのドメインまたはURLに置き換えてください。(例)ドメイン指定の例:yahoo.co.jp URL指定の例:docs.yahoo.co.jp/info/。いずれの場合も「http://」は入力しないでください。

20140521-05_s.jpg★ サイドバーサイズ:

 ウェブ検索に加え、特定のサイト内に絞って検索することもできます。特定のサイト内のみの検索結果を表示したい場合には、このタイプのものを使います。ブログのサイドバーに適したサイズで、検索ボタンのスタイルは、表示するブラウザによって異なります。

<!-- Begin Yahoo Search Form -->
<div style="margin:0;padding:0;font-size:14pt;text-align:center;border:none;background-color:#FFF;">
<form method="get" action="http://search.yahoo.co.jp/search" target="_blank" style="margin:0;padding:0;">
<p style="margin:0;padding:0;">
<a href="http://www.yahoo.co.jp/" target="_blank">
<img src="http://i.yimg.jp/images/search/guide/searchbox/yjapan_logo_110_29.gif" alt="Yahoo! JAPAN" style="border:none;padding:0;" width="110" height="29">
</a>
</p>
<p style="margin:0;padding:2px 0 0 0;">
<input type="text" name="p" size="20" style="width:95%;">
</p>
<ul style="margin:2px 0 0 2px;padding:0;font-size:10pt;list-style:none;text-align:left;">
<li style="text-align:left;">
<input name="vs" type="radio" value="" checked="checked">
ウェブ全体を検索
</li>
<li style="text-align:left;">
<input name="vs" type="radio" value="●●●">
このサイト内を検索
</li>
</ul>
<p style="margin:0;padding:0 0 2px 0;">
<input type="hidden" name="fr" value="ysin">
<input type="hidden" name="ei" value="▲▲▲">
<input type="submit" value="検索" style="margin-top:5px;">
</p>
</form>
<img src="http://custom.search.yahoo.co.jp/images/window/006c75a92ba244c6b4cbe2709aa17d7b.gif" width="1" height="1" style="display:block;position:absolute">
</div>
<!-- End Yahoo! Search Form -->


 上の、

・ ●●●の部分には自分のブログURLを入れる:m-jun.seesaa.net/
・ ▲▲▲の部分にはブログの文字コードを入れる:Shift_JIS(SeeSaaの場合)

 を入れればいいのだが、是だけでは、「ウェブ全体を検索」になつてしまう。是を「このサイト内を検索」に変更する必要がある。是は、以下の部分を書き換えれば可能。

<li style="text-align:left;">
<input name="vs" type="radio" value="" checked="checked">
ウェブ全体を検索
</li>
<li style="text-align:left;">
<input name="vs" type="radio" value="●●●">
このサイト内を検索
</li>

↓↓↓↓↓↓↓↓↓↓

<li style="text-align:left;">
<input name="vs" type="radio" value="">
ウェブ全体を検索
</li>
<li style="text-align:left;">
<input name="vs" type="radio" value="●●●" checked="checked">
このサイト内を検索
</li>


 でも、この改装だけでは色調も違い自分のブログに設置出来ないので、以下の項目も変更した。

@ 色彩を白から黒系の設定に変更する。

※ 色のRGB値を得るためのツール・Color Dialog 003:
 http://www.vector.co.jp/soft/win95/net/se085351.html

A ヤフーロゴが背景黒色に対応しないので文字に変更する。

※ Yahoo! JAPANが配布している検索窓のHTMLソースやロゴは変更できますか:
 http://www.yahoo-help.jp/app/answers/detail/p/595/a_id/42728

B 検索入力部分に以前の様に黒蓋をする。

※ ブログの検索窓に蓋(窓の色を変更)をする:
 http://m-jun.seesaa.net/article/116708884.html

C 検索釦を押した時のリンクターゲットが「_blank」に成っており、検索結果に新しいページが開くので、是を同一プラウザページ上で処理出来る様に「_self」に変更する。

 target="_blank"(新規のウィンドウに表示)
 ↓↓↓↓↓↓↓↓↓↓
 target="_self"(現在のフレーム(ウィンドウ)に表示)

D その他、ライン色の変更等が必要。

 ----------
★【自分のサイトに合う様に改装した結果】

・ もっと短いHTMLに成るが、変更にも判りやすい様にこのまま。

<!-- Begin Yahoo Search Form -->
<div style="margin:0;padding:0;font-size:8pt;text-align:center;border:none;background-color:#161616;">
<form method="get" action="http://search.yahoo.co.jp/search" target="_self" style="margin:0;padding:0;">
<p style="margin:0;padding:0;">
<span style="color:#FFFFFF;">
<span style="font-size:12px;">
テスト設置・(サイト内複数ワード対応)
</span>
</span>
<BR>
<a href="http://www.yahoo.co.jp" target="_blank" style="text-decoration: none">
<span style="color:#FF0000;">
<span style="font-size:12px;">
<strong>
Powered by Yahoo! JAPAN
</strong>
</span>
</span>
</a>
</p>
<p style="margin:0;padding:2px 0 0 0;">
<div style="text-align:center;">
<input type="text" name="p" size="20" STYLE="background-color:#101410;border:1 solid #ffe2e1; width:150px; " onFocus="this.style.backgroundColor='#ffccd5'" onBlur="this.style.backgroundColor='#101410'"/>
</div>
</p>
<div style="margin:0;padding:0;font-size:8pt;list-style:none;text-align:left;">
<div style="text-align:center;">
<input name="vs" type="radio" value="m-jun.seesaa.net/" checked="checked" style="background-color:#161616;border:none #161616;"> サイト内
<input name="vs" type="radio" value="" style="background-color:#161616;border:none #161616;"> ウェブ全体
</div>
</div>
<p style="margin:0;padding:0;">
<input type="hidden" name="fr" value="ysin">
<input type="hidden" name="ei" value="Shift_JIS">
<input type="submit" value="記事検索" style="margin-top:5px;">
</p>
</form>
<img src="http://custom.search.yahoo.co.jp/images/window/006c75a92ba244c6b4cbe2709aa17d7b.gif" width="1" height="1" style="display:block;position:absolute">
</div>
<!-- End Yahoo! Search Form -->



★ 後日実際を追記: ただ、是をコンテンツの記事検索のHTMLと入れ替えても記事検索などの文字も無く型崩れも起こす。実際はHTMLのタイトルやヘッダーを残さないと上手くいかない。HTMLの内部実際を示せば以下の様に成る。

<div class="sidetitle"><% content.title %></div>
<div class="side">
<% content.header -%>

<!-- Begin Yahoo Search Form -->
<div style="margin:0;padding:0;font-size:8pt;text-align:center;border:none;background-color:#161616;">
<form method="get" action="http://search.yahoo.co.jp/search" target="_self" style="margin:0;padding:0;">

<p style="margin:0;padding:0;">

<a href="http://www.yahoo.co.jp" target="_blank" style="text-decoration: none">

<span style="color:#ff0033;">
<span style="font-size:8pt;">
<strong>
Powered by Yahoo! JAPAN
</strong>
</span>
</span>

</a>
</p>




<p style="margin:0;padding:2px 0 0 0;">
<div style="text-align:center;">

<input type="text" name="p" size="20" STYLE="background-color:#101410;border:1 solid #ffe2e1; width:150px; " onFocus="this.style.backgroundColor='#ffccd5'" onBlur="this.style.backgroundColor='#101410'"/>

</div>
</p>

<div style="margin:0 0 0 0;padding:0;font-size:8pt;list-style:none;text-align:left;">
<div style="text-align:center;">

<input name="vs" type="radio" value="m-jun.seesaa.net/" checked="checked" style="background-color:#161616;border:none #161616;"> サイト内
<input name="vs" type="radio" value="" style="background-color:#161616;border:none #161616;"> ウェブ全体

</div>
</div>

<p style="margin:0;padding:0 0 0 0;">
<input type="hidden" name="fr" value="ysin">
<input type="hidden" name="ei" value="Shift_JIS">
<input type="submit" value="記事検索" style="margin-top:5px;">
</p>
</form>

<img src="http://custom.search.yahoo.co.jp/images/window/006c75a92ba244c6b4cbe2709aa17d7b.gif" width="1" height="1" style="display:block;position:absolute">
</div>
<!-- End Yahoo! Search Form -->

<style type="text/css">
.sASform{margin:0;padding:0;}
</style>

<% content.footer -%>
</div>



20140521-06_s.jpg20140521-07_s.jpg20140521-08_s.jpg

 是の実施結果が右上のヤフー検索窓である。是をサイドバーの検索部分と入れ替えれば設置完了である。複数ワード「上高地 ホテル」とでも入れてテストしてみて下さい。明らかな違いが判ります。

 SeeSaaブログをお使いで記事数の多い方は是非に!。

   (*^‥^*)」 イヨッ

このブログの人気記事 (直近24時間)
    最 新 記 事