また旅

日々のこと、画面の中でのこと (今はIDCFクラウド、KUSANAGI、WordPress、Vagrant及びCodeIgniter).

WordPress

Thematicテーマで3カラムにするとはみ出る検索ボックスを修正

Search box stick out

 

WordPressのSEO対応テーマThematicのカラム変更についてに書いた方法で3カラムのデザインに変更すると上の画像の様に検索ボックスが線からはみ出してしまいます。

もちろん線がなければはみ出しませんが、当ブログのデザインだと問題あったので修正しました。

 

今回はその修正方法をご紹介します。Thematicテーマで子テーマを使っていることが前提です。

 

方法は簡単で子テーマのfunctions.phpに以下のコードを追加するだけです。

functions.phpの編集に失敗するとWordPressの管理画面が開かなくなります。(真っ白の画面が表示されます。)管理画面の外観メニューのテーマ編集でしかファイルを編集出来ない場合は追加しないことを強くオススメします。

 

function uljp_search_length(){
    return "28";
}
add_filter('thematic_search_form_length','uljp_search_length');

 

28は当ブログの検索ボックスのサイズですので適当に変更して下さい。また、2箇所あるuljp_search_lengthも変更可能ですが意味が分かれなければそのままお使い下さい。

 

なお、WPtouchプラグインを使っている場合にiPhoneでMobile Themeをオフにしてページを表示するとサイズ修正されないようです。

-WordPress