WordPressのテーマによっては、すでに検索が備わっている場合が多いのでR。
ただし、
それは、
ウィジェットを使って、サイドバーか、フッターバーに挿入するパターンが多いのでR。
しかし、
最近のテーマは、ウィジェットの配置する位置がおしゃれな感じになっているテーマが多く、そこに検索窓をウィジェットで作ると、おしゃれなテーマがダサく見えるのでR。
そこで、対策として、
メニュー内に検索窓を作るのでR。
固定ページでの検索は、ここの記事のように作ったのでRが、メニューの検索窓は別の方法になるのでR。
一つの方法は、プラグイン「Search box on Navigation Menu」を使うのでR。プラグインの詳細は、ここにあるのでR。
「ダッシュボード」→「プラグイン」→「新規追加」で、Search box on Navigation Menuを検索し、インストール、有効化するのでR。
すると、
設定などは特にないプラグインのようでRが、一応メニュー内を覗くと、検索窓があるのでR。
しかし、
プラグインを使わなくても、function.phpやstyle.phpを編集する方法で簡単に検索窓を作ることもできるのでR。その方が、動作的にはちょびっとは速いかもしれないのでR。
そこで、function.phpに
add_filter('wp_nav_menu_items','add_search_box', 10, 2); function add_search_box($items, $args) { ob_start(); get_search_form(); $searchform = ob_get_contents(); ob_end_clean(); $items .= ' <li>' . $searchform . '</li> '; return $items; }
を挿入し、style.cssに
#main-nav .search-submit { display: block; width: 30px; height: 30px; position: absolute; top: 0; right: 0; padding: 0; margin: 0; background: url(images/search_icon.png) no-repeat center center; text-indent: -99999999999px; }
を挿入すると、同じような検索窓ができていたのでR。
しかし、確認すると、
style.cssに記述がなくとも、function.phpへ挿入だけでも出来ていたようでR。
![](https://images-fe.ssl-images-amazon.com/images/I/51EnPaWDKuL._SL160_.jpg)
![](https://www10.a8.net/0.gif?a8mat=2TCC9A+8RJUHE+CO4+60OXE)
![](https://www14.a8.net/0.gif?a8mat=2TAAL7+5E3F2Q+CO4+ZQFQA)
![](https://www13.a8.net/0.gif?a8mat=2TTSDP+BT3LSI+348+1BQJAA)
この記事をシェアできます。