Crear un carrusel de logos en Divi sin Plugins

Inicio / Tutoriales Premium / Tema Divi / Crear un carrusel de logos en Divi sin Plugins

Contenido Restringido🖐

Accede a este y otros contenidos siendo premium. ¿Aún no eres premium? Adquiere una membresía aquí ⭐

Profesor: Jefferson M

  1 de mayo de 2020

En este tutorial premium lograrás crear un carrusel de logos en Divi sin ningún plugin, solo agregando algunos cachos de código en algunos módulos. Con esto lograrás un efecto dinámico en los logos de empresas que quieras representar en un sitio web para lograr un efecto de diseño potente y con movimiento.

Aunque Divi debería tener esta funcionalidad por defecto, con estos pequeños cambios tendremos la funcionalidad sin impactar tanto al rendimiento de la web, al mismo tiempo que el efecto será totalmente responsive.

En tutoriales futuros también tendremos este mismo efecto pero con plugins, para todos aquellos que no quieren saber nada de código, también tendremos esa opción, además con el plugin descargable. Es importante mencionar que este efecto no solo lo puedes aplicar para imágenes, sino también para módulos del blog, o básicamente cualquier módulo que quieras, haciendo sus adaptaciones correspondientes.

Al finalizar el vídeo tutorial y poner en practica lo aprendido podrás tener un resultado similar o mejor que este:

Como ves, es un efecto que hace que la web luzca bastante dinámica y le quite ese aspecto estático y aburrido, logrando que con este carrusel de logos en Divi se convierta en un elemento importante en el diseño de tu sitio web.

Si te ha gustado este contenido no olvides compartirlo con tus amigos y conocidos, además recuerda que puedes compartirnos el enlace de tu creación en los comentarios de este contenido, así todos veamos los resultados maravillosos que conseguiste con este contenido prémium.

Descarga los recursos mencionados en este tutorial acá abajo 👇 siendo premium ⭐

17 Comentarios

  1. Podrias incluir los logos para seguir el ejercicio por favor.

    Responder
    • Jefferson M

      ¡Listo! Los hemos agregado al final. Puedes descargarlos dándole clic derecho y guardar imagen. Gracias por la sugerencia.

      Responder
  2. Juan Eduardo M

    Hago los mismos pasos, pero no se muestra nada. Sale una fila sin efectos. Debe ser por Wp Rocket?

    Responder
    • Jefferson M

      Así es, puede ser una posibilidad del plugin de WP-Rocket, prueba desactivandolo a ver. Si desactivandolo sigue persistiendo el problema seguramente falta algún código en alguno de los pasos que realizaste. Es muy importante que insertar el Script en la pestaña del head en la configuración del tema divi, en la sección de integración.

      Responder
    • Jerry Brian P

      Que tal juan no se si pudiste arreglar el problema pero puede ser que sea por el motivo de poner mal algún código por ejemplo yo puse mal esto “logo-items slider” ya que puse en el lugar donde no era y ya lo solucione. por si te paso algo igual.

      Responder
  3. Christian Alexis H

    Hola que tal, De casualidad se podra modificar las pestañas de deslizamiento para que no sean botones sino flechas? supongo que puede agregarse en una hoja de estilos desde la base CSS

    Responder
    • Jefferson M

      Hola Christian ¿A que te refieres con las pestañas de deslizamiento? Este efecto no genera botones de deslizamiento como tal.

      Responder
  4. Onasis S

    Hola hola linda comunidad, tengo una inquietud ¿ Si quiere realiza lo mismo para otro propósito seguiría los mismos pasos?

    Responder
    • Jefferson M

      Si, si aplicas el CSS a otros módulos que tengan más o menos el mismo tamaño, si podría funcionar. Ya sería solo cuestión de probar.

      Responder
  5. Luz Daneris C

    Hola Jefferson,

    He seguido cuidadosamente cada uno de los pasos y me salen las imágenes en una sola columna sin desplazamiento. He desactivado los plugins. ¿Qué otra acción puedo tomar para obtener el efecto de carrusel?

    Gracias.

    Responder
  6. roberto v

    Hola una consulta el script primero (1.- colocar el siguiente código en la cabezera de Head en las opciones de Divi.) ¿porque es necesario? saludos

    Responder
    • Jefferson M

      Que tal Roberto, porque el efecto de carrusel se genera a través de ese Script.

      Responder
  7. Roberto G

    Hola a todos.

    A mi se me visualiza sin problemas pero me queda en la parte de abajo un espacio muy incómodo que me hace que el diseño de la página se me descuadre.
    He intentado quitar margen y ajustar al máximo los valores de separación en cada uno de los módulos pero no lo consigo reducir.
    Hay alguna forma de hacerlo??
    Gracias!

    Responder
    • Jefferson M

      ¿Probaste quitando la separación de la fila y la sección?

      Responder
      • Roberto Garcia

        Si. Pero al colocar las dos secciones con los códigos del carrusel ese espacio queda ahí. No puedo ocultarlo por que si no el carrusel no funciona.

        Responder
        • Jefferson M

          Vale, allí tendrías que quitar todo el “relleno o padding” de todo, tanto de las secciones, como filas, donde has colocado el código. Para ello basta con que pagas los valores de margen superior he inferior en 0px.

          Responder

Enviar un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Solicitud de cancelación de suscripción

Aviso importe

🚩 Debes solicitar la cancelación de tu suscripción al menos 24 horas antes de tu renovación, de otro modo, no podremos procesar a tiempo la cancelación antes de tu renovación.

Al cancelar tu suscripción, perderás el acceso a todo esto:

🚩 A más de mil contenidos especializados en el aprendizaje del diseño web
🚩 El soporte personalizado en Divi
🚩 Acceso al grupo de Discord
🚩 Acceso a la descarga de las actualizaciones de los plugins, el contenido y las descargas de nuestro sitio.
🚩 Puntos y rangos obtenidos en la plataforma

✅ Te ofrecemos la opción de pausar tu suscripción 2 o 3 meses y así no perderás el progreso obtenido en la plataforma.

Lamentamos mucho 😩 que tu experiencia en nuestra plataforma no haya sido la mejor. Para poder procesar tu solicitud y hacerla efectiva, necesitaremos que por favor nos envíes lleno este formato. Esto nos ayudará a poder seguir mejorando nuestra propuesta de valor y siendo útil para todos los usuarios.

Solicitud de cancelación

¿Por cuál o cuáles razones deseas cancelar tu suscripción?

¿Qué características mejorarías en nuestra web?

¿Cuál es tu nivel de satisfacción en relación con la calidad del soporte que ofrecemos por diferentes medios? donde 1 es insatisfecho y 5 es satisfecho

¿En esta escala que tanto recomendarías a UXDIVI a un amigo o colega? donde 1 es "no lo recomendaría" y 5 es "Lo recomendaría totalmente"

4 + 15 =


Iniciar Sesión

¿No tienes cuenta? Registrarse

Otros planes

¡Accede a más de 1330 contenidos especializados en Diseño Web con Divi por un solo precio!

Trimestral

Ahorra 6 USD 🔥

$US 18/ Mes

*Pagando US$ 54 cada 3 meses

¿A qué accedes con este plan?

Lifetime

Un solo pago 🔥

$US 499/ Lifetime

*UN SOLO PAGO DE POR VIDA

¿A qué accedes con este plan?

Con este plan accedes a:

  1. ✅ Todos los cursos
  2. ✅ Todos los tutoriales prémium
  3. ✅ Todos los plugins y layouts
  4. ✅ Soporte prémium vía email
  5. ✅ Acceso a la comunidad en Discord

Con este plan accedes a:

  1. ✅ Todos los cursos
  2. ✅ Todos los tutoriales prémium
  3. ✅ Todos los plugins y layouts
  4. ✅ Soporte prémium vía email
  5. ✅ Acceso a la comunidad en Discord
  6. ✅ Descuentos en Templates para Divi