Cómo agregar la barra de búsqueda a un sitio de WordPress

La barra de búsqueda es un elemento esencial de un sitio web con el que nadie estaría en desacuerdo. Esto se debe a que un sitio web contiene mucha información a través de la página de inicio, las páginas de productos, las páginas de blogs, la página de precios, etc. Por eso es crucial que agregue una barra de búsqueda a su sitio de WordPress.

Si necesita algunos datos que existen en diferentes páginas, ¿cómo los encontrará? ¿Los vas a encontrar visitando esas páginas individualmente? Seguramente, no le gustaría hacerlo. No es que no encuentre la información requerida de esta manera. Pero también lleva mucho tiempo y es repugnante. Aquí es donde entrará en juego agregar una barra de búsqueda a su sitio.

¿Por qué agregar una barra de búsqueda en su sitio?

Supongamos que no tiene una barra de búsqueda en su sitio. En ese caso, cuando los visitantes visiten su sitio, tendrán dificultades para encontrar la información requerida. Como resultado, abandonarán su sitio y todo su propósito de ingresarlos en el sitio web será en vano.

Permítame presentarle algunos de los principales beneficios que puede obtener agregando una barra de búsqueda en su sitio a continuación:

• Facilita el esfuerzo de sus clientes para encontrar información
• Agiliza la experiencia del usuario
• Aumenta el compromiso
• Reduce la tasa de rebote
• Muestra los elementos o la información necesarios con unas pocas palabras clave, lo que reduce el esfuerzo

Agregar una barra de búsqueda en el menú con el widget de búsqueda predeterminado de WordPress:

¿Puedes agregar una barra de búsqueda en el menú con el widget de búsqueda predeterminado de WordPress? No, no puedes. Porque WordPress le permite agregar una barra de búsqueda solo en áreas listas para widgets.

Si desea agregar una barra de búsqueda en el menú, debe aprovechar otros complementos o widgets en diferentes áreas de su sitio web, incluidos el encabezado y el pie de página.

Es por eso que lo guiaría a través de 3 métodos diferentes para agregar una barra de búsqueda en su sitio de WordPress en este tutorial.

Ahora, echemos un vistazo a la forma en que puede agregar una barra de búsqueda a su sitio web a través del widget predeterminado de WordPress.

Agregue la barra de búsqueda con el widget de búsqueda predeterminado de WordPress:

La forma más fácil y conveniente de inyectar una barra de búsqueda en su sitio web es a través de su panel de control de WordPress. ¿Como hacer eso? Vamos a ver-

Navegue a los Widgets desde Dashboard:

Al principio, vaya al tablero de su panel de administración y busque Apariencia. Navegue y haga clic en Widgets de una lista de elementos en Apariencia.

Tablero > Apariencia > Widgets

Agregue el widget de búsqueda de los widgets disponibles:

Esto lo llevará a una nueva página que aparecerá con diferentes secciones de página. Ahora, presione el botón "Agregar bloque" (aparece con el signo +) para ver todos los widgets existentes.

Desplácese hacia abajo para encontrar el widget de búsqueda o puede escribir "Buscar" en el campo de búsqueda para encontrar el widget de búsqueda.

Haga clic en la sección en la que desea que aparezca la barra de búsqueda y luego presione el widget de búsqueda. Alternativamente, también puede arrastrar y soltar el widget de búsqueda a la sección deseada.

Haz los ajustes necesarios:

La barra de búsqueda aparecerá ahora debajo de la sección seleccionada. Puede realizar los cambios necesarios en diferentes elementos, como la alineación de la barra de búsqueda, la posición del botón, el color del texto, etc.

También puede agregar una etiqueta personalizada a la barra de búsqueda según sus requisitos. Finalmente, haga clic en el botón Actualizar.

Ver la barra de búsqueda en tu página:

Ahora, si visita cualquiera de sus páginas o publicaciones publicadas, puede notar que la barra de búsqueda o el cuadro de búsqueda aparecen en la barra lateral principal.

Agregue la barra de búsqueda con el widget de búsqueda de ElementsKit:

Ahora, lo guiaré a través de otra forma fácil de agregar una barra de búsqueda en su sitio de WordPress. Y eso es a través del widget de búsqueda de encabezado de ElementsKit. Es súper simple agregar un cuadro de búsqueda a través de ElementsKit.

Sin más preámbulos, vamos a comprobarlo-

Navegue a cualquiera de sus publicaciones o páginas existentes desde el panel:

En primer lugar, vaya al panel de control y busque publicaciones o páginas. Aquí, mostraré cómo funciona el widget ElementsKit con una publicación llamada "¡Hola mundo!"

Vaya a "Publicaciones" y luego seleccione "Todas las publicaciones" para que se muestren todas sus publicaciones. Desde allí, puede elegir la publicación en la que desea agregar una barra de búsqueda. En caso de que no tenga ninguna publicación o página existente, debe agregar una nueva publicación o página.

Panel de control > Publicaciones > Todas las publicaciones > Tu publicación

Cambie a la ventana de Elementor:

Ahora, haga clic en "Editar con Elementor" ubicado en la parte superior central. Esto lo llevará a la ventana de Elementor.

Arrastre y suelte el widget de búsqueda de encabezado:

En la ventana de Elementor, obtendrá acceso a toneladas de widgets. Escriba el widget "Búsqueda de encabezado" en el campo de búsqueda para encontrar el widget. Alternativamente, puede desplazarse hacia abajo y encontrar el widget también.

Una vez que encuentre el widget, arrástrelo y suéltelo en el área designada para que aparezca la barra de búsqueda. No olvide agregar la sección sobre el texto de su publicación, ya que es una barra de búsqueda de encabezado.

Establezca los parámetros de la barra de búsqueda:

Una vez que la barra de búsqueda aparece en la página, es hora de configurar los parámetros de la barra según sus preferencias. En la pestaña Contenido, tendrá una sección de búsqueda de encabezado donde coloca un texto de marcador de posición, selecciona un icono de búsqueda y ajusta el tamaño de la fuente.

En la pestaña Estilo, tendrá 2 secciones: Búsqueda de encabezado y Contenedor de búsqueda. Desde la sección Búsqueda de encabezado, puede ajustar los parámetros como el color de fondo, el tipo de borde, la sombra del cuadro de búsqueda, el margen, etc. de la barra de búsqueda.

En la sección Contenedor de búsqueda, puede seleccionar el tipo de fondo y establecer el texto del marcador de posición y el color del borde.

¡Finalmente, usted es bueno para ir!

Una vez que haya finalizado su configuración, estará listo para verificar y ver la barra de búsqueda en la parte frontal de su publicación. Si no está satisfecho con el aspecto del cuadro de búsqueda, puede modificarlo nuevamente desde el panel de administración.

Agregar cuadro de búsqueda con código CSS:

Hay una forma más que puede usar para agregar una barra de búsqueda en su sitio y es usar el código CSS. Aunque necesita un poco de conocimiento técnico para hacer eso, no es ciencia espacial. Te mostraré el proceso aquí y será muy fácil después de eso.

Ve al Editor de temas:

En primer lugar, haga clic en "Apariencia" en el panel y navegue hasta el "Editor de temas".

Abra el archivo header.php o sidebar.php:

Con eso, pasará al archivo style.css por defecto. Desde allí, abre el archivo header.php o sidebar.php según la posición en la que quieras que aparezca la barra de búsqueda.

Agregar función de barra de búsqueda:

Ahora, agregue esta función <?php get_search_form(); ?> en su código de archivo header.php o sidebar.php. He agregado la función en el código del archivo header.php.

Ver la barra de búsqueda en su sitio:

Finalmente, abra cualquiera de sus páginas publicadas y notará que la barra de búsqueda aparece en la parte superior. Si agregó la función en el archivo sidebar.php, la barra de búsqueda aparecerá en la barra lateral.

Liquidando:

¡¡¡Eso es todo!!! Lo he guiado a través de 3 técnicas súper fáciles para agregar una barra de búsqueda a su sitio de WordPress. Dependiendo de tus requerimientos, puedes optar por cualquiera de ellos. Sin embargo, si agrega la barra de búsqueda con el widget de búsqueda de encabezado de ElementsKit, obtendrá un beneficio adicional.

¿Que es eso? ¡Opciones de personalización infinitas! Por lo tanto, si le encanta la personalización, utilice el widget de búsqueda de encabezado de ElementsKit. Con eso, puede darle a su barra de búsqueda una apariencia fascinante.