Secciones para Boundless

El contenido del tema se crea usando secciones. Las secciones son bloques de contenido personalizables que determinan el diseño y la apariencia de las diferentes páginas en tu tienda online.

Las secciones estáticas son secciones que aparecen en sucursales predeterminadas en tu tienda online. Estas secciones no se pueden eliminar ni reorganizar. Las secciones estáticas pueden incluir encabezados, pies de página, secciones de navegación o secciones de contenido en páginas como páginas de productos y páginas de colección. Por ejemplo, la sección de producto determina el aspecto de cada página de producto en tu tienda online.

Las secciones dinámicas son secciones opcionales que puedes usar para personalizar el diseño de tu página de inicio. en la página de inicio de tu tienda, puedes Agregar, reorganizary eliminar secciones dinámicas para crear el diseño de la página. Puedes tener hasta 25 secciones dinámicas en tu página de inicio.

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

Secciones estáticas

Boundless incluye las siguientes secciones estáticas:

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

Secciones dinámicas

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

Menú de la barra lateral

El menú de barra lateral es como una tabla de contenidos de tu tienda. Este menú aparece en todas las páginas 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.

También puedes mostrar enlaces a tus cuentas en las redes sociales en la barra lateral. Estos enlaces dependen de la configuración de tu tema.

Personalizar el menú de barra lateral

  1. Haz clic en Menú de barra lateral.

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

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

  4. Haz clic en Guardar.

Barra de anuncios

Puedes activar la barra de anuncios para mostrar un mensaje a tus clientes. Tu mensaje es completamente personalizable y puede incluir información de contacto, un enlace, información sobre eventos u ofertas de la tienda, y el eslogan o el mensaje de promoción de marca de tu tienda. La barra de anuncios puede aparecer en todas las páginas de tu tienda, pero puedes elegir mostrarla solo en la página de inicio.

Activar la barra de anuncios

  1. Haz clic en Barra de anuncios. 5. Marca Mostrar anuncio.
Select **Home page only** to display the announcement message on the home page only.
  1. Introduce el texto de tu anuncio.
  2. Opcional: introduce una URL para agregar un enlace a tu anuncio.
  3. Para cambiar el color del fondo de la barra de anuncios, haz clic en la muestra de color de la Barra y selecciona un color.
  4. Para cambiar el color del texto del anuncio, haz clic en la muestra de color de Texto y selecciona un color.
  5. Haz clic en Guardar.

Encabezado

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

Puedes agregar un logo adicional que se muestra solo en tu página de inicio. El logo de la página de inicio se muestra sobre la presentación de diapositivas, por lo que debes elegir una versión de tu logo que sea fácil de ver encima de una imagen.

Agregar un logo personalizado

  1. Haz clic en Encabezado. 2. En el área Logo, 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 de archivo de Burst, haz clic en la pestaña Imágenes gratuitas. Desde aquí puede ingresar un término de búsqueda o explorar las categorías de imágenes.
    • Para seleccionar una imagen de tu computadora, haz clic en la pestaña Biblioteca y luego haz clic en Subir imagen.
  2. Opcional: en el área Logo de página de inicio, 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 de archivo de Burst, haz clic en la pestaña Imágenes gratuitas. Desde aquí puede ingresar un término de búsqueda o explorar las categorías de imágenes.
    • Para seleccionar una imagen de tu computadora, haz clic en la pestaña Biblioteca y luego haz clic en Subir imagen.
  3. Introduce el ancho del logo en el campo Ancho de logo personalizado (en píxeles). 8. Haz clic en Guardar.

Diapositivas

Puedes agregar una presentación de diapositivas a tu página de inicio que muestre hasta cinco imágenes en rotación.

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: elige la frecuencia con la que se cambiarán las diapositivas.
  • Texto e íconos: elige 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 de botón: define la URL o página a la que deseas vincular el botón. Pega la URL o selecciona una página del menú. Si no deseas incluir un botón en la sección, deja este campo en blanco.

Personalizar tu presentación de diapositivas

  1. Haz clic en Presentación.

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

  3. Haz clic en Guardar.

Barra de acciones

Por defecto, la barra de acciones muestra el menú principal de tu tienda. Puedes personalizar tus menús para que la barra de acciones muestre 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.

Personalizar tu barra de acciones

  1. Haz clic en Barra de acción.

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

  3. Haz clic en Guardar.

Pie de página

El pie de página de tu tema es la sección que aparece en la parte inferior de cada página de tu tienda. Con Boundless puedes mostrar un menú e íconos para los métodos de pago que aceptas en tu pie de página.

También puedes mostrar enlaces a tus cuentas de redes sociales en el pie de página. Estos enlaces están controlados por tu configuración de tema.

Agregar un menú a tu pie de página

Puedes agregar un menú a tu pie de página. Esto muestra todos los enlaces del menú en tu pie de página, que puedes usar para destacar las páginas frecuentes a las que tus clientes desean acceder. Por ejemplo, puedes agregar un menú que contenga enlaces a tu información de contacto y tus políticas de envío.

<div class="section-tag-block">
  <div class="sections-menu"><ul class="in-page-menu in-page-menu--horizontal"><li class="js-is-active"><a href="#" class="desktop marketing-button marketing-button--small">Escritorio</a></li><li class=""><a href="#" class="iphone marketing-button marketing-button--small">iPhone</a></li><li class=""><a href="#" class="android marketing-button marketing-button--small">Android</a></li></ul></div><div class="desktop active changeable-content"><ol>
<li>Desde tu panel de control de Shopify, ve a <strong>Tienda online</strong> &gt; <strong>Temas</strong>.
</li><li>Haz clic en <strong>Personalizar</strong> junto a <strong>Boundless</strong>.
</li></ol></div><div class="iphone changeable-content"><ol>
<li>Desde la <a href="https://www.shopify.com/install/detect">app de Shopify</a>, pulsa <strong>Tienda</strong>.
</li><li>En la sección <strong>Canales de ventas</strong>, selecciona <strong>Tienda online</strong>.
</li><li>Pulsa <strong>Administrar temas</strong>.
</li><li>Junto a <strong>Boundless</strong>, toca <strong>Personalizar</strong>.
</li><li>Pulsa <strong>Editar</strong>.
</li></ol></div><div class="android changeable-content"><ol>
<li>Desde la <a href="https://www.shopify.com/install/detect">app de Shopify</a>, pulsa <strong>Tienda</strong>.
</li><li>En la sección <strong>Canales de ventas</strong>, selecciona <strong>Tienda online</strong>.
</li><li>Pulsa <strong>Administrar temas</strong>.
</li><li>Junto a <strong>Boundless</strong>, toca <strong>Personalizar</strong>.
</li><li>Pulsa <strong>Editar</strong>.
</li></ol></div>
</div>
  1. Haz clic en Pie de página.

  2. Para seleccionar un menú, haz clic en Cambiar. Selecciona un menú de la lista o haz clic en Crear menú para crear uno nuevo.

  3. Para editar el menú, haz clic en Editar menú.

  4. Haz clic en Guardar.

Agregar íconos de pago

Puedes mostrar los íconos de las formas de pago que aceptas en el pie de página. En esta área se muestran los íconos asociados con el proveedor de pago que has activado en la sección de configuración de pago de tu panel de control.

  1. Haz clic en Pie de página.

  2. Marca Mostrar íconos de pago.

  3. Haz clic en Guardar.

Producto

La sección Producto es la sección personalizable principal para las páginas de productos. Puedes personalizar esta sección usando las siguientes opciones:

  • Omitir la primera imagen del producto: cuando esta opción está activada, la primera imagen del producto se muestra solo en páginas de colecciones, 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.
  • Estilo de imagen: elige alto/cuadrado o ancho.
  • Mostrar proveedor: muestra la marca o proveedor del producto en la página de producto. Para que se muestre una marca o un proveedor, debes agregar un proveedor al producto.
  • Mostrar selector de cantidad: permite a los usuarios especificar una cantidad para agregarla a su carrito.
  • Mostrar botón de pago dinámico: permite que los clientes omitan el paso del carrito y vayan directamente a la pantalla de pago desde la sección de productos destacados.
  • Ancho del formulario del producto: selecciona un ancho pequeño o grande.

También puedes mostrar las recomendaciones de productos en la página del producto.

Personalizar la sección de producto

  1. Selecciona Páginas de productos.
  2. Haz clic en la sección Producto.
  3. Usa la configuración para personalizar tu página de producto.
  4. Haz clic en Guardar.

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.

Activar recomendaciones de productos

  1. Selecciona Páginas de productos.

  2. Haz clic en la sección Recomendaciones de productos.

  3. Marca Mostrar recomendaciones dinámicas para mostrar recomendaciones de productos en las páginas de tus productos.

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

    1. Opcional: Para mostrar u ocultar los proveedores en las descripciones de productos, utiliza la casilla Mostrar proveedor.
  5. Haz clic en Guardar.

Colección

La sección Colección es la sección personalizable principal para las páginas de colecciones. Puedes personalizar esta sección usando las siguientes opciones:

  • Estilo de imagen: elige si deseas que las imágenes sean altas/cuadradas o anchas.

    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.

  • Tamaño de imagen: elige un tamaño de imagen. 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 y del tamaño de la ventana.

  • Agregar espacio entre las imágenes: aumenta el espaciado alrededor de las imágenes de producto.

  • Mostrar proveedor del producto: muestra la marca o el proveedor del producto debajo de las imágenes del producto. Para que se muestre una marca o un proveedor, debes agregar un proveedor al producto.

  • Mostrar opciones de ordenado: selecciona esta opción para permitir que los clientes ordenen los productos en tus páginas de colecciones.

  • Mostrar filtrado de etiquetas: selecciona esta opción para permitir que los clientes filtren la colección por etiqueta de producto.

  • Tipo de paginación: elige si deseas mostrar páginas numeradas o un botón Ver más cuando hay varias páginas de productos en la colección.

Personalizar tu sección de colección

  1. Selecciona Páginas de colecciones.
  2. Haz clic en la sección Colección.
  3. Utiliza la configuración para personalizar tu página de colección.
  4. Haz clic en Guardar.

colección destacada

Puedes exhibir una colección en tu página de inicio: Destacar colecciones puede ayudarte a promover ventas y nuevas colecciones.

La sección Colección destacada incluye las siguientes configuraciones:

  • Colección: elige la colección que aparece en la sección. Se mostrará un máximo de 50 productos de la colección que seleccionaste.
  • Estilo de imagen: elige si deseas que las imágenes sean altas/cuadradas o anchas.

    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.

  • Tamaño de imagen: elige un tamaño de imagen. 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 y del tamaño de la ventana.

  • Activar espaciado de imagen: aumenta el espaciado alrededor de las imágenes de producto.

  • Mostrar proveedor del producto: muestra la marca o el proveedor del producto debajo de las imágenes del producto. Para que se muestre una marca o un proveedor, debes agregar un proveedor al producto.

Agregar una sección de colección destacada a tu página de inicio

  1. Haz clic en Agregar sección.
  2. Haz clic en Colección destacada, y luego haz clic en Seleccionar.
  3. Haz clic en Seleccionar colección, y luego selecciona una colección de la lista Colección. Se mostrará un máximo de 50 productos de la colección que seleccionaste.
  4. Usa la configuración para personalizar la sección.
  5. 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 email marketing. Puedes obtener más información sobre el email marketing en el blog de Shopify.

Añadir un boletín a tu página de inicio

  1. Haz clic en Agregar sección.

  2. Haz clic en Boletín, y luego haz clic en Seleccionar.

  3. Introduce un título para la suscripción al boletín.

  4. Introduce un subtítulo para la suscripción a tu boletín.

  5. Haz clic en Guardar.

Mapa

Puedes agregar un mapa de Google a tu página de inicio para mostrarles a los clientes dónde se encuentra tu empresa.

Sugerencia: para que se muestre tu mapa, debes registrar una clave API de Google Maps.

La sección del mapa incluye las siguientes configuraciones:

  • Encabezado: agrega un encabezado a tu sección del mapa.
  • Dirección y horarios: agrega la dirección y los horarios de tu tienda a tu sección del mapa.
  • Dirección del mapa: establece el mapa que mostrará la ubicación de tu tienda.
  • Etiqueta de enlace del mapa: agrega un botón que enlaza a tu ubicación en Google Maps.
  • Mostrar pin: agrega un pin que muestre la ubicación específica de tu tienda en el mapa.
  • Clave API de Google Maps: agrega la clave API de tu mapa a la sección de mapas.
  • Imagen: agrega una imagen que se mostrará si el mapa no se carga.
  • Posición de la imagen: establece la ubicación de la imagen.

Agregar un mapa a tu página de inicio

  1. Haz clic en Agregar sección. 2. Haz clic en Mapa y luego haz clic en Seleccionar. 3. Usa la configuración para personalizar la sección de tu mapa. 4. 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 mostrando una página con alguno de los siguientes objetos:

La sección de texto enriquecido incluye las siguientes configuraciones:

Pantalla ancha: reduce los márgenes a ambos lados del texto. Título: agrega un título a la sección de texto enriquecido. Texto: agrega y da formato a tu texto personalizado. 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. Tamaño: establece el tamaño de tu texto.

Agregar texto enriquecido a tu página de inicio

  1. Haz clic en Agregar sección.

  2. Haz clic en Texto enriquecido y luego haz clic en Seleccionar.

  3. Usa la configuración para personalizar tu sección de texto enriquecido.

  4. Haz clic en Guardar.

video

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

Para agregar un video, necesitas encontrar el enlace para compartir el video:

  • YouTube: un enlace para compartir de Youtube se ve así: https://youtu.be/Oc5v_ToKP7c. Puedes aprender cómo copiar el enlace para compartir de un video de YouTube en este artículo de ayuda de YouTube.
  • Vimeo: un enlace para compartir de Vimeo se ve así: https://vimeo.com/123456789. Puedes aprender cómo copiar el enlace para compartir de un video de Vimeo en este artículo del Centro de ayuda de Vimeo.

La sección de video incluye las siguientes configuraciones:

  • Encabezado: agrega un encabezado a la sección de video.
  • Enlace de video: agrega el enlace para compartir tu video.

Agregar un video a tu página de inicio

  1. Haz clic en Agregar sección. 3. Haz clic en Video y luego haz clic en Seleccionar. 4. Usa la configuración para personalizar la sección de video. 5. 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 de un sitio web externo.

Agregar una sección de HTML personalizado a tu página de inicio

  1. Haz clic en Agregar sección.

  2. Haz clic en HTML personalizado y luego haz clic en Seleccionar.

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

  4. Haz clic en Guardar.

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

Pruébala gratis