Elementorを使用した補足エンジンの利用
Elementor を使用して補足検索フォームと結果をデザインおよび構築するには、いくつかの手順が必要ですが、可能です!
新しいページを作成する
WordPress 管理画面にログインした状態で、Elementor を使用して新しいページを作成してください。
検索フォームウィジェットをドラッグします:
重要:検索フォームの「高度な設定」ペインで CSS ID を編集し、一意の ID を付けます。この記事では searchwp-supplemental-form を使用します:
検索フォームウィジェットの下に、投稿ウィジェットを追加します:
重要:フックでフラグを立てられるように、クエリ ID を設定する必要があります。投稿ウィジェットの「クエリ」ペインを展開し、一意のクエリ ID を入力します。この記事では searchwp-supplemental を使用します:
これら 2 つのウィジェットが、補足エンジンの検索を容易にします。
必要なフックを追加する
すべてを機能させるには、いくつかのフックが必要です。これらをテーマの functions.php に追加できます:
| <?php | |
| // @link https://searchwp.com/documentation/knowledge-base/using-elementor-for-supplemental-engines/ | |
| // We need to flag the search form. | |
| add_action( 'elementor_pro/search_form/after_input', function( $form ) { | |
| // Check to see if this is the right Search Form. | |
| $settings = $form->get_data( 'settings' ); | |
| if ( isset( $settings['_element_id'] ) && 'searchwp-supplemental-form' == $settings['_element_id'] ) { | |
| ?> | |
| <input type="hidden" name="searchwp" value="supplemental" /> | |
| <?php | |
| } | |
| } ); | |
| // Redirect when applicable. | |
| add_action( 'template_redirect', function() { | |
| if ( is_search() && ! empty( $_GET['searchwp'] ) && 'supplemental' === $_GET['searchwp'] ) { | |
| wp_safe_redirect( add_query_arg( array( | |
| 'swpquery' => get_search_query(), | |
| ), get_permalink( 18 ) ) ); | |
| exit(); | |
| } | |
| } ); | |
| // Provide Search results. | |
| add_filter( 'elementor/query/query_args', function( $query_vars, $widget ) { | |
| // Check to see if this is the right Widget. | |
| $settings = $widget->get_data( 'settings' ); | |
| if ( is_admin() | |
| || ! isset( $settings['posts_query_id'] ) | |
| || ( ! empty( $settings['posts_query_id'] ) && 'searchwp-supplemental' !== $settings['posts_query_id'] ) ) { | |
| return $query_vars; | |
| } | |
| // This form field was set up in Elementor. | |
| $query = isset( $_GET['swpquery'] ) ? sanitize_text_field( $_GET['swpquery'] ) : ''; | |
| if ( ! empty( $query ) ) { | |
| // Perform the search. | |
| $searchwp = new SWP_Query( array( | |
| 's' => $query, | |
| 'engine' => 'supplemental', // Engine to search. | |
| 'fields' => 'ids', | |
| 'posts_per_page' => -1, | |
| ) ); | |
| if ( empty( $searchwp->posts ) ) { | |
| $searchwp->posts = array( 0 ); | |
| } | |
| // Override the query vars with SearchWP results. | |
| $query_vars['post__in'] = $searchwp->posts; | |
| $query_vars['post_type'] = 'any'; // Restricted by post__in. | |
| $query_vars['post_status'] = 'any'; // Restricted by post__in. | |
| $query_vars['orderby'] = 'post__in'; // Order by post__in. | |
| $query_vars['order'] = 'DESC'; // Order descending. | |
| } else { | |
| // Force no results. | |
| $query_vars['post__in'] = array( 0 ); | |
| } | |
| return $query_vars; | |
| }, 10, 2 ); |
最初のフック(7〜18行目)は、検索フォームに非表示の input を追加します。
2 番目のフック(20〜28行目)は、その非表示の input を探し、見つかった場合は補足エンジンのページにリダイレクトします。
注意:この記事のページの ID は 18 です。作業中の新しく作成したページの ID に ID(22行目を参照)を更新する必要があります。
3 番目にして最後のフック(30〜68行目)は、SearchWP の結果で追加した投稿ウィジェットのコンテンツを上書きする責任があります。
注意:補足エンジンの名前(45行目を参照)は、検索したい補足エンジンの名前に一致するように更新する必要があります。





