Boundless

Boundless es un tema centrado en fotografías con una interfaz de usuario mínima que presenta fotografías de borde a borde. Boundless está creado principalmente para dispositivos móviles y es adecuado para tiendas con inventarios medianos a grandes.

Ejemplo de tienda online que usa Boundless

Editor de temas

Utiliza el editor de tema para personalizar tu tema. La barra de herramientas del editor de temas está dividida en Secciones y Configuración detema.

La barra de herramientas del editor de temas muestra las Secciones y la Configuración de temas

Puedes usar secciones para modificar el contenido y el diseño de las diferentes páginas en tu tienda. Puedes usar la configuración del tema para personalizar las fuentes y colores de tu tienda y hacer cambios en tus enlaces a redes sociales y configuraciones de pago.

Las secciones son bloques de contenido personalizables que determinan el diseño de las diferentes páginas en tu tienda online.

  • Las secciones de inicio incluyen funciones, como una presentación de diapositivas o el registro a un boletín, que puedes agregar, reorganizar o eliminar. Puedes tener hasta 25 secciones en tu página de inicio.

  • Cada tipo de página tiene sus propias secciones. Por ejemplo, la sección de página de producto determina el diseño de cada página de producto de tu tienda online.

  • Las secciones de página están siempre en lugares específicos en tu tienda online. Puedes personalizarlas, pero no puede reorganizarlas o eliminarlas.

  • Cada tema incluye secciones fijas, tales como el encabezado y pie de página que se muestran en cada página de tu tienda online.

Puedes aprender sobre la selección única de secciones de y cómo personalizarlas para que se adapten a tu negocio.

Boundless incluye las siguientes secciones estáticas:

  • Encabezado
  • Menú de la barra lateral
  • Barra de anuncios
  • Diapositivas
  • Barra de acciones
  • Pie de página
  • Producto
  • colección
  • Página de lista de colecciones
  • Artículo

Secciones dinámicas

Puedes agregar, reorganizar y eliminar secciones dinámicas para personalizar el diseño de tu página de inicio. Cada tema tiene un conjunto exclusivo de secciones dinámicas para elegir.

Boundless incluye las siguientes secciones dinámicas:

  • Entradas del blog
  • Lista de colecciones
  • colección destacada
  • Imagen con texto
  • Producto destacado
  • Boletín
  • Mapa
  • Texto enriquecido
  • Video
  • HTML personalizado

Encabezado

El encabezado de tu tema es la sección que aparece en la parte superior de cada página en tu tienda.

La sección del encabezado incluye las siguientes configuraciones:

  • Logo: añade una imagen del logo a tu encabezado.
  • Logo de la página de inicio: agrega un logo que se mostrará solo en la página de inicio. El logo de la página de inicio se muestra en la presentación de diapositivas, así que selecciona una versión de tu logo que sea fácil de ver en la parte superior de una imagen.
  • Ancho del logo personalizado (en píxeles): establece el tamaño de tu logo.

Personalizar tu encabezado

  1. Ubica Boundless y haz clic en Personalizar.

  2. Haz clic en Encabezado.

  3. Usa la configuración para personalizar tu encabezado.

  4. Haz clic en Guardar.

Menú de la barra lateral

El menú de barra lateral es como una tabla de contenidos de tu tienda. No importa dónde esté el cliente, el botón de menú mostrará el menú principal y el menú de pie de página de tu tienda:

El menú de barra lateral muestra dos menús: el Menú primario se muestra en la parte superior en letra más grande, y el Menú adicional se muestra debajo del Menú primario en letra más pequeña.

Para personalizar el menú de barra lateral:

  1. Haz clic en Secciones.

  2. Haz clic en Menú de barra lateral.

  3. En la lista del Menú principal, selecciona el menú que deseas mostrar como menú principal. Éste será el menú principal de tu tienda.

  4. En la lista del Menú adicional, selecciona el menú que deseas mostrar debajo del menú principal. Éste será el menú inferior de tu tienda.

  5. Haz clic en Guardar.

Diapositivas

Puedes crear una presentación de diapositivas para la página de inicio con rotación de hasta cinco imágenes.

Es mejor usar imágenes de alta resolución para tus diapositivas. Utiliza imágenes con un formato de 3840 x 2160 px o mayor, pero que no excedan los límites de carga de Shopify.

Dado que el tamaño y la forma de la presentación de las diapositivas dependen del tamaño y la forma del dispositivo del cliente, las imágenes de presentación de las diapositivas se recortarán en algunas pantallas. Intenta usar imágenes cuyo punto focal esté en el centro para que la parte importante de cada imagen esté siempre visible.

Lee más acerca de las prácticas recomendadas para las imágenes de diapositivas en Subir imágenes.

La sección de presentación de diapositivas incluye las siguientes configuraciones:

  • Altura de la diapositiva: establece la altura de la presentación de diapositivas. Selecciona Adaptar a la altura de la primera imagen de la diapositiva para configurar la altura de la presentación de diapositivas con respecto a la altura de la primera imagen.
  • Rotación automática de diapositivas: configura la presentación de las diapositivas para que se reproduzca automáticamente.
  • Transición entre diapositivas: selecciona la frecuencia con la que se cambiarán las diapositivas.
  • Texto e íconos: selecciona un color para el texto e íconos que aparecen sobre la presentación de diapositivas.
  • Superposición de imagen: agrega una capa de color sobre la diapositiva de la imagen. Una superposición puede hacer que la presentación de diapositivas sea más fácil de leer.
  • Opacidad: establece la opacidad de la superposición.
  • Imagen: agrega una diapositiva de imagen a tu presentación de diapositivas.
  • Posición de la imagen: elige el área más importante de la imagen que se debe enfocar en la presentación de diapositivas.
  • Encabezado: agrega un encabezado a la diapositiva.
  • Texto del botón: agrega un botón con una etiqueta de texto a tu diapositiva.
  • Enlace del botón: enlaza tu botón a otra parte de tu tienda online.

Agrega una presentación de diapositivas a tu página de inicio

  1. Ubica Boundless y haz clic en Personalizar.

  2. Haz clic en Presentación.

  3. Utiliza la configuración para personalizar la presentación de tus diapositivas.

  4. Haz clic en Guardar.

Barra de acciones

Por defecto, la barra de acciones muestra el menú principal de tu tienda. Puedes personalizar tu barra de acciones para mostrar diferentes elementos según la página que esté mirando tu cliente. En la página de inicio, la barra de acciones se usa frecuentemente para mostrar tus colecciones de productos. Dentro de una colección, la barra de acciones puede mostrar otras subcategorías u otras colecciones relacionadas.

Por ejemplo, si tu tienda vende prendas de vestir, tu barra de acción podría mostrar Hombres, Mujeres y Accesorios en tu página de inicio. Si un cliente hace clic en Mujeres, la barra de acción podría mostrar Camisas, Pantalones y Calzado en la página de colección.

Para que tu barra de acción funcione de esta manera, usa tu menú principal para los enlaces hacia tus colecciones. Coloca enlaces hacia otras partes de tu tienda (tus páginas de Contacto o Sobre nosotros) en el menú inferior de tu página.

Para personalizar tu barra de acciones:

  1. Haz clic en la pestaña Secciones.

  2. Haz clic en Barra de acción.

  3. En la lista Menú, selecciona el menú que deseas mostrar en la barra de acciones.

  4. Haz clic en Guardar.

Pie de página

Con Boundless, puedes mostrar un menú en el contenido del pie de página.

Para personalizar el pie de página de tu tienda:

  1. Haz clic en la pestaña Secciones.

  2. Haz clic en Pie de página.

  3. En la lista Menú, selecciona el menú que deseas mostrar en el pie de página.

  4. Haz clic en Guardar.

Producto

En la sección Página de producto, puedes agregar o eliminar los elementos siguientes:

  • La marca del producto o el proveedor
  • Selector de cantidad
  • Íconos de redes sociales
  • Botón de pago dinámico
  • Recomendaciones de productos

También puedes omitir la primera imagen del producto, establecer el estilo de tus imágenes y elegir el ancho del formulario del producto.

Para editar la configuración de las páginas de productos:

  1. En el menú desplegable de la barra superior, selecciona Páginas de productos.

  2. Haz clic en Secciones.

  3. Haz clic en Producto.

  4. Para omitir la primera imagen del producto, marca Omitir la primera imagen del producto.

    Esto significa que la primera imagen del producto se muestra solo en páginas de colección, y no en páginas de productos. Con esta opción, puedes diseñar la primera imagen del producto para que se vea mejor en páginas de colecciones y adaptar las demás imágenes de tus productos para que se vean mejor en el espacio más grande disponible en la página del producto:

    Ejemplo donde se muestra la página de colección con la primera imagen del producto y la página del producto con la segunda y tercera imagen del producto

  5. Para configurar tu estilo de imagen, desde el menú desplegable Estilo de imagen, selecciona Alto/cuadrado o Ancho.

  6. Para mostrar la marca o el proveedor del producto, marca Mostrar proveedor. Para que se muestre una marca o un proveedor, debes agregar un proveedor al producto.

  7. Para mostrar un selector de cantidad, marca Mostrar selector de cantidad.

  8. Para mostrar los íconos de redes sociales, marca Habilitar compartir productos.

  9. Para mostrar un botón de pago dinámico, marca la casilla Mostrar botón de pago dinámico.

  10. Para establecer el ancho del formulario del producto, en el menú desplegable Ancho de formulario del producto, selecciona Pequeño o Grande.

  11. Haz clic en Guardar.

Agregar o eliminar recomendaciones de productos

Puedes mostrar los productos recomendados en las páginas de productos para que los clientes puedan descubrir otros productos que podrían interesarles.

  1. En el menú desplegable de la barra superior, selecciona Páginas de productos.

  2. Haz clic en Recomendaciones de productos.

  3. Usa la casilla Mostrar recomendaciones dinámicas para mostrar u ocultar recomendaciones de productos en tus páginas de productos.

  4. Opcional: para cambiar el título que aparece encima de los productos recomendados, introduce uno nuevo en el campo Encabezado.

  5. Opcional: para mostrar u ocultar los proveedores en las descripciones de productos, utiliza la casilla Mostrar proveedor.

  6. Haz clic en Guardar.

colección

Boundless incluye varias opciones de clasificación y filtro, apariencia y paginación para tus páginas de colección.

  1. En la vista previa del tema, abre una página de producto.

  2. Haz clic en la pestaña Secciones.

  3. Haz clic en Colección.

  4. En el área Apariencia, configura las siguientes opciones:

- En la lista Estilo de imagen, selecciona una orientación para la imagen del producto, ya sea Alto/Cuadrado o Ancho.

  • En la lista Tamaño de imagen, selecciona un tamaño para las imágenes del producto.

  • Si deseas aumentar el espacio entre las imágenes, marca la casilla Agregar espacio entre las imágenes.

  • Si deseas mostrar el proveedor o la marca debajo de la foto de cada producto, marca la casilla Mostrar proveedores de productos.

  1. En el área Clasificación y filtro, configura las siguientes opciones:
  • Si deseas mostrar una lista de opciones de clasificación, entonces marca la casilla Mostrar opciones de clasificación.

  • Si deseas mostrar una lista que permita a los clientes hacer un filtro por etiqueta, marca la casilla Mostrar filtro de etiqueta.

  1. En el área Paginación, en la lista Tipo de paginación, selecciona si deseas mostrar páginas numeradas o un botón "Ver más".

  2. Haz clic en Guardar.

colección destacada

En la sección Colección destacada del editor de temas, la opción Estilo de imagen te permite cambiar la forma en que las páginas de colecciones y productos muestran las imágenes:

  • Alto/cuadrado es la mejor opción si las imágenes de tu producto son cuadradas o están en orientación vertical.
  • Ancho funciona mejor si tus imágenes son rectangulares o su orientación es horizontal.

La opción Tamaño de imagen determina qué tan grandes serán las imágenes de tus productos en la página de colecciones. Si muestras imágenes de productos pequeñas, puedes colocar más imágenes en una sola fila.

La cantidad de imágenes que se muestran por fila también depende del dispositivo del cliente (escritorio o móvil) y del tamaño de la ventana.

  1. Haz clic en la pestaña Secciones.

  2. Haz clic en la sección Colecciones destacadas.

  3. Selecciona una colección de la lista Colección. Se mostrará un máximo de 50 productos de la colección que seleccionaste.

  4. En la lista Estilo de imagen, elige si deseas que las imágenes sean Altos/Cuadrados o Anchos.

  5. En la lista Tamaño de imagen, elige un tamaño de imagen.

  6. Para aumentar el espacio alrededor de las imágenes del producto, marca Agregar espaciado de imagen.

  7. Para mostrar el proveedor del producto o la marca, selecciona Mostrar proveedor del producto.

  8. Haz clic en Guardar.

Boletín

Puedes agregar la suscripción a un boletín a la página de inicio. Esto te permite recopilar direcciones para las campañas de marketing por correo electrónico. Puedes obtener más información sobre el marketing por correo electrónico en el blog de Shopify.

La sección del boletín en un sitio web. Hay un campo para que los clientes introduzcan una dirección de correo electrónico y un botón que dice

Para agregar la opción de suscripción al boletín a la página de inicio:

  1. Ubica Boundless y haz clic en Personalizar.

  2. Haz clic en Secciones.

  3. Haz clic en Agregar sección > Boletín.

  4. Introduce un título para la suscripción al boletín en el campo Título. El encabezado predeterminado es "Suscríbete a nuestro boletín".

  5. Introduce un subtítulo para la suscripción al boletín en el campo Subtítulo.

  6. Haz clic en Guardar.

Texto enriquecido

Usa la sección Texto enriquecido para proponer cualquier contenido escrito que desees que aparezca en tu página de inicio o para incrustar cualquier página creada en tu panel de control de Shopify. Por ejemplo, puedes presentar los próximos eventos incrustando tu página de blog o muestra una página con alguno de los siguientes objetos:

  1. Haz clic en la pestaña Secciones.

  2. Haz clic en Texto enriquecido.

  3. Introduce y da formato a tu texto.

  4. Si deseas mostrar una página de tu tienda, haz clic en Agregar contenido y luego haz clic en Página. Selecciona una página para mostrarla como tu página de inicio a partir del menú desplegable.

  5. Haz clic en Guardar.

Video

Puedes agregar un video alojado en YouTube o Vimeo a la página de inicio. Los videos pueden atraer clientes y generar interés por tu negocio.

Para agregar un video a la página de inicio:

  1. Ubica Boundless y haz clic en Personalizar.

  2. Haz clic en Secciones.

  3. Haz clic en Agregar sección > Video.

  4. Introduce un título para el video en el campo Título.

  5. Introduce un enlace para compartir el video en el campo Enlace de video.

    Un enlace para compartir un video de YouTube tiene este formato: https://youtu.be/OTJXAUZY9t0. Puedes aprender cómo copiar el enlace para compartir un video de YouTube en este artículo de ayuda de YouTube.

    Un enlace para compartir un video de Vimeo tiene este formato: https://vimeo.com/281332510. Puedes aprender cómo copiar el enlace para compartir un video de Vimeo en este artículo del Centro de ayuda de Vimeo.

  6. Haz clic en Guardar.

HTML personalizado

En la sección HTML personalizado, puedes usar código HTML para crear contenido personalizado para tu página de inicio. Por ejemplo, puedes usar HTML para dar formato a bloques de texto, crear tablas o insertar contenido desde un sitio web externo.

Para agregar HTML personalizado a tu página de inicio:

  1. Ubica Boundless y haz clic en Personalizar.

  2. Haz clic en Secciones.

  3. Haz clic en Agregar sección.

  4. En el área de Diseño avanzado, haz clic en HTML personalizado > Agregar.

  5. Haz clic en HTML personalizado e introduce el código HTML que desees agregar a tu página de inicio.

  6. Haz clic en Guardar.

Configuración del tema Puedes usar la configuración del tema para personalizar los colores y la tipografía en tu tienda online. También puedes configurar enlaces a tus cuentas de redes sociales, editar la configuración de tu carrito y agregar un favicon.

Boundless incluye las siguientes configuraciones de tema:

  • Colores
  • Tipografía
  • Carrito
  • Redes sociales
  • favicon
  • Caja

Colores

Puedes elegir los colores de las distintas partes de tu tienda online.

Personalizar tu configuración de color

  1. Haz clic en Personalizar junto a ****.

  2. Haz clic en Configuración del tema.

  3. Haz clic en Colores.

  4. Para cada tipo de contenido, haz clic en la muestra de color para usar el seleccionador de color:

    El seleccionador de color en el editor de temas

- En el área Seleccionado recientemente se muestran los colores que has seleccionado recientemente para tu tema. - En el área En uso actualmente se muestran los colores que estás usando actualmente en otras partes de tu tema.

Para dejar en color en transparente, haz clic en Ninguno.

  1. Haz clic en Guardar.

Tipografía

Puedes configurar el estilo y tamaño de la fuente para el texto de tu tienda online.

Personalizar tu configuración de tipografía

  1. Haz clic en Personalizar junto a ****.

  2. Haz clic en Configuración del tema.

  3. Haz clic en Tipografía.

  4. Para cada tipo de texto, haz clic Cambiar para usar el selector de fuente:

    El botón 'Cambiar' en el selector de fuente

  5. Explora las fuentes utilizando el campo de búsqueda o haciendo clic en Cargar más.

    Para ver todas las fuentes disponibles, consulta la biblioteca de fuentes de Shopify.

  6. Haz clic en el nombre de la fuente que deseas actualizar.

  7. Para cambiar la fuente a un estilo diferente, como negrita o cursiva, haz clic en Regular. A continuación, haz clic en el estilo que deseas usar y luego haz clic en Seleccionar:

    Una selección de grosores de fuente disponible en el selector de fuente

  8. Haz clic en Guardar.

Carrito

Brooklyn te permite personalizar la pantalla de pago, seleccionando el tipo de carrito y activando los comentarios del cliente sobre su pedido.

El tema Boundless es compatible con 2 tipos de carritos:

  • Página que redirecciona a los clientes a tu pantalla de pago cuando agregan un artículo al carrito.

  • Cajetín que abre un cajetín deslizante al lado de la pantalla donde se agregan los artículos al carrito e invita al usuario a que vaya a la pantalla de pago.

Brooklyn incluye también una opción para que tus clienteste envíen instrucciones especiales con su pedido.

Para definir las opciones de carrito en Brooklyn:

  1. Haz clic en Configuración del tema.

  2. Haz clic en la Página de carrito.

  3. Selecciona un tipo de carrito de la lista Tipo de carrito.

  4. Si deseas permitir que los clientes incluyan comentarios a los pedidos en la pantalla de pago, marca Activar comentario sobre pedidos.

  5. Haz clic en Guardar.

Redes sociales

Puedes agregar botones de redes sociales para tus productos y publicaciones de blog, y enlaces a tus redes sociales.

Para personalizar la configuración de redes sociales:

  1. Ubica Boundless y haz clic en Personalizar.

  2. Haz clic en Configuración del tema.

  3. Haz clic en Redes sociales.

  4. Para cargar una imagen para compartir en redes sociales, en el área Imagen para compartir en redes sociales, haz clic en Seleccionar imagen o Explorar imágenes gratuitas.

  5. Para agregar enlaces a tus redes sociales, en el área Cuentas, introduce los enlaces a tus cuentas en los campos correspondientes. Introduce enlaces completos, como https://instagram.com/shopify, o https://twitter.com/shopify.

    Los enlaces a tus cuentas de redes sociales aparecen en el pie de página de tu tienda online.

  6. Para agregar botones de redes sociales a tus productos y entradas de blog, en el área Opciones de compartir, marca cualquiera o todas las casillas.

    Puedes agregar los siguientes botones de compartir:

- Compartir en Facebook - Tuitear en Twitter - Publicar en Pinterest (no disponible para blogs)

  1. Haz clic en Guardar.

favicon

Puedes cargar un icono de favoritos, o "favicon", que puede ayudar con el branding de tu tienda virtual mostrando tu logotipo en las siguientes sucursales:

  • la pestaña de tu navegador web
  • el historial de tu navegador web
  • íconos en tu escritorio
  • al lado del nombre de tu tienda online cuando esté marcado como favorito.

Para cargar un favicon:

  1. Haz clic en la pestaña Configuración del tema.

  2. Haz clic en Favicon.

  3. En el área de la imagen de Favicon, haz clic en Seleccionar imagen y luego realiza una de las siguientes acciones:

- Para seleccionar una imagen que ya has subido a tu panel de control de Shopify, haz clic en la pestaña Biblioteca. - Para seleccionar una imagen desde tu computadora, haz clic en la pestaña Biblioteca, y luego haz clic en el botón del signo "más".

Sugerencia: El tamaño recomendado para Boundless es 32 x 32px.

  1. Haz clic en Guardar.

Caja

Esta sección te permite personalizar el pago de tu tienda. Haz clic aquí para obtener más información sobre la ventana de pago de tu tienda.

Configuración de submenús en la barra de acciones

Si creas un menú en la barra de acciones que enlaza hacia la página de inicio, ese menú también se mostrará en la página de inicio. Esto puede ocurrir cuando configuras menús para colecciones que no existen todavía, por lo que en su lugar creas un enlace de marcador de posición hacia la página de inicio.

Crea tus colecciones antes de crear los enlaces de colección para la barra de acciones. O bien, puedes vincular a la página Todos los productos hasta que hayas creado la colección hacia la cual deseas establecer el enlace.

¿Estas listo(a) para comenzar a vender con Shopify?

Pruébala gratis