Efecto de scroll vertical (navegación vertical) con cambio de imágenes - Elementor y Wordpress
HTML-код
- Опубликовано: 14 окт 2024
- Amig@s! El plugin que van a necesitar para conseguir el efecto de scroll vertical o navegación vertical se llama "premium addons for elementor", es completamente gratis.
Recuerden que van a necesitar la versión PRO de Elementor para poder diseñar sus plantillas de contenido.
Déjame un mensaje en mis redes:
Si tienes dudas del video, sugerencias de otro tutorial o simplemente quieres decir ¡Hola! Aquí me puedes encontrar:
Facebook --- @manumartinez.mkt
Instagram --- @manumartinez.mkt
![How to create SLIDERS with Elementor [PRO] 2022 FULL SCREEN](http://i.ytimg.com/vi/2mpd8C8d4OQ/mqdefault.jpg)
Muchas gracias, fue de gran ayuda y fácil de seguir, además lo hizo prácticamente paso a paso. Se agradece que no haya hecho falta instalar un plugin de pago
Justo es el scroll que andaba buscando y no sabia como lo hacian, por que no se nada de wordpress, pero pues #emprendepobre, muchas gracias por ayudar a los demás !!
Q bueno q te pude ayudar!
20 minutos es mucho! gracias por el contenido!
Super vídeo Manu, me sirvio bastante, como comentario les comento que lo pueden usar sin el Elementor Pro. Solo ocupe el elementoe Free y el Premium Addons for Elementor.
Hola. Ví tu comentario y lo estoy probando, pero no funciona. El efecto se llama Snap Scroll y parece que con este tutorial, no funciona. ¿Conoces algún tutorial de mayor ayuda? En todos lados mencionan que se puede hacer Snap Scroll pero con Elementor Pro solamente.
Hola! Tarde pero seguro, le puedes echar un vistazo a este tutorial, está más actualizado.. ruclips.net/video/p97jkddgoWc/видео.html
Hola, Saludos desde Colombia.
Este efecto se puede realizar de manera horizontal en Fotos verticales ?
Muchísimas gracias :)
Manu eres un Crack Gracias por tu aporte!
Excelente vidfeo amigo, uan duda, este scroll se puede poner o configurar a que el scroll sea automatico que no tengas que moverle tu para que cambie de imagen???.. Gracias
Muchas gracias Manu. Está genial el tutorial. Aunque tiene sus problemas en el celular. Saludos!!
Me ayudó un montón Manu, no ocupé el mismo plugin pero los pasos son similares. Gracias !!
que plugin usaste amigo?
Excelente Manu, muy agradecido bro!
Gracias a ti x el comentario!! éxito
Excelente amigo, muy bien explicado. Muy útil. Suscrito.
Esta muy bueno, pero por experiencia con mis clientes siempre quieren el menu de textos. ¿se puede reemplazar el menu de circulos por textos?
Hola, muchas gracias por el tutorial.
He seguido todos los pasos, incluso he utilizado la misma fuente, y todo funciona excepto precisamente eso: la fuente (tipografía). En los slides la veo correctamente, pero en la página "scroll vertical" los textos cambian de tipografía a una más simple, tipo arial. Si me pudieras ayudar te lo agradecería mucho.
Un saludo
Otro problema que me ha surgido es con la barra de navegación. La he activado porque me parece muy práctica en la versión de escritorio (ordenador), pero no encuentro una manera de deshabilitarla solo cuando se navegue con un teléfono
Me sirvio muchisimo, muchas gracias Manu,ya tienes un nuevo suscriptor
Hola Manu, gracias por el video. Sabes si hay alguna manera de ralentizar la velocidad del scroll para que no sea constante?
Gracias!
ADELANTE con tu canal, tienes buenos contenidos.
Hola tienes uno en el que este scroll vertical al bajar vaya cambiando de color? Gracias
Profesor, puedes pasar al siguiente nivel scroll vertical "Pero" que se superpongan y que os Z Index no den dolor de cabeza con el menú del tema ASTRA?
genial! te felicito, muy buenooooooo
hola manu, excelente el tutorial pero cuando llego hasta abajo al footer el scroll se hace infinito y pierdo las primeras entradas ya programadas, cómo puedo arreglar este problema?
Gracias me gusto mucho el tutorial
Gran video
gracias crack!
Es un tutorial que desata habilidades grandiosas. Lo felicito. Pero tengo una duda. Usted específica que el procedimiento requiere Elementor PRO, pero yo seguí al pie de la letras sus indicaciones y logré un resultado asombroso pero la cosa es que yo no tengo Elementor Pro. ¿Fué alguna casualidad?
Excelente, gracias por el vídeo!
Hola Lisbeth! Q bueno que te pude ayudar. Excelente día!
una bestia amigo ... gracias
Una landing page requiere SEO?
Buenísimo, ya me suscribí a tu canal
MUY buen video.
Exitos para tu canal!
Una pregunta si quiere colocar informacin debajo del escroll es posible? es decir el resto de mi home
Hola! Sí se puede, pero la sección tiene que ser muy pequeña en altura, para que el sistema no piensa que es una sección adicional y te rompa la estructura
@ podrias hacerme el favor de darme un ejemplo de lo que mencionas
Gracias Manu por el tutorial, justo estaba buscando este efecto. El problema es que no me deja editar el widget, ya en Elementor. Selecciono el widget, pero no me aparece el menú de configurción de la izuierda que se muestra para toda seccion, columna y widgets. Tienes alguna idea que causa este problema?
Gracias!
Probé con otro tema y ya lo permite. La razón es el tema que tenía activo. Cambiando de tema se souciona. Gracias nuevamente por tu tutorial!
Gracias x la info Edgar... no sabía que un tema te puede descuadrar tanto una función... lo tendré en mente por si a alguien más le sucede
Tremendo tutorial!! Esto vale oroooo
Gracias amigo!! Me da gusto q te haya servido.
Me interesa el mismo video, cual es el título?
@@lohagoyo Efecto de scroll vertical (navegación vertical)
Muchas gracias!
El problema al que me estoy enfrentando es que la versión móvil no se adapta y se ve la imagen recortada, existe alguna posibilidad que se vea la imagen bien en el móvil?
Se adapta a moviles?
Gracias por tu aporte. Pero no sé porque razón en la página desaparece el menú de navegación
Intenta poniéndole al menú un z-index superior a 1, ponle 999. Y si quieres que siempre esté visible mientras recorres toda la página web entonces le activas el sticky
gracias por el video bro, en el caso de la web de Zara, sabes como hacer para que a parte del efecto de scroll vertical que pones, haya scroll horizontal? entré a la web de ellos y vi que tienen ambos efectos, se ve como un scroll para todos lados bastante bonito
pudiste encontrar la solución ??
Pffff Excelnte Tuto, solo una pregunta como puedo quitar #section_b1c4a701 cuando estoy bajando me sale en mi link de la página, muchas gracias
Hola Didier, gracias por tu comentario. Ya tiene bastante tiempo que no muevo el plugin, pero justo a finales de la semana voy a replicar la página de carros Tesla que tiene el mismo efecto. Subo el tutorial el viernes.
Siento que te amo... jajajajajajajaja Saludos Bro, muchísimas gracias
jajaja gracias Bro! acabo de ver tu mensaje, me hiciste la mañana. Abrazo desde la ciudad de méxico
Hola! Gracias por el video, muy bueno. Tengo un problema: los puntos de navegación no me quedan fijos en la visualización sino que se va al centro de la web. ¿Tendré algo mal configurado?
Hola @Alejandro, en la configuración del widget, me parece ser que es en la pestaña de navegación, viene una opción para que elijas en dónde quieres mostrar los puntos de navegación. Saludos!
Gran dato! Y como se vería en móvil?
Buena tarde buen video saludos
Gracias x tu comentario. Excelente tarde!!
Me encanto!!! ❤️❤️❤️❤️ Gracias!!!! 💞🙏🏻💞
Que bueno q te sirvió! Excelente día :)
You probably dont care at all but does anyone know of a way to get back into an instagram account..?
I was dumb forgot the login password. I would love any help you can give me!
@Steven Roman instablaster =)
@Juelz Tate Thanks so much for your reply. I found the site on google and I'm in the hacking process atm.
Looks like it's gonna take quite some time so I will reply here later with my results.
@Juelz Tate It worked and I now got access to my account again. Im so happy!
Thanks so much, you saved my account!
Buen video!! Tengo una pregunta , quiero poner imágenes en forma vertical mientras le de yo una personalización de ancho y tamaño sabe cómo hacerlo
Hola Kevin! Ayúdame a entender mejor tu pregunta. La imagen la quieres usar como imagen de fondo de toda tu sección? o adentro de la sección junto con tu contenido?
@ podré contactarlo en Instagram?? También si da alguna asesoría de elementor
@@kevinverdintapia8423 me encuentras en insta como @manumartinez.mkt ... Sí damos asesorías.
Hola! Excelente video, pero tengo un problema que no puedo resolver. Segui todas las instrucciones al pie de la letra, pero el widget de vertical corta mis plantillas arriba y abajo, haciendo que se vea en la parte inferir de cada plantilla una franja de la plantilla siguiente. Como puedo arreglar eso? Gracias!!
Hola Andres! En cada una de tus plantillas asegúrate de tener un VH view height del 100% , también esto pasa si metiste elementos extra en la página que no estén diseñados desde el menú de plantillas. Este widget jala la información de esa sección y no se construye como lo harías en una página común de Elementor
@ Manu, muchas gracias por tu pronta respuesta. El Vh estaba al 100, seguí al pie de la letra cada instrucción y corrección de tu video. De hecho, revise otros tutoriales para Vertical Scroll, los Cuales utilizan configuraciones diferente, y sigo obteniendo el mismo resultado. En la pagina, la única sección es en la que inserto el widget. La imágenes que utilice en las plantillas las saque de Shutterstock, no tienen las mismas dimensiones. Igualare las dimensiones a 1080 y te comento como me van, aun que no creo que sea ese el problema.... ya que cuando cargo el widget y añado la primera plantilla, se ve como la sección del widget corta la parte de abajo de la plantilla... es muy extraño y me esta sacando ya canas verdes jaja
Estimado. Lo logre. Había sido un error mio... En la confesión de las plantillas, agregue botones sobre la imagen, los cuales, en vez de agregar una subsección a la sección, era un sección nueva, la cual había movido sobre la primera sección. Elimine esa sección extra y agregue los botones en una subsección. Así que misión cumplida. Gracias Crack!!
@@elmag1co Me da gusto Bro! a seguir haciendo sitios web PRO
De mucha ayuda!
Que tamaño de imagen usas para que se ajuste bien a la web? Saludos.
1900x1080 a 72 pixel/pulgada . Saludos!!
Esta muy bueno, estaría genial que mostraras lo responsive. Particularmente las imagenes en 1900x1080 no me las esta dejando hacer responsive, las tengo que manipular bastante y quedan chicas. Podrias poner algun ejemplo de muestra en celular ?
Hola Alan! hace unas semanas subí el tutorial responsive, échel un vistazo en mi playlist. Abrazo!
Perdón acá quería escribir, me interesa el vídeo responsive. Cómo es el título?
@@lohagoyo ruclips.net/video/5dYK-rD8QA8/видео.html Espero te sirva! saludos
MANU, QUÉ MARAVILLA. TENGO UNA CUESTIÓN, ME GUSTARÍA TENER IMÁGENES EN UN PASE DE DIAPOSITIVAS A PANTALLA COMPLETA Y QUE PUEDA CREAR DENTRO UN TEXTO QUE SE MUEVA EN SCROLL DENTRO DE ESA PANTALLA COMPLETA CON IMÁGENES EN MOVIMIENTO ¿ES POSIBLE? MIL GRACIAS Y BRAVO POR TU CANAL.
Hola @Trini Salamanca - gracias x tu mensaje! Ese efecto lo consigues con el plugin de "Slides" de Elementor. Por las funciones q me describes, le vas a tener q meter algo de CSS para que haga todos los efectos.. pero el widget de slides te puede dar un buen primer inicio :)
GRACIAS MANU. VOY A INTENTARLO!!
Hola como se configura para que se vea en el móvil?
Y con programacion cómo se hace eso? He buscado bastante y no lo encuentro.
Ya tiene años q no hago un sitio a mano… la comodidad de Elementor 😅
@ Aunque no lo creas usando palabras clave de tu video lo encontré, desde el año anterior buscando, gracias!!!
Como puedo hacer si quiero desactivar la navegación con las flechas del teclado ?
Hay un problema con los menús de navegación externos... no se pueden configurar se desfaza la imagen
¡Hola! Para ocultar la scrollbar necesito hacerlo con CSS, ¿verdad?
Hola @Metzly, puedes ocultarlo desde las opciones del plugin en la pestaña "Navegación", ahi viene la opción de ocultar el menú. Saludos!
Tengo una duda.. como le agrego arriba un menú permanente y que incluya por ejemplo.. enlace a las redes sociales...
Hola @Christian - Si tienes la versión gratuita de elementor, este link te va a ayudar. Aquí te enseño cómo crear un menú de navegación sin utilizar plantillas. Me avisas si es lo q estás buscando :) ruclips.net/video/9cpVR7frE6Y/видео.html
@ Hola Manu, mi pregunta apuntaba a como este efecto convivía con el reader y el menú de un sitio.. por ejemplo.. se que desde el widget se puede crear un menú para ese sílice vertical.. sin embargo, quisiera que el menú te lleve a otros links, como por ejemplo redes sociales o una pagina que profundiza un contenido... no se si me explico bien..
Creo que puede hacerse también con la versión gratis de Elementor.
como puedo configurarle el menú?
pro
Yo necesito que sea con la misma imagen, que se deslice a medida que se va viendo toda la página 🥲
¿Alguien se sabe otro plugin porque este al actualizar trueena en chrome?
@Ante - La página q hice sigue funcionando bien, igual y agrégame a Insta y mándame print screen para ver tu problema.
@ sabes, mi error era que... tenía una flechita para subir usando el mismo ID que puse en una sección y ese mismo ID lo tenía en un bullet del widget... y tronaba horrible a cada rato... y lo peor es que se arruinaba y tenía que volver a arrastrar de nuevo otro widget y volverlo a configurar. Pero ya me quedó muchas gracias.
Alguien sabe como hacer que la imagen de fondo tenga un enlace? Saludos
Hay otra forma gratuita de hacerlo?
Hola! Por el momento es l única que conozco. Saludos
Me falla en Mobile, porque?
Hola Andrea! van varios mensajes q me mandan así... voy a intentar subir el video de la versión móvil mañana :)
@ hola realizaste? el video porque estoy teniendo ese problema con una web el menú de cabecera se ve extendido como si fuera visto por PC pero el contenido si se adapta a la versión móvil.
Vi todo el video. Hoy, 2023, esto no funciona. Deberían borrar este video ya que no tiene sentido mirar un tutorial de más de 20 minutos que ya no funciona en la actualidad.
Yo lo he realizado, ahora, 05/2023, y si funciona... solo me quedaron dudas, de ¿porqué se borra el menú principal del sitio?, no aparece en esta página que se crea y el ¿cómo eliminar el link tan extraño que aparece que es #section_ ?