¿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

Revisión de Webnode 2022

Revisión de Webnode 2022

¿Alguna vez has querido crear tu propia página web desde cero? ¿Quieres crear una webo una tienda online y hacerla visible en Internet? Comience ahora mismo y aprenda a crear fácilmente su primer sitio web personalizado.Crear una web con Webnode es muy simple incluso...

¿Cómo crear el logo de tu propia empresa? es gratis

¿Cómo crear el logo de tu propia empresa? es gratis

¿Quieres crear tu propio logotipo de empresa?   Puede crear su propio logotipo nuevo en pocos minutos utilizando el servicio gratuito. Lo recomiendo altamente. Es gratis.   1. Haz clic en este enlace, que te redirigirá al sitio web oficial de este increíble...

Cómo crear un sitio web de tarjeta de visita simple GRATIS

Cómo crear un sitio web de tarjeta de visita simple GRATIS

Crea tu primer sitio web de tarjetas de visita con WebnodeVideo-tutorial¿Qué es un sitio web de tarjetas de visita?   Un sitio web de tarjeta de visita es una simple página web que presenta breve y claramente los servicios o productos. Es un sitio web simple que...

¿Cómo vincular tu Instagram con un sitio web en Webnode?

¿Cómo vincular tu Instagram con un sitio web en Webnode?

Así que, ¿quieres MOSTRAR tus fotos actuales de tu Instagram en tu sitio web de Webnode?   En el tutorial ¿Cómo agregar iconos de una red social (FB e Instagram) a la parte superior del sitio web de Webnode? Te mostré una solución muy simple: agregar íconos de...

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

Follow me