WordPressで切り替えタブごとに違う検索機能を実装したい

TOPページに検索機能をタブで切り替えて実装したいと考えています。
（例：自由検索、カテゴリ検索等）

https://it-tantou.com/2524/
上記のサイトを参考にし、TOPページ(front-page.php)にタブの切り替えを実装することはできましたが、
実装した各タブ内への検索機能の実装の仕方がよく分かりませんでした。
参考にしたサイトのコード例を以下に記載します。

<div class="tabs_wrap"> <ul class="tabs"> <li><a href="#">自由検索</a></li> <li><a href="#">カテゴリ検索</a></li> <li><a href="#">◯◯検索</a></li> </ul> <div class="tabs_content"> <div> <p>コンテンツの内容1</p> </div> <div> <p>コンテンツの内容2</p> </div> <div> <p>コンテンツの内容3</p> </div> </div> </div>

例えば単純な自由検索機能（文字入力欄があり、ボタンをクリックすると入力された文字で検索）を
実装するとなった場合はコンテンツの内容1の欄に処理を実装していくことになりますでしょうか。

ちなみに検索機能自体は以下のサイトを参考にして、DBからデータを取得する形にしたいと思っています。
http://blog.yukarien.com/tech/wordpress-db-access/#i-5

wordpress,php初心者でして、適切な用語などを使って質問できておらず大変申し訳ありません。

是非アドバイスを頂ければと思います。