Cómo crear páginas de resultados de búsqueda personalizadas con Elementor: una guía práctica completa

Elementor proporcionaCreador de temasy potentes widgets pueden ayudarle a crear fácilmente páginas de resultados de búsqueda personalizadas. Este tutorial detallará cómo puede utilizar Elementor para crear una página de resultados de búsqueda personalizada al tiempo que la hace más acorde con las necesidades de diseño de su sitio web.

¿Qué es una página de resultados de búsqueda personalizada?

Página de resultados de la búsqueda es una página dedicada a mostrar los resultados de la búsqueda de contenidos por parte de un usuario, que suele incluir entradas de blog, productos u otros contenidos categorizados. Para los sitios web ricos en contenidos, una página de resultados de búsqueda puede ayudar a los usuarios a encontrar rápidamente la información que necesitan.

un Página de resultados de búsqueda personalizada Le permite integrar más funciones en función de sus necesidades reales, como imágenes destacadas, cabeceras personalizadas, filtros, etc. Esto no sólo es estéticamente agradable, sino que también mejora la experiencia general del usuario, además de aumentar las conversiones.

Casos de uso comunes para personalizar las páginas de resultados de búsqueda en WordPress

Antes de sumergirnos en el tutorial, he aquí algunos casos de uso común para personalizar la página de resultados de búsqueda:

1. Sitio web de comercio electrónico
2. Blog
3. Página de la base de conocimientos
4. empresa orientada a los servicios
5. Sitio web sobre educación

Creación de páginas de resultados de búsqueda personalizadas en Elementor

En este tutorial, le guiaremos paso a paso sobre cómo crear una página de resultados de búsqueda personalizada totalmente funcional en Elementor.

condiciones previas

Asegúrese de que tiene los siguientes plugins instalados en su sitio:

• Elementor
• Elementor Pro

Cuando esté listo, siga los pasos que se indican a continuación.

Paso 1: Acceda al constructor de temas de Elementor

1. Acceda a su panel de control de WordPress y navegue hasta la sección Plantillas > Creador de temas.

2. En el constructor de temas, seleccione Resultados de la búsqueday luego haga clic en + Añadir nuevo para crear una nueva plantilla de página de resultados de búsqueda.

Esto le llevará al Editor de páginas de Elementor, donde podrá arrastrar y soltar widgets libremente para crear páginas.

Paso 2: Crear la sección del cuadro de búsqueda

1. Crear una nueva sección
   golpe (en el teclado) Signo más (+) seleccione la estructura de columnas adecuada (por ejemplo, diseño de una sola columna o de varias columnas), y nosotros seleccionamos el diseño de una sola columna.

2. Añadir título
   comandante en jefe (militar) Widget de título Arrástrelo a la parte superior de la sección y escriba un título breve para la página de búsqueda (por ejemplo, "Resultados de la búsqueda").
   • existe tipo en el que puede personalizar los colores, tipos de letra, alineación, etc. de los encabezados para que se ajusten al diseño general de la página.

3. Añadir descripción
   arrastrar y soltar (informática) Widget Editor de texto Vaya a la parte inferior del título y añada una breve descripción de la página (por ejemplo, "Aquí están los resultados de su búsqueda").

Paso 3: Añadir widget de búsqueda

1. Arrastrar y soltar widgets de búsqueda
   Buscar en el elemento Buscar widgets, arrastre y suelte debajo del título o del editor de texto.

2. Widgets de búsqueda personalizados
   • entrar en Ficha Avanzado, ajuste el cuadro de búsqueda delamplitud, establece los valores de los márgenes izquierdo y derecho.
   • existe Ficha de estilo en el que puede personalizar el color de fondo, el borde y el estilo del texto del marcador de posición del cuadro de búsqueda.
   • Añadir esquinas redondeadas a los cuadros y botones de búsqueda: en el Radio del borde Introduzca un valor adecuado (por ejemplo, 10px) en el cuadro de búsqueda para que resulte más estético.

3. Activar la función de búsqueda en tiempo real
   • existe pestaña Contenido > Resultados sección, habilite Resultados en tiempo realy fije el número de resultados que se mostrarán debajo del cuadro de búsqueda.

Paso 4: Crear una plantilla para los resultados de búsqueda en tiempo real

La plantilla de resultados en directo es un diseño dinámico del contenido que se muestra cuando un usuario introduce una palabra clave en el cuadro de búsqueda.

1. existe Sección de resultados En el Crear una plantilla para ir a una nueva página.

2. Añadir imagen destacada
   • arrastrar y soltar (informática) Widget de entradas destacadas, mostrando imágenes destacadas de los resultados de búsqueda.
   • existe Ficha de estilo Ajusta el tamaño, la alineación y el radio del borde de la imagen en el

3. Añadir título del post
   • arrastrar y soltar (informática) Widget de título de entrada Vaya junto a la imagen destacada y ajuste el tamaño de la fuente, el color y la alineación.

Una vez completado el diseño, guarde la plantilla y vuelva a la página principal del lienzo para asociar la plantilla a la opción Resultados de búsqueda en vivo.

Paso 5: Añadir el widget de entradas archivadas

existeDebajo del cuadro de búsquedaCree una nueva sección para mostrar la lista completa de resultados de la búsqueda:

1. arrastrar y soltar (informática) Widget de mensajes archivados a la nueva sección.

2. Disposición de la configuración:
   • cambiar a pestaña Contenido > DiseñoSi desea establecer el número de columnas (por ejemplo, 2 columnas) y la posición de la imagen (por ejemplo, arriba), puede hacerlo.
   • Active las opciones de título, extracto y metadatos, y personalice la longitud de los caracteres y los tipos de metadatos (como fechas o comentarios).

3. Estilos personalizados:
   • entrar en Ficha de estilo, ajustando los espacios entre columnas, los colores de las fuentes y los estilos de fondo para que sean coherentes con el diseño del sitio.
   • Los estilos de paginación personalizados garantizan que los usuarios puedan navegar fácilmente por varias páginas de resultados.

Paso 6: Guardar y previsualizar

Una vez que haya completado el diseño, guarde la página de resultados de la búsqueda y haga clic en el botón avances Ver efecto.

• Introduzca una palabra clave en el cuadro de búsqueda y pulse el botón de búsqueda.
• Compruebe que los resultados en tiempo real y el contenido completo de los mensajes archivados se muestran correctamente.

¿Cómo puedo solucionar un problema con mi página de resultados de búsqueda?

Si observa que la página no se muestra correctamente tras pulsar el botón de búsqueda, puede seguir los pasos que se indican a continuación para solucionarlo:

1. Creación de plantillas de páginas de archivo
   Diseñe una plantilla de página de archivo especializada en el Constructor de temas de Elementor y asóciela a la página de resultados de búsqueda.
2. Comprobar la configuración del widget
   Asegúrese de que todos los widgets están configurados correctamente, especialmente la configuración de los widgets Plantilla de resultados en directo y Mensajes de archivo.