FROM CACHE - es_header

Ayuda para mover el botón en la imagen del banner para dispositivos móviles en el tema Dawn

keikourban
Visitante
1 0 0

Quiero mover de lugar el botón en la imagen del banner solo para la versión móvil ya que la única manera de ponerlo sin que se sobreponga sobre el contenido de la imagen que tengo en el banner es poniendo el contenedor, pero dicho contenedor también le quita estética a mi pagina 

Captura de pantalla 2024-04-28 115924.png

es justo donde en esta parte que señalo en la imagen es donde quisiera poner el botón 

keikourban
1 RESPUESTA 1

Teo
Shopify Staff
2242 498 320

Hola, @keikourban:

 

Gracias por escribirnos. Entiendo por tu mensaje que deseas mover el botón del banner principal de la tienda en versión móvil para evitar que se sobreponga con la imagen con texto. Con todo, estás usando el tema Dawn en tu cuenta, ¿cierto? Será un placer poder ayudar y arrojar luz sobre esta cuestión.

 

A modo de contexto, cabe tener en cuenta que el editor de temas de Shopify no cuenta con una herramienta nativa para personalizar la posición del botón del banner principal exclusivamente para móvil de manera independiente. Ahora bien, una de las principales ventajas de utilizar Shopify es que puedes editar el código de tu tienda para implementar diseños personalizados a las diferentes secciones/elementos de tu página.

 

Dicho esto, me alegra informarte de que es posible mover la posición del botón del banner principal en versión móvil con una simple edición de código CSS mediante la herramienta de CSS personalizado. Recuerda desactivar la opción de Banner > Mostrar contenedor en el móvil en el editor de temas. Te dejo el extracto de código que debes añadir y la sección concreta de tu tienda donde puedes implementarlo:

 

@media screen and (max-width: 989px) {
 .banner__buttons {
   position: relative;
   top: 120px;
 }
}

 

  1. Dirígete a la sección Tienda online > Temas.
  2. Haz clic en Personalizar.
  3. En los iconos de la izquierda, selecciona Configuración del tema.
  4. Localiza la sección CSS personalizado.
  5. Pega el código que te comparto.
  6. Guarda la configuración.

 

Nota: En el extracto "top: 120px;" puedes modificar la cantidad de píxeles para cambiar la posición. Cuanto más píxeles añadas, más bajará el botón. De esta manera, puedes personalizar el diseño de manera más ajustada a la imagen de banner que actualmente tienes en la página web de tu tienda. Dime, ¿podrías confirmarme si de este extracto de código CSS personalizado se ajusta a las necesidades de tu negocio?

 

Mientras revisas esto, me pregunto cómo está siendo tu experiencia con Shopify hasta el momento. Dime, ¿qué tipo de tienda has creado con nuestra plataforma? ¿Qué productos o servicios ofreces a los clientes? ¿Qué objetivos a corto y largo plazo te gustaría conseguir con Shopify y con tu tienda?

Teo | Social Care @ Shopify 
 - ¿Te resultó útil mi respuesta? Dale Me gusta para hacérmelo saber 
 - ¿Resolvimos tu pregunta? Dale a Aceptar como solución
 - Para saber más visita el Centro de ayuda de Shopify o nuestro Blog de Shopify