Buscar
Cada visitante es un cliente potencial que busca algo. Una barra de búsqueda débil, oculta o fea interrumpe ese viaje. El elemento de búsqueda de complementos maestros le brinda dos formas poderosas de integrar la búsqueda: una forma clásica en línea o una ventana emergente de ícono de hacer clic para abrir. Colóquelo en cualquier lugar (su encabezado, barra lateral, sección de héroe) y luego diseñe cada píxel. Diseñe el formulario, el botón, el ícono e incluso los mensajes de la ventana emergente.
Formulario de búsqueda y ventana emergente de iconos
No todos los diseños tienen espacio para una barra de búsqueda completa. Por eso te damos dos tipos distintos. Elija “Formulario” para un campo de entrada y un botón tradicionales y siempre visibles. Perfecto para barras laterales o debajo del héroe. O seleccione “Icono” para obtener una lupa elegante que ahorre espacio y que, al hacer clic, abra una elegante superposición de búsqueda emergente. Esto mantiene limpio su diseño hasta que el usuario lo necesite. Controlas el texto del botón para los formularios y el icono exacto para el activador de la ventana emergente.
- Tipo de formulario: un formulario de búsqueda estándar, siempre visible, con un botón de envío personalizable (como texto o ícono).
- Tipo de icono/ventana emergente: un elegante botón de icono que activa un formulario de búsqueda de ventana emergente completo, ahorrando espacio crucial en el encabezado.
- Biblioteca de iconos: elija cualquier icono de lupa de la amplia biblioteca de iconos que coincida con el estilo de su sitio.
Formulario completo y estilo de campo de entrada
Haga que el formulario de búsqueda sea una parte natural de su diseño. Diseñe todo el contenedor del formulario: establezca su fondo, ancho, margen, relleno y dale radio de borde y sombra de caja. Luego, diseñe el campo de entrada en sí. Controle su tipografía, color, fondo, borde y relleno interno. Incluso puede diseñar el estado de enfoque (cuando un usuario hace clic) con un color de borde diferente. Esto garantiza que su barra de búsqueda se vea y se sienta premium, no como un navegador predeterminado.
- Diseño de contenedor: peina la caja del formulario con fondo, relleno, bordes y sombras.
- Control de campo de entrada: personalice el color, la tipografía, el ancho y el radio del borde del cuadro de texto.
- Estados avanzados: defina un color de borde único para el estado enfocado, resaltando el campo activo.
Diseño de iconos y mensajería emergente
Para el tipo Icono/Popup, el icono en sí es un botón. Estilo a la perfección. Ajuste su tamaño, color y el relleno y margen a su alrededor. Luego, diseñe la ventana emergente que aparece. Personalice el marcador de posición del texto de entrada (como “Comience a escribir...”) y, lo que es más importante, agregue una descripción útil (por ejemplo, “Presione Enter para buscar o ESC para cerrar”). Este texto guía a los usuarios, mejorando la usabilidad y creando una experiencia interactiva profesional y pulida.
- Estilo de iconos: cambie el color y el tamaño de los iconos y ajuste el espacio circundante con el margen y el relleno de iconos.
- Texto emergente inteligente: establezca un texto de marcador de posición fácil de usar dentro del campo de búsqueda de la ventana emergente.
- Instrucciones emergentes: agregue una línea de descripción debajo de la entrada para explicar cómo usar la ventana emergente (buscar/cerrar).
Preguntas frecuentes para buscar
¿Esta búsqueda funciona con la página de resultados de búsqueda predeterminada de mi tema?
Sí, debería. Este elemento proporciona el formulario de búsqueda inicial. Cuando un usuario envía una consulta, utilizará su funcionalidad de búsqueda predeterminada de WordPress (o WooCommerce) y mostrará resultados en la página de plantilla de búsqueda.php de su tema. No reemplaza la lógica de búsqueda, solo hace que el formulario de entrada se vea increíble.
¿Puedo realizar una búsqueda de formulario en la barra lateral y una búsqueda de iconos en el encabezado?
Absolutamente. Puedes utilizar múltiples elementos de búsqueda en la misma página o sitio. Cada uno está configurado y diseñado de forma independiente. Para que pueda tener un formulario grande en la barra lateral de su blog y un ícono mínimo en su encabezado, cada uno con su propia configuración.
¿la ventana emergente de búsqueda es compatible con dispositivos móviles?
Sí. La ventana emergente está diseñada para ser responsiva. Por lo general, se abrirá como una superposición centrada que cubre la mayor parte de la pantalla móvil, con el campo de entrada y la descripción claramente legibles. El activador de iconos también se escala adecuadamente para dispositivos táctiles.
¿puedo cambiar el ícono de la lupa por otra cosa, como una "Q" para citar?
Puede elegir cualquier icono de la biblioteca de iconos integrada (como FontAwesome). Si bien una lupa es estándar, técnicamente podría usar un ícono diferente. Sin embargo, para una comprensión universal del usuario, recomendamos encarecidamente seguir con un símbolo de búsqueda reconocido (lupa).
Widgets y extensiones de Elementor de tendencia
Cree sitios web sofisticados en menos tiempo.
Vidriomorfismo
Extras de contenedores
Patrones
Duplicador de publicaciones/páginas
