Coloca tu Visita Virtual de Google en tu Facebook “paso a paso”

Visita virtual integrada en Facebook con titulares

Coloca tu Visita Virtual de Google en tu Facebook “paso a paso”

Tu Visita Virtual de Google en tu fanpage de Facebook “paso a paso”.

Incluir la Visita Virtual de Google, de tu ficha GMB, en tu página de Facebook “fanpage”, es muy fácil, para ello debemos instalar en Facebook la aplicación Woobox Custom Tab. Con esta aplicación crearemos una pestaña que será visible en dispositivos de escritorio, para dispositivos Android podemos hacer una publicación con la presentación de nuestra Visita Virtual Google y anclarla al principio de la fanpage para que esté siempre visible.

Ahora sigue estos pasos para insertar en tu fanpage la Visita Virtual de Google con Woobox Custom Tab.

 

Paso 1

Iniciamos sesión en Facebook y vamos a nuestra fanpage.

Facebook fanpage para instalar Woobox

 

Paso 2

En la caja de búsquedas ponemos “Woobox Custom Tab”.

Selección de Woboox aplicación en Facebook

 

Paso 3

Woobox Custom Tab, clicar en “Usa esta aplicación”.

Usar esta aplicación Woobox en mi Facebook

 

Paso 4

Click en “Install Page Tab”.

Instalar Woboox en mi fanpage de Facebook

 

Paso 5

Click en “Páginas de Facebook” y seleccionamos el nombre de la página donde se va a instalar, después clicamos en “Añadir pestaña de página”.

Añadir la pestaña a mi Facebook

 

Paso 6

Aceptar que Woobox reciba nuestro perfil público y dirección de e-mail (tenemos que estar de acuerdo en ello, si no Woobox no se instalará), clicamos en “Continuar”.

Instalar Woobox en Facebook

Paso 7

Deberemos permitir que Woobox tenga acceso a nuestra fanpage y crear la pestaña necesaria para alojar el tour virtual. (“Selecciona lo que permites” para más información).

Aceptar instalar Woobox en tu Facebook

Paso 8

En el menú de la izquierda de la fanpage, vemos que Woobox ha creado la pestaña “Welcome” clicamos en ella.

Aparece la pestaña "Welcome" una vez instalado Woobox

Paso 9

Aquí es dónde se visualizará el tour. Ahora vamos a colocar el código que hará visible éste, clicamos en “Settings”.

Settings para añadir el código HTML de nuestra visita virtual

Paso 10

Seleccionamos “Edit”, en el recuadro debajo de “PAGE SOURCE” es donde vamos a pegar el código HTML que hará visible nuestro tour en Facebook.

En la ventana de "PAGE SOURCE" pegamos el código HTML para mostrar la visita y más

Paso 11

Abrimos una pestaña nueva del navegador y ponemos en el buscador de Google el nombre de nuestra empresa, vamos a la ficha de nuestra empresa en Google y clicamos en el mapa.

Clicamos en el mapa para acceder a la ficha de Google de la empresa

Paso 12

Y aquí clicamos en la imagen de nuestro tour virtual.

Seleccionar una de las imágenes de la visita virtual de la ficha Google de la empresa

Paso 13

Cerramos la vista lateral de las fotos haciendo clic en el triángulo superior, ahora navegamos por el tour para seleccionar la vista que deseemos para el inicio de éste.

Seleccionar la vista del tour que queremos que aparezca al inicio

Paso 14

Ya tenemos la vista que queremos para el inicio de nuestro tour, ahora haciendo clic en los tres puntos que aparecen al lado derecho del nombre de nuestra empresa seleccionamos “Compartir o insertar la imagen”.

Seleccionar compartir o insertar imagen

Paso 15

Clicamos en la pestaña “Insertar imagen”, desplegamos el menú haciendo clic en el triángulo al lado de “Mediano” y seleccionamos “Grande”.

Seleccionamos imagen grande

Paso 16

Copiamos todo el código que aparece en la ventana, haciento clic en ella con el botón izquierdo y cuando veamos que el texto aparece con un fondo azul clicamos con el botón derecho del ratón y seleccionamos la opción “copiar”, ya podemos cerrar esta pestaña.

Copiar el código

Paso 17

Volvemos a la pestaña, donde tenemos abierto Woobox, para pegar el código, en la ventana de “PAGE SOURCE”, ya pegado el código clicamos el botón “Save Settings” abajo de la página y cerramos la pestaña.

Pegamos el código en la ventana de page source

Paso 18

Ahora vamos a la pestaña de nuestra página de Facebook y le damos recargar la página, veremos que el tour aparece en la ventana de Woobox.

El tour se muestra en la ventana de Woobox

Paso 19

Si queremos que el tour aparezca más grande o más pequeño volveremos a “Settings” para cambiar el tamaño. Por ejemplo, vamos a poner 820 px de ancho por 600 px de alto, en la parte del código que he circulado en rojo. Después de cambiarlo volvemos a clicar en el botón “Save Settings”, cerramos la pestaña y desde nuestra página de Facebook recargamos de nuevo la página.

Cambiar de tamaño el tour

Paso 20

Perfecto, ahora vamos a cambiar el nombre del botón “Welcome” a otro más intuitivo de lo que se va a ver, por ejemplo “VISITA VIRTUAL”, para ello vamos a la opción del menú “Configuración”.

Tour con el tamaño cambiado

Paso 21

En el menú de la izquierda seleccionamos “Editar página”.

Editar esta pestaña para cambiar de lugar

Paso 22

Aquí tenemos todos las pestañas que aparecen en nuestra página de Facebook, y nuestra pestaña “Welcome” que vamos a cambiar de nombre. Clicamos en “Configuración”.

Configuración para mover la pestaña

Paso 23

Después en “Editar configuración”.

Editar configuración

Paso 24

En “Custom Tab Name” ponemos el nombre que queremos dar a nuestra pestaña del tour virtual, por ejemplo “VISITA VIRTUAL” y clicamos en el botón “Guardar” y después en “Aceptar”.

Cambiar de nombre a la pestaña y guardar

Paso 25

Clicamos en el botón “Guardar” y recargamos de nuevo la página, veremos que aparecerá nuestro botón “VISITA VIRTUAL”.

Guardar el nombre de la pestaña nueva

Paso 26

Nos gustaría que nuestra flamante pestaña “VISITA VIRTIAL” que hemos creado para nuestro tour, este en una posición más destacada, en una posición superior. Clicamos en el bloque de “VISITA VIRTUAL” y sin soltar arrastramos la pestaña a la posición en la que deseamos que aparezca en el menu y la soltamos ahí. Después clicamos en la opción del menú “Página”.

Mover la pestaña a la posición deseada

Paso 27

Ya tenemos nuestra Visita Virtual de Google con la pestaña personalizada “VISITA VIRTUAL” y en un lugar bien visible.

Pestaña visita virtual en posición destacada

Paso 28

Podemos añadir más código HTML en la ventana “PAGE SOURCE” de Woobox, por ejemplo para que aparezca un titular, texto explicativo, un enlace a nuestra página web, etc. Clicamos en nuestra pestaña de “VISITA VIRTUAL” después en “Settings” y “Edit”, añadimos las líneas nuevas de código y guardardamos los cambios con “Save settings”, en este caso hemos puesto unos titulares y un pie con un enlace a la web.

adicionar más código HTML a la pestaña de Woobox en la visita virtual

Paso 29

Y finalmente este es el resultado visible de nuestro tour Google en la pestaña VISITA VIRTUAL de la fanpage.

Apariencia final de la visita virtual de google en la pestaña de visita virtual en la fanpage de facebook