【WordPress】独自の検索フォームを作成して、特定のカスタム投稿のみ検索できるようにし、ショートコードでどこでも設置できるようにする方法。

たとえば、料理に関するサイトをつくり、その中で食材の辞典みたいなものをカスタム投稿タイプ作成した場合など、食材だけを検索できる独自フォームを設置したい場合など。

検索フォーム用のファイルを作成する

shokuzai-search-form.php みたいなファイルを作成する

<div class="search-box">
  <form method="get" action="<?php echo home_url('shokuzai-search-result'); ?>">
    <input type="text" name="shokuzaiResult" value="<?php the_search_query(); ?>" placeholder="食材を検索" />
    <button type="submit" class="search-btn">検索</button>
  </form>
</div>

検索結果の送り先は、actionで固定ページ(shokuzai-search-result)を指定してます。

フォームで入力されたワード(name)を「shokuzaiResult」の値として出力します。
⇒アーモンドと入力された場合、 value=”アーモンド” になる。
⇒ value=”<?php the_search_query(); ?>”

検索した結果を表示するファイルを作成する

shokuzai-search-result.php みたいなファイルを作成し、検索結果を受け取れるようにする。

<?php
$args = array(
    'post_type' => 'shokuzai',
    'posts_per_page' => -1, //表示数
    's' => $_GET['shokuzaiResult'], 
);
$wp_query = new WP_Query($args);

if ( $wp_query->have_posts()): while ( $wp_query->have_posts()): $wp_query->the_post();
?>

<a href="<?php the_permalink(); ?>">
  <p class="search-result__title"><?php the_title(); ?></p>
</a>
<p class="search-result__excerpt"><?php the_excerpt(); ?></p>

<?php endwhile; ?>
<?php else: ?>
<p>キーワードは見つかりません。</p>
<?php endif; ?>
<?php wp_reset_postdata(); ?>

ここでは、カスタム投稿タイプが「shokuzai」とします。

フォームを受け取るのにget_search_query()ではなく、PHPで使われる$_GET[]を使う。

検索にかけられた文字列を‘s’ => $_GET[‘shokuzaiResult’]で取得・設置します。

サーバーに作成した上記ファイルをFTP等でアップロードします。

ワードプレス検索でカスタム投稿タイプを検索できるようにする

functions.phpに以下のコードを張り付けます。

ここでは、カスタム投稿タイプ「shokuzai」としてます。

//サイト内検索でカスタム投稿を含める
function include_custom_post_search($query) {
    if ($query->is_search() && $query->is_main_query() && ! is_admin()) {
        $query->set('post_type', array('post', 'page', 'shokuzai'));
    }
    return $query;
}
add_filter('pre_get_posts', 'include_custom_post_search' , 10 , 1);

ショートコードでphpファイルを呼び出せるようにする

functions.phpに以下のようなコードを張り付けます。

//ショートコードで○○.phpファイルの呼び出す方法
//例)shokuzai-search-form.php を呼び出す時は、[myphp file='shokuzai-search-form']
function my_php_Include($params = array()) {
 extract(shortcode_atts(array('file' => 'default'), $params));
 ob_start();
 include(STYLESHEETPATH . "/tmp/$file.php");
 return ob_get_clean();
}
add_shortcode('myphp', 'my_php_Include');

ここでは、呼び出したいファイルは、/tmp/○○○.php にあるものとしてます。

検索フォームを設置したい記事なり、固定ページなりにショートコードを張り付けます。

設置した部分を確認します。

事前に、カスタム投稿タイプ「shokuzai」には記事があるものとします。

「食材を検索」の部分に「アーモンド」と入力して「検索」をクリックします。

以下のようにアーモンドが表示されました。

タイトルとURLをコピーしました