TwentyEleven ヘッダーの検索ボックスの位置の変更

ワードプレステーマTwentyElevenのヘッダーにある検索ボックス(サーチボックス)の位置を変更してみましょう。

特にヘッダー部分の余白を削ったりタイトル周りをイジった後は、この検索ボックスの位置がヘッダー画像に食い込んだりする場合があります…(汗

もうチョット右側に寄せたい、もうチョット上にずらしたい、そんな感じになるでしょう。そんな場合は、ホンのチョッとだけ場所を変更してあげましょう。

それでは、管理画面より「外観」⇒「テーマ編集」から’スタイルシート’を開いて下さい。(小テーマを使用している方は、小テーマ側のスタイルシートを編集して下さい)

’スタイルシート’の中から、次の部分を見つけて下さい。

/* Search Form */
#branding #searchform {  /* ココです!! */
	position: absolute;
	top: 3.8em;
	right: 7.6%;
	text-align: right;
}
#branding #searchform div {
	margin: 0;
}

この部分の数値を少しだけ変えてあげれば、検索ボックスが素直に動きます(笑 例えば、こんな感じに編集してみて下さい。

/* Search Form */
#branding #searchform {  /* ココです!! */
	position: absolute;
	top: 2.2em;
	right: 5.8%;   /* ブラインドサーチフォームの位置 */
	text-align: left;
}
#branding #searchform div {
	margin: 0;
}

いかがですか?これで検索ボックスの位置が少し上に、そして少し右に移動したハズです。数値を変えて、お好みの位置に調整してみて下さいね☆

WordPressデザインブック ステップバイステップ形式でマスターできる
WordPressデザインブック ステップバイステップ形式でマスターできる

 

にほんブログ村 ブログブログ ブログノウハウへ

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です