Cómo agregar un cuadro de búsqueda a una página de WordPress (para principiantes)

Publicado: 2022-07-07

¿Quieres saber cómo agregar un cuadro de búsqueda a una página de WordPress?

Alentará a sus visitantes a realizar una búsqueda, aumentará la capacidad de descubrimiento de su contenido y aumentará la cantidad de páginas vistas que obtiene.

A partir de esta guía, aprenderá cómo agregar un cuadro de búsqueda a sus páginas con unos pocos clics, incluso si es un novato en WordPress.

¡Vamos a empezar!

Beneficios de agregar un cuadro de búsqueda a una página de WordPress

Agregar una barra de búsqueda a sus páginas lo ayudará a:

  • Obtén más páginas vistas . Cuando los visitantes ven una barra de búsqueda en una publicación o página de blog, existe una gran posibilidad de que la usen, especialmente si los motiva a hacerlo.
  • Aumente la visibilidad de su contenido . Dale a tu contenido con bajo número de vistas otra oportunidad de ser descubierto.
  • Ofrezca resultados de búsqueda más relevantes . Ayude a sus visitantes a encontrar más rápido lo que buscan limitando sus cuadros de búsqueda a categorías o tipos de contenido específicos.
  • Aumentar la duración media de la sesión . Cuanto más contenido exploren los visitantes, más tiempo permanecerán en su sitio.
  • Posicionarse más alto en los motores de búsqueda . Una duración de sesión promedio alta es una señal fuerte para Google de que su sitio vale la pena obtener mejores posiciones en los resultados de búsqueda.

Con eso, veamos cómo puede agregar un cuadro de búsqueda a una página en WordPress.

Cómo agregar una barra de búsqueda personalizada en WordPress

La forma más fácil de agregar una barra de búsqueda personalizada a sus páginas de WordPress es usar un complemento como SearchWP.

SearchWP logo

Este es el complemento de búsqueda de WordPress más amigable para principiantes que viene con un montón de características útiles.

Con SearchWP, puede personalizar completamente el trabajo de búsqueda en su sitio para cumplir con sus objetivos comerciales.

Por ejemplo, puede cambiar el orden de los resultados de búsqueda, limitar la búsqueda a solo publicaciones, agregar búsqueda de autocompletar en vivo y mucho más.

¡Y esa es solo una breve lista de las características del complemento!

SearchWP también le permite:

  • Rastree las búsquedas de sus visitantes . De esta manera, puede averiguar qué le interesa a su audiencia y brindarle el contenido que desea.
  • Agregue múltiples formularios de búsqueda a su sitio . Le permite crear formularios de búsqueda personalizados para necesidades específicas y colocarlos en su sitio.
  • Resalte los términos de búsqueda en los resultados de búsqueda . Hace que sea más fácil para sus visitantes reconocer si han encontrado lo que están buscando en sus resultados de búsqueda.
  • Habilite la búsqueda difusa en su sitio . Debido a eso, sus visitantes encontrarán el contenido correcto, incluso si cometen un error tipográfico en una consulta de búsqueda.
  • Y muchos más…

Más de 30 000 propietarios de sitios web ya utilizan SearchWP para mejorar su búsqueda y ofrecer resultados de búsqueda más relevantes a sus visitantes.

¿Listo para unirte a ellos? Luego, veamos cómo puede usar este complemento para agregar un cuadro de búsqueda a sus páginas.

Paso 1: Instalar SearchWP

Para comenzar, obtenga su copia de SearchWP aquí.

Una vez hecho esto, diríjase a su cuenta de SearchWP y haga clic en Descargas .

go to the Downloads tab

A continuación, presione el botón Descargar SearchWP y guarde el archivo ZIP del complemento en su computadora.

click Download SearchWP

Después de la descarga, copie la clave de licencia en la esquina inferior izquierda.

copy your license key

El siguiente paso es instalar y activar el complemento SearchWP en su sitio web de WordPress.

Primero, cargue el archivo ZIP descargado en su sitio. Puede consultar el tutorial sobre cómo instalar un complemento de WordPress si necesita ayuda con eso.

Después de instalar SearchWP, vaya a su panel de control de WordPress, coloque el cursor sobre el botón SearchWP en la barra superior y haga clic en Activar licencia .

click Activate License

Luego, pegue su clave de licencia en el campo Licencia y haga clic en Activar para activar su copia de SearchWP.

click Activate

Tras la activación del complemento, está listo para personalizar su motor de búsqueda.

Paso 2: agregue un nuevo motor de búsqueda a su sitio web

Para comenzar, vaya a la pestaña Motores en su configuración de SearchWP.

go to the Engines tab

En esta pestaña, puede encontrar todos los motores de búsqueda que crea con SearchWP.

the list of your search engines

Actualmente, solo existe el motor de búsqueda predeterminado que SearchWP crea automáticamente después de la instalación. Está conectado a todos los formularios de búsqueda existentes en su sitio.

WordPress considera los motores de búsqueda como un conjunto de reglas a seguir al realizar una búsqueda. Puede personalizar estas reglas para cambiar el funcionamiento de la búsqueda en su sitio.

Por ejemplo, puede hacer que WordPress indexe campos personalizados, excluir páginas específicas de los resultados de búsqueda, habilitar la búsqueda por etiquetas de publicación y mucho más.

Lo mejor es que SearchWP le permite crear múltiples motores de búsqueda y vincularlos a formularios de búsqueda individuales.

De esta forma, puede crear formularios de búsqueda personalizados con un conjunto único de reglas. Le ayudará a reducir los resultados de búsqueda y permitirá que sus visitantes encuentren lo que buscan más rápido.

En este tutorial, crearemos un motor de búsqueda, lo personalizaremos y lo vincularemos a un cuadro de búsqueda, que luego agregaremos a una página separada.

Para comenzar, necesitaremos crear un motor de búsqueda adicional. Puede hacerlo haciendo clic en el botón Agregar nuevo .

add a new Search Engine

Después de eso, aparecerá el motor de búsqueda Suplementario .

the Supplemental search engine

Paso 3: personaliza tu motor de búsqueda

Primero, veamos las fuentes de búsqueda que tiene este buscador.

Como puede ver, hay 4 fuentes de búsqueda: Publicaciones , Páginas , Medios y Usuarios .

Digamos que queremos que este motor de búsqueda busque solo entre publicaciones. De esta manera, podemos limpiar los resultados de búsqueda en nuestro sitio y ayudar a nuestros visitantes a encontrar el contenido correcto más rápido.

Administrar fuentes de búsqueda

Para comenzar, haga clic en el botón Fuentes y configuración .

click Sources and Settings

Luego, desmarque todas las fuentes de búsqueda excepto Publicaciones .

check only Posts source

También puede cambiar el nombre de su motor de búsqueda para que sea más fácil de reconocer. Para ello, introduzca su nombre en el campo Etiqueta del motor .

Por ejemplo, lo llamaremos Awesome Search Engine .

rename your search engine

Cuando haya terminado de personalizar la configuración de su motor de búsqueda, presione Listo .

press Done to save your engine

Haga que los campos y etiquetas personalizados de la publicación se puedan buscar

También demos a nuestros visitantes la posibilidad de buscar publicaciones por etiquetas y campos personalizados.

Para comenzar, haga clic en la fuente de búsqueda de Publicaciones para expandir su configuración.

click on the Posts source

A continuación, presione el botón Agregar o quitar atributos .

click Add Remove attributes

En la ventana que aparece, puede especificar qué campos personalizados de publicación y taxonomías desea que WordPress tenga en cuenta al realizar una búsqueda.

manage post attributes

También hay una manera de hacer que todos los campos personalizados se puedan buscar automáticamente si no desea ingresarlos manualmente.

Para hacer eso, haga clic en el campo Campos personalizados y elija la opción Cualquier clave meta .

choose the Any Meta Key shortcut

Ahora, habilitemos la búsqueda por etiquetas de publicación. Primero, haga clic en el campo Taxonomías .

click on the Taxonomies field

A continuación, busque la taxonomía de etiquetas y haga clic en ella.

add the Tags taxonomy

Ahora los visitantes de nuestro sitio pueden buscar publicaciones por sus etiquetas y campos personalizados.

Cuando haya terminado de administrar los atributos de la fuente de búsqueda de publicaciones, presione Listo para guardar los cambios.

click Done when you finished managing attributes

Guarde su motor de búsqueda

El paso final es guardar su motor de búsqueda. Para hacerlo, haga clic en el botón Guardar motores en la esquina superior derecha.

click Save Engines

A continuación, haga clic en Reconstruir índice para que WordPress vuelva a indexar todas sus publicaciones y páginas.

click Rebuild Index

Después de agregar un nuevo motor de búsqueda y personalizarlo según sus necesidades, el siguiente paso es instalar la extensión SearchWP Shortcodes.

Paso 4: Instale y active la extensión de códigos cortos

Esta extensión le permite agregar una barra de búsqueda a su página usando códigos cortos.

Para comenzar, navegue a SearchWP » Extensiones en el panel izquierdo de su tablero de WordPress.

go to the Extensions tab

Luego, busca la extensión Shortcodes y haz clic en Instalar .

install the Shortcodes extension

Cuando instaló y activó la extensión, estará listo para pasar al paso final y agregar su cuadro de búsqueda personalizado a una página.

Paso 5: agregue una barra de búsqueda personalizada a su página de WordPress

Para comenzar, vaya a Páginas » Agregar nuevo en su tablero de WordPress.

add a new page

Después de llegar al editor de páginas, ingrese el nombre de su página. Por ejemplo, lo llamaremos Buscar tutoriales .

add a heading

A continuación, haga clic en el botón Más .

click the Plus button

Después de que aparezca la ventana de bloques, haga clic en el bloque HTML personalizado para agregarlo a su página.

add the Custom HTML block

El siguiente paso es copiar y pegar el siguiente código en el bloque HTML personalizado agregado:

[searchwp_search_form engine="awesome_search_engine" var="searchvar" button_text="Find Results"]
  
<div class="search-results-wrapper">
 [searchwp_search_results engine="awesome_search_engine" var="searchvar" posts_per_page=4]
  <h2>[searchwp_search_result_link direct="true"]</h2>
  [searchwp_search_result_excerpt]
 [/searchwp_search_results]
</div>
  
<div class="no-search-results-found">
 [searchwp_search_results_none]
 No results found, please search again.
 [/searchwp_search_results_none]
</div>
  
<div class="search-results-pagination">
 [searchwp_search_results_pagination direction="prev" link_text="Previous" var="searchvar" engine="awesome_search_engine"]
 [searchwp_search_results_pagination direction="next" link_text="Next" var="searchvar" engine="awesome_search_engine"]
</div>

Asegúrese de reemplazar el motor de búsqueda impresionante en el código anterior con el nombre de su motor de búsqueda.

Este código muestra un cuadro de búsqueda vinculado al motor de búsqueda que personalizó en los pasos anteriores.

Además, muestra paginación si hay más de 4 resultados de búsqueda en la página y el mensaje "No se encontraron resultados" si no hay resultados de búsqueda.

Cuando termine de agregar el código, publique su página presionando el botón Publicar en la esquina superior derecha.

click Publish

Luego, haga clic en Ver página para ver su nueva página de búsqueda con un cuadro de búsqueda personalizado.

click View Page

Así es como se ve esta página en nuestro sitio de prueba:

how to add a search box to a WordPress page

Probemos también nuestro cuadro de búsqueda para asegurarnos de que funciona correctamente.

Tenemos muchas publicaciones en nuestro sitio relacionadas con WordPress en varias categorías, pero solo una de ellas está adjunta a la categoría Tutoriales .

En uno de los pasos anteriores, limitamos este formulario de búsqueda a la categoría Tutoriales . Veamos qué resultados obtendremos al buscar WordPress .

click Find Results

Como puede ver, solo encontramos nuestra única publicación que se encuentra dentro de la categoría Tutoriales .

we found the post

Significa que nuestro cuadro de búsqueda funciona como se supone que debe hacerlo.

Cómo agregar un cuadro de búsqueda al menú de navegación de WordPress

También puede agregar un cuadro de búsqueda al menú de navegación de su sitio.

Lo hace más visible para sus visitantes y los anima a realizar una búsqueda.

add a search bar to the navigational menu

Para obtener más detalles, consulte el tutorial paso a paso sobre cómo agregar una barra de búsqueda al menú de WordPress.

De este artículo, aprendió cómo agregar fácilmente un cuadro de búsqueda a una página, incluso si es un novato de WordPress.

Esperamos que lo ayude a brindar una forma más conveniente para que sus visitantes busquen contenido en su sitio.

¿Listo para crear un cuadro de búsqueda inteligente y agregarlo a sus páginas? Puede comenzar con SearchWP aquí.

¿Utilizas el complemento de Elementor? Consulte la guía para principiantes sobre cómo agregar un cuadro de búsqueda a la página de Elementor.

Es posible que también desee obtener más información sobre cómo hacer una búsqueda de WordPress en el contenido de la publicación.