現在使用wordpress、ならびにテーマ賢威7-1クール版を使用しています。

テーマ賢威7-1クール版の基本形では、スマートフォンでは検索ボックスが最下部に表示されてしまうので、パソコンもスマートフォンでも、検索ボックスは上部に表示するように修正しました。

方法は、検索フォーム(seachform.php)からコードをコピー。そのコードをテーマヘッダー(header.php)に貼ります。

最後の仕上げに、サイドバーの検索ボックスは停止します。

上記について記事化します。

検索ボックスをサイドバーからヘッダーに移転。検索フォーム(seachform.php)からコードをコピー

まず、テーマの中から右端のテーマファイルを見ます。

その中に、検索フォーム(seachform.php)があります。

検索フォームをクリックして、中にある下記のコードをコピーします。

<form method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
<div class="search-box">
<input class="search" type="text" value="<?php if (!empty($_GET['s'])) echo esc_attr($_GET['s']); ?>" name="s" id="s"><button id="searchsubmit" class="btn-search"><img alt="検索" width="32" height="20" src="<?php echo esc_url(get_template_directory_uri()); ?>/images/icon/icon-btn-search.png"></button>
</div>
</form>

上記のコードは、検索ボックスを置く位置を決めるコードですので、丸ごとコピーします。

検索ボックスをサイドバーからヘッダーに移転、テーマヘッダー(header.php)にコードを貼ります。

次に、先ほどと同様、テーマの中から右端のテーマファイルを見ます。

その中に、テーマヘッダー(header.php)があります。

テーマヘッダー(header.php)をクリックして、その中のある下記のコードをコピーします。

217行目あたりからコードを記載していきます。そして、 の直前で、コードの記述が終了するようにします。

ただし、このペーストする位置は、基本的に自由ですので、各自好きな位置をきめてください。

また、検索ボックスの長さなども自由です。

検索ボックスをサイドバーからヘッダーに移転。サイドバーの検索ボックス(ウィジェット)は停止します。

従来は、検索ボックスを表示するのに、ウィジェットを使用してサイドバーに表示していました。

このままでは、ヘッダーとサイドバー2カ所に、検索ボックスを表示することになってしまうので、サイドバーの検索ボックスは停止します。

方法は、外観⇒ウィジェット⇒サイドバーの検索ボックスを⇒利用できるウィジェットに戻します。

この時に、また、いつかこの検索ウィジェットは使用するかもしれませんので、削除は行いません。

多くの方に、検索ボックスを使用していただき、サイトを利用していただければと思います。