猫にも出来るワイド・ヘッダ攻略 2.1

「ログインシステム、Webサーバのメンテナンス」（2008/12/09）後、ヘッダにヘンなものが２つも付いちゃった。「こだわりブログを始めよう！」「⇒ブログで"トク"してますか？」というソネ風呂のPR広告と「検索ボックス」。非ログイン時に表示される広告は目障りなだけだし、「検索ボックス」もブログ内検索（サイドバーの「Google Search」参照）に対応していないので、ブラウザに付属している検索エンジンや、キーワードを入れて検索する「Quick Search」の方が使い勝手が良い。ブログの美観を損ねる邪魔なものは消してしまいましょう。

<style>
.headerPR{display:none}　/*「⇒ブログで"トク"してますか？」を非表示にする*/
#searchForm{display:none}　/*検索ボックスを非表示にする*/
</style>

ソネ風呂のスタイルシートはスキンCSSの後にヘッダ用のCSSを読み込むので、「スタイルシート編集」の中に上記のCSSを入れても上書きされてしまう。<style>〜</style>で囲んで、サイドバー（カスタムペイン）の中に入れて下さい。ヘッダの横幅変更は〈猫にも出来るワイド・ヘッダ攻略改〉を参照してね。

　　　　　　　　　　　　　　　　　　　　＊

デフォルト・ヘッダ（ログアウト）


カスタム・ヘッダ（ログアウト）


　　　　　　　　　　　　　　　　　　　　＊

検索ボックスの左右にある「虫メガネ」と「検索」の画像は、自作して貼り替えるか、テキストに置き換えるかしないと変更出来ませんが、ボックスの外枠やボックス内の背景色、文字色はCSSで変えられるはずです。ヘッダ・カラー（18色）とコーディネートすれば、少しは見栄えが良くなるかしらん。

<style>
#blogSearchInput{border-color:#xxxxxx; background-color:#xxxxxx; color:#xxxxxx}
</style>

#xxxxxx ←「検索ボックス」の枠色
#xxxxxx ←「検索ボックス」の背景色
#xxxxxx ←「検索ボックス」の文字色

　　　　　　　　　　　　　　　　　　　　＊

ヘッダ・デザイン（スキン管理）


　　　　　　　　　　　　　　　　　　　　＊

サイドバーの下部に表示されている「POWERED BY So-net blog」と「RSS FEED」が中央揃えになってしまった。ちょっと気になったので、「RSS FEED」の位置を左に寄せました。「POWERED BY‥‥」のロゴは非ログイン時にヘンなものが現われる。ソースを見ると「myblog-poweredby-no-login」というセレクタがあった。ヘッダのPRと同じような邪魔ものが潜んでいたのだ。「ブログを作る（無料）‥‥」を非表示にすることも可能ですが、ログイン / ログアウトに関係なく「POWERED BY‥‥」を非表示にした方が無難かもしれません（レイアウト編集ページで簡単に非表示に出来ます）。サイドバーの中央揃えはPR画像を入れるための変更なのでしょうか？

<style>
#myblog-poweredby-no-login{display:none}　/*「ブログを作る‥‥」を消す*/
#powered img{margin-right:54px}　/*「POWERED BY‥‥」を左に寄せる*/
#rssfeed{float:left}　/*「RSS FEED」を左に寄せる*/
</style>

　　　　　　　　　　　　　　　　　　　　＊

ブログを作る（無料）＋ POWERED BY So-net blog（ログアウト）



POWERED BY So-net blog（ログイン）


RSS FEED（左寄せ）

RSS1.0 | RSS2.0

　　　　　　　　　　　　　　　　　　　　＊

またまたヘッダとフッタの表示が変更されました。ヘッダ広告は非表示にしてあるので関係ないけれど、左フッタにある「使い方 - Q&A」のフォントがデカくなったのは奇々怪々。気になる人は元に戻しましょう。さらに厄介なのはレイアウト編集ページで「POWERED BY So-net blog」を非表示に出来なくなったこと（既に非表示にしている場合は問題なし）。これから「POWERED BY‥‥」を非表示にする場合は下記のCSSで対処して下さい。リニューアル前の表示（ログイン＆ログアウトで変化しない）に戻したい人は自分でバナーを貼ってね（2009/ 03/07）

POWERED BY So-net blog（ログイン＆ログアウト）

<style>
.footlink{font-size:x-small}　/*「使い方 - Q&A」の文字を小さくする*/

#powered{display:none}　/*「POWERED BY‥‥」を非表示にする*/
</style>

<a href="http://blog.so-net.ne.jp/" target="_blank"><img class="powerd-by" src="/_images/blog/_523/filestore/powered.gif"/></a>　/*「POWERED BY‥‥」をサイドに表示*/

　　　　　　　　　　　　　　　　　　　　＊

60日以上更新のないブログに広告が強制表示されるという「広告表示仕様変更」が告知された時から嫌な予感がしていたけれど、ブログのヘッダとサイドバーにソネ風呂のPRが表示されるようになった。前門の虎、後門の狼みたいですね。リニューアル後にレスポンスが重くなったのは「放置ブログ」を増やす遠謀深慮だったりして‥‥。広告だらけで中身のないブログほど無惨なものはない。「無料ブログ」という名の広告塔（卒塔婆？）‥‥にならないように気をつけなくちゃ。ゴロニャン。

　　　　　　　　　　　　　　　　　　　　＊

• TANさんがJavaScriptを使った「検索欄と｢GO!｣メッセージを消す方法」を紹介しています


• フッタの「使い方 - Q&A」とサイドの「POWERED BY‥‥」の変更方法を追記しました（2009/ 03/07）

　　　　　　　　　　　　　　　　　　　　＊

　 original skin 1.2 / 2.2 / 3.2 / 4.1 / skin switcher / renewal repair / header helper 1.1 / 2.1 / sknynx / 181

タグ：original skin cats header

コメント 14

こんにちは、おじゃまします。
ヘッダのＰＲメッセージと検索ボックス非表示は、ほんとうにたすかりました！
検索ボックスがヘッダの色とコーディネートできれば、違和感も軽減されそうですね。（うちはなくていいので、消し去ってすっきり！）
気がつかないうちに、「POWERED BY So-net blog」と「RSS FEED」も変わっていたんですね。中央揃えは、落ち着きが悪い気がするので、私も左よせにしようと思います！
by うさぎりんご (2008-12-17 13:38) 

こんばんは
このヘッダーの検索ボックスは、僕も鬱陶しく思っていたので、助かりました。
おかげさまですっきりすることができ、ありがとうございました。
＞重くなったのは「放置ブログ」を増やす遠謀深慮だったりして‥‥
何となく納得しそうで、怖いです。（笑）余計な変更を加えるより、安定して使いやすいブログを目指して欲しいものだと思います。
事後承諾になって申し訳ないのですが、sknysさんのCSSを拙ブログでも紹介させていただきました。
もし問題があるようなら、削除いたします。
順番が逆になり申し訳ありませんでした。
by lapis (2008-12-17 21:48) 

うさぎりんごさん、コメントありがとう。
「検索ボックス」の画像を自作して貼り替える方法もありますが、
非表示にした方がスッキリしますね＾＾

「ブログを作る（無料）」は、ログイン状態だと表示されないところが
巧妙というか、ズル賢いというか‥‥気づかないソネ風呂人も多いでしょう。
ログイン時に表示される「POWERED BY So-net blog」を左に寄せるか、
レイアウト編集ページで非表示にするか、バランス的に微妙なところです。

ヘッダ見本の「薄桃」は貼り直しました＾＾;
by sknys (2008-12-18 00:10) 

lapisさん、コメント＆記事の紹介ありがとう。
ヘッダに付いた広告と「検索ボックス」は
バナーにオリジナル画像を入れていると特に異和感がありますね。

バナー・デザインを台無しにするワイド・ヘッダは、
本に巻かれている「腰巻き」に似ているかもしれません。
「腰巻き」は外せるけれど、ヘッダは外せない。
まぁ、ヘッダに画像を入れて、脱いだように見せているわけですが＾＾;

リニューアル以降、ソネ風呂は次第に使い難くなっているような気が‥‥。
記事の紹介は願ってもないことです。
全ソネ風呂ガーが「検索ボックス」を消し去って使わなければ、
ソネ風呂事務当局も考え直すでしょうから。
by sknys (2008-12-18 00:15) 

はじめまして。
lapisさん経由でやってきました。
ヘッダを飾る？検索ボックスがとても気になっておりました。
おかげさまで消し去ることが出来てホッとしています。
有難うございました。
by 柴犬陸 (2008-12-18 10:26) 

柴犬陸さん、コメントありがとう。
微力ですが、お役に立てて嬉しいな＾＾;
余計な機能は消し去って、ソネ風呂事務局に無言の抗議！
一致団結して猛省を促しましょう。
サイドバーの「POWERED BY ‥‥」も非表示にした方がスッキリします。
by sknys (2008-12-19 00:06) 

はじめまして、lapisさんのところからまいりました。
私もさっそく検索ボックスを消してみました。
じゃまだなぁと思っていたので、とても嬉しいです。
どうもありがとうございます。
by すずめ (2008-12-24 09:40) 

すずめさん、コメントありがとう。
何の告知もなく突然、「検索ボックス」を付ける無神経さに腹が立ちます。
表示するかしないかの選択の余地をブロガーに残して欲しかった。
おジャマな「検索ボックス」を消し去って、
ソネ風呂当局の黒い野望（広告漬け？）を阻止しましょう＾＾
by sknys (2008-12-24 23:16) 

こんばんわ
POWERED BYの非表示をどうしたら良いのか
解らなかったので大変助かりました
有り難う御座いました。
by 9th (2009-01-17 22:28) 

9thさん、コメントありがとう。
ログイン時だけ「POWERED BY」を表示する方法を紹介しましたが、
レイアウト編集ページで非表示にした方がスッキリしますね。
システムメンテナンス後に、またヘンなものが付かないか心配です＾＾
by sknys (2009-01-18 13:44) 

こんばんは。はじめまして。

ブログ始めたばかりですけれど、ヘッダの検索ボックスとPOWERED　BY
じゃまだな　と思っていたので、試してみました。

ヘッダの検索ボックスは綺麗に消せました。ありがとう！

POWERED　BY を消すのはなぜかうまくいかなかったのですけれど、
下のほうだから　あまり気にしないことにしました。

よくわからないですけどカスタマイズできないポストペットのスキンを使っているので、
サイドバーの中に入れるだけでよいのが嬉しいです。

次はゲストアイコンを変更したいなと思っています。
by お針子姫 (2009-12-12 00:07) 

お針子姫さん、コメントありがとう。
「Powered By」はレイアウト・ページで非表示化出来たんですが、
いつに間にか強制表示になっちゃった。
下記のCSSで簡単に消えるはずですが、上手くいかないの？

<style>
#powered{display:none}
</style>

ゲスト・アイコンは数種類作ってランダム表示にすると愉しいですよ＾＾
〈子猫にも貼れるゲスト・アイコン〉 を参照して下さい。
（http://sknys.blog.so-net.ne.jp/2009-07-06）
by sknys (2009-12-12 14:22) 

ありがとうございました！
こんどは一度で消えました。

前はなぜか何度やってもうまくいかなかったので、やりかたがちょっと間違ってたのかもしれません。

アイコン画像1枚だけ用意してみたので、子猫にも貼れる・・・に載っていた1種類だけ変えるのを試してみました。うまくいきました！
ボンネットをかぶった猫ちゃんシリーズでランダム表示に今度挑戦してみます。

カスタムすると楽しいです。どうもありがとう。
by お針子姫 (2009-12-12 21:17) 

非表示化に成功して良かったなぁ。
CSSが変更されたのかと思って、再検証しちゃいました＾＾

非ログイン時に表示されるヘッダの「So-net検索ツールバーをゲット！」も、
Powered Byの「おかげさまで５周年！」もソネ風呂の広告なんですよ。
有料化すれば、ヘッダや広告（60日間未更新時に強制表示される）が
非表示化出来ると言われてもねぇ‥‥。

マイ・アイコンのランダム表示化や
アイコンに白枠を付けるカスタマイズも試してみてね＾＾
by sknys (2009-12-13 00:26)