Añadir un Cuadro Desplegable de Selección de Motor al Formulario de Búsqueda
Una de las características más populares de SearchWP es la capacidad de crear múltiples motores de búsqueda. La mayoría de las veces, múltiples motores dan como resultado múltiples formularios de búsqueda, cada uno con su propia plantilla de resultados de búsqueda. También es posible usar en su lugar su formulario de búsqueda y plantilla de resultados predeterminados para cualquier motor de búsqueda en SearchWP.
Este artículo explicará cómo puede lograr tres enfoques diferentes para agregar un menú desplegable de Motor a su formulario de búsqueda.
- Cree su propio formulario de búsqueda con un menú desplegable de Motor
- Personalice la Extensión de Shortcodes para incluir un menú desplegable de Motor
- Personalice el formulario de búsqueda predeterminado para incluir un menú desplegable de selección de Motor
Creación de su propio formulario de búsqueda
La creación de su propio formulario de búsqueda implica editar los archivos de su tema para incluir los campos de entrada y los botones que deseamos incluir. En el nivel más básico, puede agregar lo siguiente al archivo de plantilla de su tema donde desee que aparezca el formulario:
| <!-- https://searchwp.com/documentation/knowledge-base/engine-select-dropdown/ --> | |
| <form role="search" method="get" class="search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>"> | |
| <label> | |
| <span class="screen-reader-text">Search for:</span> | |
| <input type="search" class="search-field" placeholder="Search..." value="<?php echo esc_attr( get_search_query() ); ?>" name="s" title="Search for:" /> | |
| </label> | |
| <?php | |
| $engines = \SearchWP\Settings::get_engines(); | |
| $current_engine = isset( $_GET['swpengine'] ) ? esc_attr( $_GET['swpengine'] ) : 'default'; | |
| ?> | |
| <select name="swpengine" id="swpengine"> | |
| <?php foreach ( $engines as $engine_name => $engine ) : ?> | |
| <option value="<?php echo esc_attr( $engine_name ); ?>" | |
| <?php selected( $current_engine, $engine_name ); ?>> | |
| <?php echo esc_html( $engine->get_label() ); ?> | |
| </option> | |
| <?php endforeach; ?> | |
| </select> | |
| <input type="submit" class="search-submit" value="Search" /> | |
| </form> |
Nota: 'Predeterminado' se genera para el motor predeterminado, puede personalizarlo editando la línea 14 de ese fragmento.
Este formulario está estructurado como el formulario de búsqueda predeterminado de WordPress, pero también incluye un select que contiene todos sus Motores de SearchWP definidos.
Una vez que su formulario esté configurado, redirigirá a su plantilla de resultados de búsqueda predeterminada, pero también debemos indicarle a SearchWP qué motor usar para la búsqueda.
Todos los ganchos deben agregarse a su plugin personalizado de SearchWP Customizations Plugin.
| <?php | |
| // @link https://searchwp.com/documentation/knowledge-base/engine-select-dropdown/ | |
| if ( ! empty( $_GET['swpengine'] ) ) { | |
| add_filter( 'searchwp\query\args', function( $args ) { | |
| $args['engine'] = $_GET['swpengine']; | |
| return $args; | |
| } ); | |
| } |
Este fragmento es el único responsable de verificar qué se eligió en el menú desplegable de Motores y de usar esa configuración de motor para la búsqueda.
Use la Extensión de Shortcodes de SearchWP
La Extensión de Shortcodes de SearchWP le permite generar fácilmente formularios de búsqueda y controlar las páginas de resultados de búsqueda utilizando Shortcodes de WordPress. Aquí hay un ejemplo de formulario de búsqueda que incluye un menú desplegable de Categorías para elegir:
Nota: requiere la versión 1.2.1 o superior de Shortcodes
Todos los ganchos deben agregarse a su plugin personalizado de SearchWP Customizations Plugin.
| <?php | |
| // @link https://searchwp.com/documentation/knowledge-base/engine-select-dropdown/ | |
| // ***** UNCOMMENT THIS IF YOU WANT TO USE SHORTCODES IN WIDGETS | |
| // add_filter( 'widget_text', 'do_shortcode' ); | |
| // Output a SearchWP Engines dropdown | |
| function my_searchwp_shortcodes_inject_engines() { ?> | |
| <p class="searchwp-shortcodes-engines"> | |
| <?php | |
| $engines = \SearchWP\Settings::get_engines(); | |
| $current_engine = isset( $_GET['swpengine'] ) ? esc_attr( $_GET['swpengine'] ) : 'default'; | |
| ?> | |
| <select name="swpengine" id="swpengine"> | |
| <?php foreach ( $engines as $engine_name => $engine ) : ?> | |
| <option value="<?php echo esc_attr( $engine_name ); ?>" | |
| <?php selected( $current_engine, $engine_name ); ?>> | |
| <?php echo esc_html( $engine->get_label() ); ?> | |
| </option> | |
| <?php endforeach; ?> | |
| </select> | |
| </p><?php | |
| } | |
| add_action( 'searchwp_shortcodes_after_input', 'my_searchwp_shortcodes_inject_engines' ); |
Esto personalizará el formulario de Shortcodes de SearchWP para incluir también nuestro menú desplegable de Motores. Sin embargo, eso solo maneja el menú desplegable. Todavía necesitamos indicarle a SearchWP qué motor usar al realizar una búsqueda. Esto se puede hacer agregando lo siguiente a su plugin de Personalizaciones de SearchWP (no al archivo de plantilla del tema donde agregó el código del formulario).
| <?php | |
| // @link https://searchwp.com/documentation/knowledge-base/engine-select-dropdown/ | |
| if ( ! empty( $_GET['swpengine'] ) ) { | |
| add_filter( 'searchwp\query\args', function( $args ) { | |
| $args['engine'] = $_GET['swpengine']; | |
| return $args; | |
| } ); | |
| } |
Ese fragmento verificará la solicitud de búsqueda para ver qué motor se eligió en el menú desplegable y lo usará para la búsqueda actual.
Modifique el formulario de búsqueda predeterminado para incluir un menú desplegable de Motores
WordPress nos permite filtrar el formulario de búsqueda predeterminado que se encuentra en muchos temas. Se genera mediante una llamada a get_search_form(), que se puede personalizar por completo incluyendo un archivo llamado searchform.php en su directorio de temas, o a través del filtro get_search_form. Para este ejemplo, utilizaremos el filtro get_search_form.
Todos los ganchos deben agregarse a su plugin personalizado de SearchWP Customizations Plugin.
Para incluir un menú desplegable de Motores en el formulario de búsqueda predeterminado de su sitio, agregue lo siguiente a su plugin de Personalizaciones de SearchWP:
| <?php | |
| // Adds a SearchWP Engines dropdown to the search form | |
| // @link https://searchwp.com/documentation/knowledge-base/engine-select-dropdown/ | |
| function my_searchwp_get_search_form_with_engines_dropdown( $form ) { | |
| ob_start(); ?> | |
| <form role="search" method="get" class="search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>"> | |
| <label> | |
| <span class="screen-reader-text">Search For</span> | |
| <input type="search" class="search-field" placeholder="Search..." value="<?php echo esc_attr( get_search_query() ); ?>" name="s" title="Search for:" /> | |
| </label> | |
| <?php | |
| $engines = \SearchWP\Settings::get_engines(); | |
| $current_engine = isset( $_GET['swpengine'] ) ? esc_attr( $_GET['swpengine'] ) : 'default'; | |
| ?> | |
| <select name="swpengine" id="swpengine"> | |
| <?php foreach ( $engines as $engine_name => $engine ) : ?> | |
| <option value="<?php echo esc_attr( $engine_name ); ?>" | |
| <?php selected( $current_engine, $engine_name ); ?>> | |
| <?php echo esc_html( $engine->get_label() ); ?> | |
| </option> | |
| <?php endforeach; ?> | |
| </select> | |
| <input type="submit" class="search-submit" value="Search" /> | |
| </form> | |
| <?php return ob_get_clean(); | |
| } | |
| add_filter( 'get_search_form', 'my_searchwp_get_search_form_with_engines_dropdown' ); |
El código del formulario utilizado aquí se basa en el formulario de búsqueda predeterminado que se incluye con WordPress. Existe la posibilidad de que su tema haya personalizado previamente el formulario y simplemente desee agregar el menú desplegable. Puede modificar el código del formulario para que coincida con lo que se incluyó con su tema y agregar las líneas 11-22 de esa muestra de código donde desee que aparezca su menú desplegable de Motores.
Este fragmento solo modifica el formulario de búsqueda, todavía necesitamos capturar el valor del menú desplegable y decirle a SearchWP que use el Motor elegido para la búsqueda. Podemos hacer eso agregando lo siguiente a su complemento de personalizaciones de SearchWP (no al archivo de plantilla del tema donde agregó el código del formulario).
| <?php | |
| // @link https://searchwp.com/documentation/knowledge-base/engine-select-dropdown/ | |
| if ( ! empty( $_GET['swpengine'] ) ) { | |
| add_filter( 'searchwp\query\args', function( $args ) { | |
| $args['engine'] = $_GET['swpengine']; | |
| return $args; | |
| } ); | |
| } |
