Diseño Web \ 9 Abril 2013

Tutorial Wix: Diseña una Hermosa Galería con Imágenes Divididas

Hoy queremos mostrarles un pequeño truco con el que la mayoría de los usuarios de Wix no están familiarizados – la división de una imagen en varias imágenes y utilizarlas como un menú. Así es como se ve.

Esto es básicamente una alternativa innovadora a un menú de navegación. Es una gran manera de darle vida a una página de Galería o Servicios, o incluso tu página de Inicio. Lo que vamos a hacer es mostrarte cómo tomar una imagen, dividirla en cuatro partes iguales y luego vincularlas a las diferentes páginas de tu sitio web. Por supuesto, puedes hacer lo mismo con más de cuatro imágenes. Sólo asegúrate de guardar los ajustes de la galería como corresponda.

Para dividir la imagen de manera uniforme, se utiliza una herramienta online llamada Image Splitter. Todo lo que tienes que hacer es subir la imagen que desea dividir, introducir el número de fotos que desea recibir y Image Splitter las descargará a tu computadora como un archivo zip.

Ok, ¡manos a la obra!

  • Ve a Image Splitter y divide tu imagen en cuatro
  • En el constructor Wix de sitios web, abre la plantilla con la que deseas trabajar
  • Prepara las páginas que te gustaría conectar con las imágenes divididas. En este punto, es suficiente crear estas páginas y utilizar contenido temporal. Lo importante es tener un vínculo listo

  • Prepara la página en la que deseas añadir las imágenes divididas. Asegúrate de que haya suficiente espacio
  • En el menú de la izquierda, haz click en Add Page > luego “Gallery” > elige “Grid”

  • En la configuración de la galería, establece el número de filas y columnas en dos a cada uno
  • Aún en configuración, ve a “When clicking on image” y elige “Go to specified link”

  • Haz clic en “Organize Images” para cargar las imágenes parciales que hayas preparado

  •  Juega con el orden de la imagen hasta que se completes el rompecabezas
  • Ahora haz clic en cada imagen para editar la configuración. Añade títulos y descripciones

  • Haz clic en el campo del enlace y elige la opción “Page”. Vincula cada foto con la página web correspondiente
  •   Después de cargar y enlazar todas las imágenes abiertas, puedes personalizar el diseño de la galería. Haz click en la Gallery > a continuación, “Change Style” y selecciona el diseño que desees

¡Y eso es todo! Tendrás un diseño único de la galería de tu página 🙂