¿Deseas un cuadro de búsqueda (barra de búsqueda) en tu tienda online / página web de WEBNODE?

¿Estás buscando un cuadro de búsqueda simple y elegante para tu página o tienda online en Webnode?

VIDEO-TUTORIAL

Videotutorial está sólo en idioma eslovaco.

En el tutorial “¿Cómo añadir un cuadro de búsqueda personalizado a la web? – Google Custom Search te mostré a colocar un cuadro de búsqueda simple de Google.

En este tutorial te muestro cómo añadir un cuadro de búsqueda externo con SearchIQ, que cargará automáticamente todas las páginas de tu página / e-shop

y después obtendrás el código HTML del cuadro de búsqueda, que simplemente puedes insertar en tu página o tienda online.

Si no tienes más de 2000 páginas en tu página o tienda online (por ejemplo, páginas de productos u otras páginas del proyecto web), entonces no necesitass que pagar nada por esta aplicación, SearchIQ.

ES GRATIS.

En la variante FREE, el soporte está disponible a través del foro.

SearchIQ también ofrece estadísticas de términos de búsqueda gratuitas, que puedes verificar directamente online en tu interfaz de usuario.

 

SearchIQ es adecuado como motor de búsqueda de productos en una tienda online o un motor de búsqueda para una página o blog clásico.

Estoy usando el motor de búsqueda SearchIQ en mi página de Wpromotions.eu. Si deseas probarlo, utilízalo en esta página.

Primera parte: registro y obtención de códigos

  1. El primer paso es registrarse en el servicio externo SearchIQ. Puedes registrarte en la página oficial: https://www.searchiq.co

    Comienza haciendo clic en el botón “Get Started”.

Vyhľadávač Webnode zdarma

2. Rellene tus datos y haz clic en “Get Started“.

3. Verifica tu dirección de correo electrónico haciendo clic en el enlace que te enviaron.

Si el correo electrónico no te llega, échale un vistazo a la bandeja de SPAM o Publicidad.

Después de verificar tu correo electrónico, inicia sesión.

 

4. Después de iniciar sesión en el servicio, selecciona la opción “No, it’s something else“.

5. Completa la URL de su sitio y haz clic en “Add Site

6.  Cuando hayas terminado, la aplicación te redirige automáticamente a las secciones “Interface” e ” Installation”, donde encontrarás 3 códigos que deben pegarse en tu página o tienda online para que el motor de búsqueda SearchIQ funcione correctamente.

Segunda parte – incrustar códigos en tu página o tienda online

Pega el primer código proporcionado por la aplicación en la sección Código HTML para etiqueta Head en todas las páginas de tu página.

Insertarás el primer código, dependiendo del Paquete Premium que tenga tu proyecto en WEBNODE.

1. Tengo el Paquete Premium ESTÁNDAR o PROFESIONAL

Si has comprado el Paquete Premium Estándar, Profesional o Business de Webnode, puedes pegar el 1er código en el encabezado (<head>) en todas las páginas de la página con un solo clic.

En la parte superior del editor de Webnode, haz clic en “Configuración” – “Configuración de la web” – “Etiquetas Head y Footer de la web” – “Código HTML para etiqueta Head de la web“.

 

Genial, insertaste con éxito el primer código de SearchIQ en TODAS las páginas.

2. Tengo una página en versión gratuita o he comprado el Paquete Premium Limited o Mini.

Si tienes una página o tienda online creada en la versión gratuita o has comprado el Paquete Premium Limited o Mini, debes insertar el primer código en el encabezado de cada página por separado.

1. Pega el código en el encabezado de cada página: En la barra superior del editor, haz clic en “Páginas” – “Selecciona una página” – “Configuración SEO de la página” – ” Código HTML para etiqueta Head” y pega el primer código de SearchIQ.

Genial: ya has pegado el primer código de SearchIQ.

El segundo código lo añadirás donde deseas que aparezca el cuadro de búsqueda.

CONSEJO: En el segundo código, puedes editar el texto que aparecerá en el motor de búsqueda.

Cambia el texto predefinido ” Type here to search…” en el código como por ejemplo “Buscar”, etc.

Copia el segundo código de SearchIQ y pégalo en el cuerpo de la página usando el botón “+” y “HTML”.

¡Publícalo!

Ahora deberías ver un pequeño cuadro de búsqueda en la versión publicada de tu página.

Pega el tercer código de SearchIQ en una página separada, por ejemplo, resultados de búsqueda.

Crea una nueva página en la sección “Páginas”, que puede nombrar, por ejemplo, “Resultados de búsqueda”.

Esta página será para los resultados de búsqueda del usuario, por lo que cuando alguien use el cuadro de búsqueda y presione Enter, automáticamente será redirigido a esta página de “resultados de búsqueda”.

Abre la página que creaste y pega el tercer código usando el botón “+” y “HTML“.
Pega el código donde deseas que aparezcan los resultados de la búsqueda.

¡Publícalo!

Busca la URL de los “resultados de búsqueda” de tu página que has creado.

En el editor de Webnode, haz clic en “Páginas” – “Elige la página de resultados” – “Configuración SEO de la página” y copia la URL de tu página de resultados de búsqueda.

Ve a la aplicación SearchIQ y en la sección “Interface” – ” Result Page” en el campo “Result Page URL” agrega la URL de tu página de resultados.

Genial: tienes el motor de búsqueda SearchIQ configurado correctamente en el aspecto pequeño básico.

El último paso ahora es personalizar el aspecto y ampliar el cuadro de búsqueda de SearchIQ con un poco de magia de CSS.

Tercera parte – personalizar el aspecto

SearchIQ te permite personalizar el aspecto del cuadro de búsqueda agregando tu propio código CSS.

Para que el cuadro de búsqueda se vea exactamente como se ve en mi página DEMO, debes añadir tu propio código CSS a SearchIQ.

Suscríbete a Wiliam Promotions News y obtén un código CSS listo para usar que personalizará el aspecto de tu motor de búsqueda SearchIQ.

¿Y dónde poner mi código CSS?

En la aplicación SearchIQ, ve a la página “Interface” – “General” y pega mi código en el campo “CSS personalizado”.

Guárdalo.

HECHO – Fantástico, has completado con éxito el último paso y tu cuadro de búsqueda tiene un nuevo look.

Verás el cambio en la apariencia del motor de búsqueda inmediatamente en la versión publicada de tu página.

Espero que todo haya ido bien y sin ningún problema.

Si tienes problemas con esto, no dudes en crear un nuevo ticket en mi Centro de Soporte Gratuito de Webnode.

Por favor, escríbeme en los comentarios tu opinión.

Más tutoriales increíbles

¿Cómo añadir una encuesta en Webnode?

¿Cómo añadir una encuesta en Webnode?

¿Deseas añadir una encuesta en tu web de Webnode?El cuestionario online gratuito (encuesta web / sondeo) es una de las formas más comunes de obtener retroalimentación de los visitantes de tu web. Sin retroalimentación, es difícil decir si lo estás haciendo...

Cómo añadir el efecto confeti que cae en tu WEB / TIENDA ONLINE

Cómo añadir el efecto confeti que cae en tu WEB / TIENDA ONLINE

¿Cómo añadir animación - caída de confeti a las páginas web de Webnode?Recibí una pregunta en el soporte gratuito de Webnode si es posible añadir una animación de confeti que caiga en la página web. Sí, se puede: para todos los que buscan "lluvia de confeti", he...

¿Necesitas un sistema de reservas en línea?

¿Necesitas un sistema de reservas en línea?

¿Necesitas un sistema de reservas en línea?   Funciona perfectamente con Webnode.   Hagas lo que hagas, ¡Reservio es una gran opción para organizar tu tiempo!   ¿Y qué te ofrece el sistema de reservas online de Reservio? un calendario claro donde podrás...

¿Cómo añadir un chat online a tu página web de Webnode? ¡GRATIS!

¿Cómo añadir un chat online a tu página web de Webnode? ¡GRATIS!

¿Deseas añadir un chat online en tu página web de Webnode para una comunicación más fluida con tus clientes?   En este tutorial, te mostraré cómo obtener fácilmente el código de un chat online en tu página web. 1. El primer paso es registrarse en el sitio web...

¿Te resultó útil este tutorial? Compártelo, por favor.

Follow me