"Cómo Crear un Banner Adaptable para Cualquier Dispositivo en Shopify | Guía Paso a Paso"
Вставка
- Опубліковано 7 жов 2024
- ¡Hola a todos! 👋 En este video, les mostraré cómo crear fácilmente un banner adaptable para cualquier dispositivo en Shopify. Vamos a cubrir todos los pasos necesarios para asegurarnos de que tu banner luzca increíble tanto en dispositivos de escritorio como en móviles.
🔹 Medidas ideales para banners:
Escritorio: 2240x1260 px
Móvil: 1200x1600 px
Enlace al código:
bit.ly/BannerR...
Haz realidad tus ideas por $1/mes en Shopify : shopify.pxf.io...
Grupo Telegram: t.me/+GrTeKbka...
En este tutorial paso a paso, aprenderás a:
Diseñar y ajustar tu banner para diferentes dispositivos.
Integrar el banner en tu tienda Shopify.
Asegurarte de que el banner sea completamente responsivo.
¡No te pierdas ningún detalle y asegura una experiencia visual perfecta para tus clientes en cualquier dispositivo! 📱💻
Si te gusta el video, no olvides darle like 👍 y suscribirte a mi canal para más contenido útil sobre Shopify y diseño web. ¡Gracias por ver!
Haz realidad tus ideas por $1/mes en Shopify : shopify.pxf.io...
Grupo Telegram: t.me/+GrTeKbka...
#Shopify #BannerResponsivo #DiseñoWeb #TiendaOnline #GuíaShopify
Hola Leonardo, muy buena explicación. Fue fácil y me funcionó perfecto. Al igual que otra persona que te comentó, te agradecería enormemente si al código le puedes agregar la funcionalidad de "carrusel de imágenes", en donde se puedan ir viendo distintas imágenes dinámicamente, cada cierta cantidad de segundos. Gracias de nuevo y saludos!
Hola , gracias lo tomaré en cuenta para futuros vídeos
El día 26 de septiembre a las 12:00pm hora de los Ángeles será publicado ese vídeo
Me encanta mucho este Banner!!!, Si tuviese para agregar mas imágenes con autorrotación seria lo mejor. Saludos!!
Ando trabajando en eso , ya que tenido problemas para poder adaptarlos
Pero acabo de subir uno que es sobre vídeos
El día 26 de septiembre a las 12:00pm hora de los Ángeles será publicado ese vídeo
Excelente explicación, me sirvió mucho tu ayuda, te agradezco.
Gracias por comentar
MUCHAS GRACIAS, ME FUE DE MUCHA AYUDA ENSERIO!!!
Con mucho gusto
Muchas gracias, me fue de mucha ayuda. Tienes nueva seguidora ❤
Me da gusto que los pueda ayudar , pronto subire más vídeos y si algo te gustaría aprender , déjalo aquí en comentarios para ver si lo puedo realizar
Excelente aporte. Gracias.
Hola, muchas gracias!
Buena pregunta , tendría que hacer el código para que tenga esa función . Lo anotaré para poder crear un vídeo sobre eso , no es difícil
Hola Leonardo, muchas gracias por el video. Quiero hacer lo mismo que Natalia. Puedes subir el código con esas funciones extras?? Gracias!
Hola a los dos , esta semana que viene voy hacer el código de este, tengo ahí una lista de ideas que me han estado haciendo llegar . También me gustaría hacer un canal de telegram para hacer una comunidad en la cual podamos ayudarnos todos , a mí me gusta hacer equipo con todos, ya que todos tenemos diferentes ideas
Brutal el video, ya está montado el del banner que se desplaza? Muchas gracias por la información tan valiosa
@kevindanielvergelortega8861 ya lo tengo desarrollado el código , nomás tengo tiempo crearé el video tutorial
Muchas gracias :)
De nada , espero les sirva 🙌🏻
gracias por el aporte hermano
Con gusto
Muy bueno el video amigo, te podría consultar como es posible cambiar de tamaño la altura del banner?
Si tú banner lo haces en canvas ahí selecciona el ancho que ocupas que sea la imagen , sería lo ideal
@@LeonardoLeyvaEcom Gracias hermano! sería increíble que hicieras un tutorial de como crear un banner slider
@Legc26 en eso ando trabajando justamente , ahorita estaba haciendo una colección slider , pero ando trabajando sobre eso , más que nada que acepte la parte responsive
@@LeonardoLeyvaEcom Lo esperare con ansías! Muchas gracias por sacar tan buen contenido
@Legc26 mañana se sube el de la colección , lo del banner aún estoy revisando
ME GUSTA MUCHO TU CONTENIDO ! MI AMIGO LOS APLIQUE TOOODOS A MI TIENDA , TU PODRIAS HACER ALGO RESPECTO A COLORES O SI SABES CAMBIAR FUENTES LLAMATIVAS CONSEJOS ASI PARA MAS CONVERSIONES
Si los colores son sencillos de mover y la typografia , ya Shopify cuenta con algunas, en mi lista de próximos vídeos tengo como agregar otras tipografías , ya que muchas veces algún experto diseñador realiza tu marca y te anexa tipografías que no hay en shopify y quieres tener las que menciono que queda con tu estilo . Pronto lo subiré
Leonardo una consulta estoy probando tu código de y en tema de Dawn theme si me ayuda mucho per0 quisiera utilizar el thema nuevo de shopify de Trade quisiera ver si haces un video como puedo utilizarlo en ese thema en que parte del código puedo añadirlo
Este sería el mismo en cualquier tema , en section(sección ) ya que no colocamos algún código en otro lugar
Perfecto ya hice mi cambio. Pero no tengo botón para dirigir a los productos. como lo añado?
El botón será la imagen , o puedes diseñar en canvas o Photoshop un banner con botón para que lo simule , pero realmente con solo presionar la imagen ya es el botón
Buenas noches, parce usted es un crack! tengo un inconveniente hice todo el paso a paso, pero no se si hay un error en el codigo, pues me aparece el banner reponsive para ajustar la tienda y aparecen ya las 2 secciones para cambiar las fotos de escritorio y celular, pero al momento de subir las imagenes se combinan las 2 en una sola pagina, osea las imagenes no quedan independientes si no que se unen tanto la de escritorio como la de celular, quedo a tento a tu respuesta gracias!
Hola , no me ha sucedido eso , el código se encuentra bien. Que tema estás utilizando ? Mándame mensaje a instagram y podría apoyarte
Podrías revisar de nuevo el código no se si había un error pero lo coloqué de nuevo
como lo hago para que pueda estar el boton que viene preestablecido ?? a mi no me sale y no puedo colocarlo nuevamente
Este código no tiene botón , el botón en si es toda la imagen , en donde realices el banner, sea canvas o photoshop , ahí crea un botón
hola buen video e dice que hay error en la linea 3, no se por que siempre que sigo estos tutoriales no me funcionan a mi 😔
Que tal, mándame mensaje por instagram y si quieres dame acceso y te ayudo cómo solucionarlo
@@LeonardoLeyvaEcom bro ya te escribi
Amigo, gracias por tu ayuda, sin embargo me doy cuenta que el banner aparece en todas las paginas e intento ocultarlo de las otras paginas y se oculta tambien en la pagina inicial. como puedo solucionar este incomveniente ? gracias!!
Hola , qué raro , solo debe salir donde tú lo colocas , si puedes mándame DM al insta y te ayudo a resolver el problema
Estimado, me pasa lo mismo, pudiste resolverlo?
@MauPet-l8o hola , qué raro a mi no me sale el error , mándame mensaje al grupo de telegram o a mi instagram
Revisa de nuevo en enlace lo volví a colocar en GitHub
Buen vídeo
Muchas gracias por el apoyo , cada semana subiré vídeos nuevos y si quieren realizar algo , házmelo saber y buscaremos cómo hacerlo
buen video amigo pero me sale un error, el segundo banner si funciona pero el primero esta dañado salen un poco de letras. :(
Deja reviso el código
Ya actualicé el código no se si hay algún error en el anterior
@@LeonardoLeyvaEcom gracias, voy a revisar
intenta poner bien el nombre de la sección. tambien me sucedio un error y cambie el nombre y se soluciono de inmediato.
No me aparece me estará faltando algo seguí los pasos tal cual y nada ☹️
Que error te aparece , en la descripción tengo mi instagram , si quieres mándame DM y te ayudo
como copio
el link
En el símbolo del enlace lo presionas
@@LeonardoLeyvaEcom ya lo hice gracias
bro por hay te escribi al ig
lo que vi es que no se le puede agregar texto
@DanielJos3 el texto lo haces cuando edites el banner en Photoshop o canvas , no es necesario agregar texto dentro de ahí
@@LeonardoLeyvaEcom umm por qué yo le pongo bienvenidos a la tienda y pongo un opción de comprar
bit.ly/BannerResponsive