Inicio > Diseño web, Programing > Creando un simple carousel (bootstrap)

Creando un simple carousel (bootstrap)

El pase de diapositivas requiere JavaScript.

Ahora le toca el turno a HTML5, CSS3, Javascript, JQuery y Bootstrap que me están seduciendo día a día y finalmente he caído en la tentación.

Algo que en varios sitios se está usando mucho es ese carousel de gran tamaño que va pasando una secuencia de varias imágenes y que desde mi punto de vista es una herramienta muy práctica ya que es como si fuera un anuncio tipo espectacular pero con la ventaja de que se la imagen cambia en lapsos de tiempo corto, como el que ya habrán visto en el encabezado de este artículo.

Por otro lado Twitter (mi amado twitter!) ha liberado su librería de desarrollo llamada Bootstrap, esto no es nuevo y además es un buen detalle por parte de los desarrolladores de twitter, de grande quiero ser como ellos, así que teclas a la obra!!!

Descarga e instalación de bootstrap

Lo primero es descargar bootstrap desde el si sitio principal, en mi caso se ha descargado el archivo bootstrap.zip que al descompactarlo ahora tengo una carpeta llamada bootstrap.

Según la guía junior de bootstrap, si no tienes un editor de código (yo tengo más de uno) y si no tienes conocimientos básicos de HTML y CSS (yo se python, espero que cuente de algo!), entonces ve a buscar a alguien que si los tenga (me puedes preguntar a mi y de paso me invitas un café!).

Cuando descargues el bootstrap, descarga la versión compilada, ya que es más compacta y funcionará más rápido, a menos que quieras modificar el código fuente, entonces descarga la versión en código fuente (sólo para machitos y féminas aguerridas), pero seguro que no te equivocarás, el botón están resaltado con un rojo azul intenso que prácticamente le das click sin querer (hooo! no es rojo es azul a veces no se en que estoy pensando!) al botón, claro está.

Si tienes habilidad con alguna otra lengua que no sea la tuya, entonces podrías revisar la guía junior directo en la página de bootstrap, donde podrás ver la estructura de directorios y que todos los plugins de javascript necesitas jquery, pero no te preocupes, estos programadores han pensado en todo y decidieron incluir ya jquery también, para que esto sea todavía más sencillo.

Para poder usar bootstrap en nuestro sitio lo que se tiene que hacer es copiar dos archivos

Original Destino
bootstrap/css/bootstrap.min.css public_html/css
bootstrap/js/bootstrap.min.js public_html/js

Ojo, estoy considerando que mi proyecto está todo dentro de la carpeta public_html.

Ahora si ya todo listo para comenzar!

Plantilla HTML básica para usar bootstrap

La verdad que la guía junior es fantástica y tiene una plantilla que prácticamente voy casi a reproducir en su totalidad

<!DOCTYPE html>
<html>
  <head>
    <title>Plantilla Bootstrap</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
  </head>
  <body>
    <h1>Hola, como estas?</h1>
    <script src="http://code.jquery.com/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>

Este código lo guardo en un archivo llamado index.html y estará dentro de mi carpeta public_html/

Sólo para corroborar, abro el archivo index.html en un navegador y obtengo lo siguiente
bootstrap-carousel-04

Listo! Ya tengo todo para comenzar a crear el carousell…

Insertando el carousel (vaya finalmente!)

Un ejemplo de como se verá este carousel se puede ver en el mismo sitio de bootstrap, pero aquí les dejo una captura
bootstrap-carousel-05

Entonces lo primero es adicionar el código html correspondiente al carousel, por lo que es necesario adicionar el siguiente código html al archivo index.html:

    <div id="contenedor">
        <div id="myCarousel" class="carousel slide">
          <ol class="carousel-indicators">
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
            <li data-target="#myCarousel" data-slide-to="1"></li>
            <li data-target="#myCarousel" data-slide-to="2"></li>
            <li data-target="#myCarousel" data-slide-to="3"></li>
            <li data-target="#myCarousel" data-slide-to="4"></li>
          </ol>
          <!-- Carousel items -->
          <div class="carousel-inner">
            <div class="active item"><img  src="img/banner598x374-1.jpg" alt="banner1" /></div>
            <div class="item"><img  src="img/banner598x374-2.jpg" alt="banner2" /></div>
            <div class="item"><img  src="img/banner598x374-3.jpg" alt="banner3" /></div>
            <div class="item"><img  src="img/banner598x374-4.jpg" alt="banner4" /></div>
            <div class="item"><img  src="img/banner598x374-5.jpg" alt="banner5" /></div>
          </div>
          <!-- Carousel nav -->
          <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
          <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
        </div>
    </div>

    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script>
        $(document).ready(function(){
            $('.myCarousel').carousel()
        });
    </script>

yo elegí que sean 5 imagenes que ya tengo en mi carpeta public_html/img, también he adicionado algo de CSS para centrar el carousel, colocar borde y un fondo quedando el resultado como este:
bootstrap-carousel-06
a poco no se ve bien hot!!!

Poniéndolo a punto!

Esta es la mejor parte (en tooooodo! a poco no?) donde se puede ajustar algunas propiedades, en realidad se puede ajustar todo lo que uno quiera pero se requiere de mayores habilidades en javascript y jquery principalmente.

Como ejemplo, cada cuadro se muestra 5000 miliseg en automático, así que voy a modificar ese valor a unos 3000 miliseg, lo que se hace modificando las últimas líneas, donde se activa el carousel en si como muestro aquí…

    <script>
        $(document).ready(function(){
            $('.myCarousel').carousel({
                interval: 3000
            });
        });
    </script>

Salu2+

Anuncios
  1. 21 febrero, 2013 en 23:18

    Yeah! Bootstrap rules!!
    😀

    • 21 febrero, 2013 en 23:31

      Hi Luis!

      Hay que volverse masters en esto! ¿no crees así?

      Salu2+

      • 23 febrero, 2013 en 17:37

        Así es, gracias a Bootstrap te ayuda demasiado en varias cosas solo es cuestión de conocerlas

  2. Manuel
    19 marzo, 2013 en 14:36

    Muy buen tip, solo te fallo indica en que partes del codigo html va,, digo para las personas que estan comenzando con esto. 🙂

    • 19 marzo, 2013 en 15:14

      Hola Manuel!

      Muy cierto, gracias por la sugerencia y de tips nos hacemos expertos 😉

      Felices maketados!
      Salu2+

  3. Javier
    29 marzo, 2013 en 07:31

    Hola, como hago para que la imagenes me lleven a un enlace (link) de la misma web. gracias.

    • 1 abril, 2013 en 05:29

      Hola Javier

      Persón la tardanza en responder, para que una imagen lleve un enlace tiene que encerrar la imagen entre etiquetas

      Espero haber respondido tu duda 😉

      Salu2+

  4. 21 mayo, 2013 en 16:24

    Por eso digo que Bootstrap es el mejor framework CSS

    • 21 mayo, 2013 en 16:37

      Ciertamente, pero no implica que no se tenga que aprender por lo menos lo básico de CSS3 😉 así se tunea más agusto!

      Gracias por comentar, salu2+ desde México 😉

  5. Agustin
    19 junio, 2013 en 22:19

    hola una pregunta porue hay que poner el script siempre al final como hago para poner una function de bootstrap en cualquier lado?

    • 19 junio, 2013 en 22:45

      Hola Agustin

      El script al final es para que la página se cargue completamente y luego todo lo que dependa de los scripts, pero cuando menos ya tienes tu información visisble y el usuario no tiene que estar esperando!

      las funciones de bootstrap las puedes poner donde sea, sólo cuida que sean funciones demaciado largas para que tu página no tarde mucho en cargar, de lo contrario pon una animación.

      Salu2+

  6. gabriel
    27 junio, 2013 en 15:13

    amigo las imagenes se queda estaticas debo presionar en next o prev para que funcione el carousel de imagenes y luego de una o dos pasada se detiene de nuevo ¿que puede estar sucediendo?

    • 27 junio, 2013 en 16:01

      Hola Gabriel

      Revisar que la versión de tu navegador se la más actual, con IE funciona de maravilla en la IE10

      Otra posibilidad es que algo no esté bien con los scripts o los archivos no estén en su lugar correcto o incluso dañandos

      Otra más es la versión de jquery, intenta usar una versión anterior!

      Finalmente no se si lo estés integrando en tu página web de tu sitio, si es así primero trata de hacerlo funcionar en un archivo carousel.html con tus imagenes incluso en la misma carpeta ya ya que funcione luego lo integras.

      Salu2+

    • 4 octubre, 2015 en 11:57

      Hola el atributo data-ride = “carousel” indica que la animación del carrusel empezará de inmediato cuando se carga la página.
      Esto lo tienes que colocar en el div principal del slide. Saludos desde Perú.

      • 4 octubre, 2015 en 14:19

        Hola Carlos

        Muchas gracias por el aporte!

        Salu2+ desde México!

  7. Luis
    2 julio, 2013 en 22:53

    Hola Gabriel oye tengo un duda mi carousel tiene un pequeño problema ya que no aparece en medio de la pantalla. Aparece en toda la pantalla aunque si hace el efecto de pasar de una imagen a otra. Tampoco aparecen los puntos para cambiar de una a otra imagen.

    Agradezco mucho tu respuesta saludos.

    • 2 julio, 2013 en 23:28

      Hola Luis

      Si no te aparece centrado es porque no has dado los estilos a la capa

      , asigna un ancho y centralo y ya con eso.

      En cuanto a los iconos para hacer los cambios, puede que sea por lo mismo, quiero suponer que ya estás integrando la galería en otro diseño que ya tienes, posiblemente estés encimando estilos, si es así te sugiero que realices lo mismo que a Gabriel, que primero lo heches a funcionar en un archivo limpio si nada más que la galería y luego ya lo integras a tu sitio web.

      Salu2+

      • Luis
        3 julio, 2013 en 23:00

        Muchas gracias Gabriel. Ya pude solucionar el problema, era dado que habia creado un extra. Solo modifique el selector .carousel para que apareciera centrado y listo. 😀 Gracias de nuevo. Saludos.

  8. 4 julio, 2013 en 01:03

    Hola Luis me dá gusto que hayas solucionado tu problema y gracias por compartirlo.

    haaaa por cierto soy Ricardo 😉

  9. Ivan
    16 agosto, 2013 en 01:57

    Hola amigo que tal , disculpa una pregunta a mi no me funcionael Bootstrap ni ningunotro Javascript, JQuery, etc, bueno no me funciona nada, lo implemente como lo implemente ni actualizando las librerias nada, y ya no se que hacer o a donde acudir, me podrias ayudar u orientar, gracias

    • 16 agosto, 2013 en 12:36

      Hola Ivan!

      Bueno, pues creo que hay que ir descartando poco a poco y aquí algunas preguntas…
      ¿que sistema operativo usas?
      ¿que navegadores web has usado y que versiones?
      ¿tiene desactivado javascript en los navegadores?
      ¿que antivirus tienes?
      ¿el antivirus tiene algún módulo de tipo seguridad en internet? ¿podrías desabilitarlo y ver que pasa?

      Bueno es lo que se me ocurre de moento!
      Salu2+

      • Ivan
        16 agosto, 2013 en 15:38

        Hola rctorr!

        –>Estoy usando el S.O Windows 7 Home Premium
        –>Internet explorer V. 8 y 9
        –>Google Chrome V. 28.0.15
        –>Firefox (Ultima Verison)
        –>No tengo desactivado ningun Javascript
        –>Kaspersky Anti-Virus 13.0.1 (licencia original)
        –>Si tiene modulo de seguridad y lo he desctivado y no ha pasado nada.

        He puesto el codigo asi so0lo sin ningun Div y me funciona correctamente, pero si lo inserto en el codigo de mi pagi na que tiene dentro como 7 div no me funciona, tambien lo he puesto en diferentes lugares del codigo y no me funciona o me pone las imagenes regadas o solo una raya en blanco.

  10. 17 agosto, 2013 en 18:30

    Hola Ivan!

    Mira a mi me ha pasado eso que haces de insertar en algún sitio que ya tengo diseñado y efectivamente no funciona, las razones han sido desde que tengo mezcladas varias versiones de jquery, he insertado erroneamente alguna etqueta o incluso el orde de llamar a los varios archivos CSS,

    Algo que hice algunas ves porque no encontraba como solucionarlo, fué hacer como has hecho tu, creado un archivo llamado carrousel.html y hacer que funcione sin nada más y al igual que lo hice funcionar sin mucho problema.

    Luego fuí adicionando los elementos (las capas o los DIV’s) uno a uno, también en cada adición comparaba con mi otro archivo donde no funcionaba, desafortunadamente ya tiene un rato que me sucedió eso y no recuerdo con exactitud que fué.

    Espero te sea de utilidad y bueno también decirte que aún con varias proyectos ya realizados, no dejo de desvelarme algunas noches porque algo no funciona como yo espero que funcione, pero es un poco el reto, otro poco divertirse, aprender y la satisfacción de lo logré!

    Si te es posible y tienes a algún colega que pueda ver tu código, también es bueno ya que a veces la miopía personal no deja ver con claridad.

    Salu2+

  11. Jonathan
    19 octubre, 2013 en 17:46

    Hola Luis… gracias por este excelente trabajo, solo te tengo una pregunta, es que quiero cambiarle el tamaño porque sale muy grande.
    Saludos…

  12. jose pernia
    26 octubre, 2013 en 19:41

    hola amigos como hago para validar formularios en bootstrap y tambien tengo problemas con acentos en ajax sale un rombito con signo de interrogación

    • 27 octubre, 2013 en 00:37

      Hola José

      Hasta donde yo sé, bootstrap es más acerca de la vista, los estilos, no de validación, sin embargo HTML5 ya hace validación básica, si requieres de mayor nivel de validación prueba usar javascript a nivel cliente o PHP, Ruby o Python a nivel servidor 😉

      Salu2+

  13. entidad
    31 diciembre, 2013 en 06:28

    si aparecen las imagenes al lado izquierdo
    agreguen aling”center” al .

    quedando asi:

    • 31 diciembre, 2013 en 06:41

      Hola Entidad!

      tu código no apareció completo!!

      Salu2+

  14. Yolanda Hernández
    24 febrero, 2014 en 13:09

    Sólo me aparecen los números y abajo las imágenes aparecen como un ícono roto, ya lo revisé mil veces y nada.

    • 24 febrero, 2014 en 17:33

      Hola!

      Tendrás una muestra de tu código?

      Salu2+

    • Michael
      15 octubre, 2014 en 21:28

      rebiza la direccion de las imagenes! eso me paso a mi y era la raiz de la imagenes!

      saludos

  15. 9 abril, 2014 en 12:10

    Te felicito rector; DTB; por compartir

    • 11 abril, 2014 en 08:29

      Hi Carlos!

      Gracias por el tiempo de dejar un comentario!

      Salu2+

  16. 1 junio, 2014 en 18:59

    Hola: Te consulto si sabes como puedo incluir un texto en cada foto.
    Normalmente en el scr agrego el title, pero en este carrousel no funciona…
    Me podrás dar una mano.

    Gracias.

    • 2 junio, 2014 en 02:47

      Hola Raul!

      en el src?? sería en el alt=”texto” ?’ posiblemente, en todo caso podrías agregar un

      después del y lo podrías acomodar usando position.

      Si te ha funcionado?

      Salu2+

    • 2 junio, 2014 en 02:47

      Hola Raul!

      en el src?? sería en el alt=”texto” ?’ posiblemente, en todo caso podrías agregar un

      después del y lo podrías acomodar usando position.

      Si te ha funcionado?

      Salu2+

  17. 24 junio, 2014 en 20:02

    amigo una pregunta como cambio el fondo de color a mi pagina xk le pongo

    • 24 junio, 2014 en 22:05

      Hola!

      no sabría decirte, eso depende de como esté maquetado, aunque talves podrías intentar colocar un background-color al body 😉

      Salu2+

  18. 2 julio, 2014 en 16:43

    Creo que en el activador JS debería decir
    myCarousel en lugar de Carousel… eso ya muestra las imágenes. El código quedaría asi:

    $(document).ready(function(){
    $(‘.myCarousel’).carousel()
    });

    Gracias!

    • 2 julio, 2014 en 17:14

      Hola Hugo!

      Gracias por comentar ese detalle que es muy cierto, creo que al documentarlo se me pasó!

      De verdad gracias mil!
      RT

      pd. corregido!

  19. copalapoc
    21 julio, 2014 en 14:18

    maestro gracias 😀 funciona y funciona muy bien como la seccion amarilla jejejej

  20. Antonio González
    19 octubre, 2014 en 17:59

    ¿Cómo le hiciste para centrar las imagenes dentro del carrusel?

    • 19 octubre, 2014 en 18:11

      Hola Toño!

      Lo que tuve que hacer es que todas las imágenes fueran del mismo tamaño para que no se descuadrara, pero ya todas iguales se centran solas.

      Salu2+

  21. Carlos
    7 diciembre, 2014 en 20:52

    Excelente entrada, claro y al punto. Muchas gracias me fue de gran ayuda.

    • 7 diciembre, 2014 en 21:25

      Hola Carlos!

      hey muchas gracias por tu comentario, es me has adelantado los regalos de fin de año! jejejeje!

      Salu2+

  22. Monik
    20 septiembre, 2015 en 21:41

    Hola excelente pero como puedo ejecutar la presentacion al cargar la página?

    • 20 septiembre, 2015 en 22:56

      Si sigues las indicaciones, el carousel se iniciará justo cuando la página termine de cargar, aunque eso se puede cabiar, pero así como están, si uno no hace nada, el carousel comienza a pasar de forma cíclica los elementos.

      Si el carousel no inicia, es porque algo no se ha colocado de forma correcta, hay que revisar todo nuevamente

      Salu2+

      • Monik
        23 septiembre, 2015 en 09:00

        Hola, muchas gracias por tu respuesta pero no funciona, copie tal cual tu código agregando unas imágenes y sigue sin funcionar, te agrego el código completo:

        Plantilla Bootstrap

        Hola, como estas?



        http://js/jquery.js
        http://js/bootstrap.min.js

        $(document).ready(function(){
        $(‘.myCarousel’).carousel({
        interval: 3000
        });
        });

        http://code.jquery.com/jquery.js
        http://js/bootstrap.min.js

        Cabe decir que se descargó el bootstrap compilado, que en la carpeta donde esta el index esta las carpetas de css, js, fonts e img el cuanl tiene las imagenes del carousel,

        Espero me pueda ayudar y gracias…

  23. Monik
    23 septiembre, 2015 en 09:06

    Plantilla Bootstrap

    Hola, como estas?



    http://js/jquery.js
    http://js/bootstrap.min.js

    $(document).ready(function(){
    $(‘.myCarousel’).carousel({
    interval: 3000
    });
    });

    http://code.jquery.com/jquery.js
    http://js/bootstrap.min.js

    • 23 septiembre, 2015 en 22:54

      Hi Monik!

      No se si ya lograste hacer funcionar el carousel? Desafortunadamente el código no pasa completo si lo posteas así tal cual! Si aún tienes problemas postea tu código usando la etiqueta CODE del menú o comprime todo en un zip y pásalo por email o dropbox.

      Salu2+

      • Monica
        12 noviembre, 2015 en 15:34

        Hola no habia vuelto a mirar el codigo, pero lo acabe de solucionar, leyendo todo los comentarios, en uno escribiste lo de colocar en div principal en data-ride=carousel y me funciono, gracias!!!!!

      • 12 noviembre, 2015 en 16:31

        Hola Monica!

        Que gusto saber que esto sigue siendo de utilidad, aunque a veces me tardo un poco en responder!

        Gracias por el comentario!
        Salu2+

  24. 4 noviembre, 2015 en 13:07

    como hago para que las imagenes queden centradas si son de un tamaño menor al del carrousel? del mismo modo, como le doy un tamaño requerido por mi a cualquier galeria de imagenes?

    • 12 noviembre, 2015 en 16:30

      Hi Paulina!

      El tamaño de la galería se lo puedes dar al elemento principal de la galería y tienes que asignar la propiedad de text-align: center para que la imágenes menores se centren, aunque sugiero usar todas del mismo tamaño para este caso.

      Salu2+

  25. DianaT
    26 enero, 2016 en 22:44

    como puedo hacer que las imagenes no cambien automaticamente que solo sea con los botones de previo y next

  26. 26 enero, 2016 en 22:46

    Como puedo evitar que las imagenes cambien automaticamente que solo se cambien si presiono los botones de “siguiente” y “previo” por favor amikito 😉

    • 26 enero, 2016 en 23:27

      Hi DianaT

      El sitio de bootstrap en su última versión dice que hay que agregar un código como el siguiente:

      $('.carousel').carousel({
        interval: 2000
      })
      

      Según dice que la opción de “interval” tiene que ser false, así que yo lo pondría así:

      $('.carousel').carousel({
        interval: flase;
      })
      

      ¿funcionó?

      Salu2+

  27. 27 marzo, 2016 en 17:51

    Hola, como puedo poner un carousel al lado de otro carousel y como puedo poner texto al lado de un carousel?

    • 28 marzo, 2016 en 02:33

      Hola Karime

      Si sólo usas HTML5 y CSS3 una solución podría ser crear los contenedores o áreas o capas para cada carousel o el texto, por ejemplo:

      div class="row"
         section class="carousel"
         /section
         section class="carousel"
         /section
      /div
      

      Las clases en css sólo son de ejemplo, pero a las clases carousel les asignas un float left por ejemplo y un ancho del 50% y listo un carousel al lado del otro.

      pd. he eliminado los menor que y mayor que para que el código se viera realtivamente bien!

      Salu2+

  28. 26 julio, 2016 en 15:36

    Me pasa algo curioso me imagino que es por usar bootstrap con sus query, inserto tu codigo y funciona pero se debe cumplir una condicion, para que pueda avanzar automaticamente debo darle en previo o siguiente sino se queda estatica.

    • 26 julio, 2016 en 17:04

      Hola Dopaine

      Bueno, ojo el carousel no avanza si tienes el puntero del mouse encima (over) del carousel, esto sería lo primero, también sugiero revisar o copiar y pegar nuevamente el código en javascript para activar el carousel.

      Si lo estás haciendo en los archivos de un proyecto ya activo posiblemente existe algún problema o algún conflicto con las librerías o código que ya tienes, en este caso sería sugerible hacerlo funcionar en otro proyecto, crea un archivo llamadao carousel.html y hacerlo funcionar ahí, luego sólo toca copiar y pegar, si no funciona entonces hay conflictos o algo está metiendo ruido.

      Salu2+

  29. Coral
    11 agosto, 2016 en 10:41

    Hola, te molesto con la siguiente pregunta cómo puedo hacer para que la fotos en el carousel no aparezcan deformadas? Desde ya muchas gracias, Coral

    • 11 agosto, 2016 en 10:50

      Hola Coral

      Tienes que hacer que las dimensiones del carousel sean del mismo tamaño que las fotos o ajustar el tamaño de todas las fotos al tamaño del carousel.

      Salu2+

  30. RONALD
    17 octubre, 2016 en 20:30

    chevere cuasa un like para ti me salio de lujo jajaj

    • 18 octubre, 2016 en 05:36

      Hi Ronald!

      muchas gracias por tu comentario y revisa el nuevo bootstrap v3 que tiene buenas cosas también!

      Salu2+

  31. LeFunk
    20 octubre, 2016 en 19:41

    que tal soy de México, apenas estoy estudiando tecnologías , novato y solo puse este código en la carpeta de CSS para centrar las imágenes y texto. ademas solo las modifique mas chicas las imágenes con office picture manager o fotoshop, espero les sirva.

    .carousel-inner { text-align: center; }
    .carousel .item > img { display: inline-block; }

    • 20 octubre, 2016 en 20:25

      Hola LeFunk!

      Pues para ser novato me parece muy bueno tu aporte, gracias por compartir seguro le ayudará a más de uno/a y sólo como complemento y esperando haber entendido con esas adiciones al CSS lo que se logra es hacer que aunque las imágenes sean más pequeñas al área del carousel apaescan centradas en el espacio visibles del carousel..

      Salu2+gracias!

  32. 1 marzo, 2017 en 13:47

    Hola me puedes ayudar como subo las imagenes que yo quiera en el carrusel

    • 1 marzo, 2017 en 14:13

      Hola Kata!

      Las imágenes la subes igual que otro archivo, usa el mismo programa que usar para subir el código html, yo en el tuto sugiero que creen una carpeta llamada img/ y ahí colocarías todas las imágenes, sean del carousel o de cualquier otra cosa, entonces lo que necesitas es subir la carpeta img/ o si ya tienes la carpeta, pues entonces subir sólo las imágenes en esa carpeta.

      Si no cuentas con un programa aún para subir tus archivos al servidor, te sugiero usar Filezilla.

      Salu2+ y buena tarde!

  33. 17 junio, 2017 en 19:10

    Exelente, gracias por compartir

    • 17 junio, 2017 en 19:22

      jejejeje, hola Gustavo gracias por comentar!

      Salu2+

  1. No trackbacks yet.

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

PiKon

3D Printing + Raspberry Pi Camera = PiKon Telescope

gvSIG blog

gvSIG project blog

Python Adventures

Welcome to the Jungle!

A %d blogueros les gusta esto: