Saltar al contenido
← Volver a las guías

Inserta un recorrido virtual, un proyecto o tu portafolio en tu sitio web

6 min de lectura

El código de inserción está en todos los planes, incluido el plan Gratis. Lo pegas una vez y, a partir de ahí, los visitantes ven siempre la versión actual del recorrido virtual. Esta guía te muestra dónde está el código, cuál de sus dos versiones elegir y dónde pegarlo en los creadores de sitios web más habituales.

Obtén el código

  1. Abre el recorrido en el estudio y haz clic en la pestaña Compartir.
  2. En Insertar en tu sitio web, la primera vez, marca la declaración de derechos y haz clic en Obtener el código de inserción. Es la misma declaración que al publicar, porque un recorrido insertado es, en la práctica, público aunque sea solo con enlace.
  3. Elige las opciones:
    • Tema: Según el visitante (automático), Claro u Oscuro. Elige el que combine con la página donde lo pegas.
    • Mostrar créditos: muestra a las personas que incluiste en los créditos del panel de información del recorrido.
    • Navegación con dos dedos en teléfonos: en un teléfono, un dedo desplaza tu página y dos dedos mueven el recorrido. Actívala cuando el recorrido esté en medio de una página larga.
    • Color de énfasis (a partir de Pro): tu color destacado para los botones.
  4. Elige la versión del código y haz clic en Copiar código.

¿Recomendado o Altura fija?

Recomendado es un iframe más un pequeño script de prewalk.co. El script ajusta el tamaño de la inserción a su contenido y, cuando un visitante hace clic en un recorrido, lo abre a pantalla completa en tu página, así que nunca sale de tu sitio. Úsalo siempre que puedas pegar HTML que incluya una etiqueta <script>.

Altura fija es solo el iframe, sin script. Úsala en creadores que eliminan los scripts o cuando las propias reglas de la página no los permiten. Tú defines la Altura (px). La pantalla completa usa la del propio navegador; en Safari para iPhone, que no la permite en contenido insertado, el recorrido se abre en una pestaña nueva.

Prueba primero Recomendado. Si la inserción nunca cambia de tamaño ni se abre a pantalla completa, el creador bloqueó el script: cambia a Altura fija.

Plataforma por plataforma

WordPress (editor de bloques). Edita la página, haz clic en + y añade un bloque HTML personalizado. Pega el código. Previsualiza el bloque y luego actualiza la página. En el editor clásico, cambia a la pestaña Texto o Código antes de pegar.

Wix. En el editor, haz clic en Agregar elementos, luego en Código incrustado y elige Incrustar HTML. Pega el código en el cuadro de HTML. Wix ejecuta las inserciones en su propio marco, así que, si la versión recomendada no cambia de tamaño, usa Altura fija y ajusta la altura del elemento para que coincida.

Squarespace. Edita la página, añade un bloque y elige Código. Selecciona HTML como tipo y pega el código. Squarespace permite scripts en los sitios de pago, así que Recomendado funciona; usa Altura fija en un sitio de prueba si el código se muestra como texto.

Webflow. Añade un elemento Embed (en Components) y pega el código. Webflow lo muestra en el sitio publicado, no en el Designer.

Google Sites y otros creadores que bloquean los scripts. Elige Altura fija. Añade un elemento «Insertar código» y pega el iframe.

HTML puro. Pega el código en el cuerpo de la página, donde quieras que aparezca el recorrido.

Inserta un proyecto o todo tu portafolio

  • Un proyecto: abre el proyecto en el estudio; su panel Compartir tiene las mismas opciones de Insertar en tu sitio web. La inserción muestra la portada, los recorridos, la galería y los planos sin el menú de Prewalk.
  • Tu portafolio: en tu página de perfil, haz clic en Compartir y luego en Insertar tu portafolio. Elige Diseño (Cuadrícula o Carrusel), Elementos (de 6 a 48), Mostrar (recorridos y proyectos, solo recorridos, solo proyectos), un filtro de Categoría, Etiqueta o Proyecto, el Tema y si quieres mostrar el Encabezado del perfil. Todo lo que publiques más adelante aparece en la inserción automáticamente.

La línea «Con la tecnología de Prewalk»

En el plan Gratis, el código incluye un pequeño enlace «Con la tecnología de Prewalk» debajo de la inserción, y el reproductor muestra una insignia de Prewalk. A partir de Pro, la insignia desaparece y la inserción lleva tu logo y tu color de énfasis de Configuración → Imagen de marca.

Controla dónde se abren las inserciones

En Configuración → Imagen de marca:

  • Permitir la inserción está activado de forma predeterminada. Si lo desactivas, todas las inserciones de tu trabajo muestran una tarjeta sencilla de «No disponible»; los enlaces a los recorridos siguen funcionando.
  • Sitios permitidos (a partir de Pro): indica los sitios web donde se pueden abrir tus inserciones, uno por línea, hasta 20. Una lista vacía significa que se abren en cualquier sitio. firma.com y www.firma.com son direcciones distintas, y *.firma.com cubre los subdominios.

Visualizaciones y la casilla de Primeros pasos

Cargar una inserción no cuenta como visualización. Sí cuenta el primer arrastre, toque o clic en un botón dentro de ella. En la lista Primeros pasos del estudio, «Inserta un recorrido en tu sitio web» se marca cuando el recorrido se ha visto dentro de una inserción en otro sitio web. El navegador del visitante tiene que enviar la dirección de la página (la URL de referencia) con la visualización, y las visualizaciones en el propio prewalk.co no cuentan.

Errores habituales

  • Pegarlo en un bloque de texto normal. El código aparece como texto. Usa el bloque de HTML, de código o de inserción.
  • Olvidar los hotspots de vuelta antes de insertarlo. Los visitantes se quedan atrapados en tu sitio, no en Prewalk.
  • Dejar el Tema en Oscuro para una página blanca, o al revés.
  • Insertar un recorrido solo con enlace y esperar que siga siendo privado. Cualquiera que visite esa página puede verlo.
  • Cambiar tu nombre de usuario. Las direcciones de inserción del portafolio y de los proyectos públicos lo contienen: la dirección antigua sigue funcionando durante 30 días y después deja de hacerlo. Las inserciones de recorridos y de proyectos privados usan un ID y siguen funcionando.

Siguiente

Comparte un recorrido virtual: WhatsApp, portales inmobiliarios, firma de correo y código QR

Compartir: 𝕏 LinkedIn WhatsApp