👰 Como hacer INVITACION para BODA digital INTERACTIVA + Plantilla

Поделиться
HTML-код
  • Опубликовано: 20 окт 2024

Комментарии • 36

  • @NailethPinto
    @NailethPinto  11 месяцев назад +12

    td {border-style: solid;
    border-color: #000;
    border-width: 0px;
    color: #000;
    padding: 0px;
    font-size: 24px;
    font-family: Dancing Script Normal;
    text-align: center;}
    th {
    border-width: 0px;
    color: #000;
    text-align: center;
    padding: 0px;
    font-size: 10px;
    font-family: Monotype Corsive;}












    Días
    Horas
    Minutos
    Segundos




    document.addEventListener('DOMContentLoaded', () => {
    //===
    // VARIABLES
    //===
    const DATE_TARGET = new Date('05/26/2023 09:00 PM');
    // DOM for render
    const SPAN_DAYS = document.querySelector('span#days');
    const SPAN_HOURS = document.querySelector('span#hours');
    const SPAN_MINUTES = document.querySelector('span#minutes');
    const SPAN_SECONDS = document.querySelector('span#seconds');
    // Milliseconds for the calculations
    const MILLISECONDS_OF_A_SECOND = 1000;
    const MILLISECONDS_OF_A_MINUTE = MILLISECONDS_OF_A_SECOND * 60;
    const MILLISECONDS_OF_A_HOUR = MILLISECONDS_OF_A_MINUTE * 60;
    const MILLISECONDS_OF_A_DAY = MILLISECONDS_OF_A_HOUR * 24
    //===
    // FUNCTIONS
    //===
    /**
    * Method that updates the countdown and the sample
    */
    function updateCountdown() {
    // Calcs
    const NOW = new Date()
    const DURATION = DATE_TARGET - NOW;
    const REMAINING_DAYS = Math.floor(DURATION / MILLISECONDS_OF_A_DAY);
    const REMAINING_HOURS = Math.floor((DURATION % MILLISECONDS_OF_A_DAY) / MILLISECONDS_OF_A_HOUR);
    const REMAINING_MINUTES = Math.floor((DURATION % MILLISECONDS_OF_A_HOUR) / MILLISECONDS_OF_A_MINUTE);
    const REMAINING_SECONDS = Math.floor((DURATION % MILLISECONDS_OF_A_MINUTE) / MILLISECONDS_OF_A_SECOND);

    // Render
    SPAN_DAYS.textContent = REMAINING_DAYS;
    SPAN_HOURS.textContent = REMAINING_HOURS;
    SPAN_MINUTES.textContent = REMAINING_MINUTES;
    SPAN_SECONDS.textContent = REMAINING_SECONDS;
    }
    //===
    // INIT
    //===
    updateCountdown();
    // Refresh every second
    setInterval(updateCountdown, MILLISECONDS_OF_A_SECOND);
    });

    • @ricardodanielgayoso5908
      @ricardodanielgayoso5908 11 месяцев назад

      Hola tengo una consulta cuando la cuenta regresiva llega a cero se detiene o vuelve a iniciarse

    • @dariela03
      @dariela03 7 месяцев назад

      1:12

  • @mariacamargo4623
    @mariacamargo4623 8 месяцев назад +3

    Muchas gracias por el tutorial, bien explicado

    • @NailethPinto
      @NailethPinto  8 месяцев назад +1

      Gracias por comentar, me alegra te sirviera 🤗

  • @rocionavarrotahona5352
    @rocionavarrotahona5352 11 месяцев назад +1

    me parece el video ideal, me has salvado la vida con la invitacion de boda, es perfecta. mil gracias como personas como tu nos hacen llegar esto para poder crearlo nosotros mismos.
    solo una preguntilla, como puedo agregar musica de fondo?

    • @NailethPinto
      @NailethPinto  11 месяцев назад

      Hola, un gusto... En canva aún no podemos agregar multimedias, espero que pronto se pueda agregar audio ;-) me da mucha alegrìa te sirviera el video ;-)

  • @GloriMas-X2
    @GloriMas-X2 6 месяцев назад +2

    Este tipo de invitación se puede hacer de la misma forma en Canva y cuál es la diferencia de hacerlo en Google Sites?

    • @NailethPinto
      @NailethPinto  6 месяцев назад +1

      Hola, se puede hacer en canva o google sites. La diferencia es que Canva te permite animar elementos... es mi favorita y cómo igual muchos de los diseños que creamos en canva, es muy funcional. Yo utilizo varias plataformas porque tengo muchas plantillas que se venden y me sigue siendo muy práctico utilizar las 3. www.nailethpinto.com.ar/acerca-de-mi/proyectos/invitaciones-web-de-alta-calidad-50-plantillas-listas-para-editar-en-canva

  • @mauricioaguilar2201
    @mauricioaguilar2201 11 месяцев назад +1

    consulta cuando envio la invitacion a alguien que tiene el telefono en MODO: Oscuro, el fondo y las letras cambian der color se puede hacer algo con eso?

    • @NailethPinto
      @NailethPinto  10 месяцев назад

      Hola, en realidad no creo que se pueda solucionar (no estoy segura) porque es algo que lo hace automático el teléfono y al ser enlaces web como que leen los colores y hacen un desastre :-( sobre todo a estas invitaciones.

  • @alfonsofragosohernandez1373
    @alfonsofragosohernandez1373 10 месяцев назад +1

    Hola naileth se puede crear un botón para que la página que abrimos en WhatsApp cree un acceso directo para la pantalla principal del celular

    • @alfonsofragosohernandez1373
      @alfonsofragosohernandez1373 10 месяцев назад

      Me refiero a si se puede poner un botón dentro de la invitación de Google sites para crear un acceso directo en la pantalla principal del CEL y ahí la puedan ver rápido cuando la buquen

  • @ilanameszaros6180
    @ilanameszaros6180 2 месяца назад

    Hola Naileth, me gustó muchísimo tu video.
    Me encuentro sumamente interesada en poder contratar tus servicios para poder crear mi invitación, pues hay ciertas funciones que no logro efectuar de manera correcta.
    Favo si pudieras facilitarme tu correo para poder conversar por interno y ver si tienes tiempo.
    Muchas gracias!

  • @drakenbaby5156
    @drakenbaby5156 8 месяцев назад +1

    Pregunta solo es con el telefono Despues nose imprime o algo?

    • @NailethPinto
      @NailethPinto  8 месяцев назад

      Hola, no, no se imprime... es digital. Si quieres guardar de recuerdo le puedes capturas e imprimir 😉

    • @NailethPinto
      @NailethPinto  8 месяцев назад

      En este video explico como puedes combinar ambas opciones ruclips.net/video/ajG3j2znQFw/видео.html

  • @anahigarcia4690
    @anahigarcia4690 11 месяцев назад +1

    Disculpe se le puede agregar música a la invitación????

    • @NailethPinto
      @NailethPinto  11 месяцев назад

      SI, SI se puede agregar... en la descripción esta un video de como hacerlo

  • @ecsique
    @ecsique 11 месяцев назад +1

    Hola muy buen contenido, hay alguna forma de poder agregar el número de invitados a la invitación ?

    • @NailethPinto
      @NailethPinto  11 месяцев назад +1

      Hola, lo puedes hacer, pero tendrìas que hacer copias de la invitación

  • @tadashihamada5710
    @tadashihamada5710 11 месяцев назад +1

    Hola me encanto tu video! Es todo lo que busco. Pero mi invitación es para una fiesta de cumpleaños con disfraces. Tengo una pregunta! Existe la forma de hacer que los invitados escogan sus disfraces y muestre cual está disponible y el que no, para que los disfraces no se repitan?

    • @NailethPinto
      @NailethPinto  10 месяцев назад

      Hola, si, existe posibilidades para hacerlo, pero para explicar en un video, modo fácil no conozco un método :-(

  • @andreacastellanos8287
    @andreacastellanos8287 11 месяцев назад +1

    Hola disculpa, el código de la cuenta regresiva no me funciona.

    • @NailethPinto
      @NailethPinto  11 месяцев назад

      Hola, fìjate que debes editar mes, dìa, año y la hora es AM y PM

  • @LofichillMaao
    @LofichillMaao 11 месяцев назад

    Hola naileth buenas tardes, estoy intentando hacer una invidacion de boda que vi en una app, esta diseñada en google sites e inicia con un video y luego baja a las demas información, pero no he podido con el video en Google sities me ayudas porfa?? He visto tus videos y en ninguno lo haces 😢

    • @NailethPinto
      @NailethPinto  11 месяцев назад +1

      Hola, yo lo hice asi para un cliente... y tuve que cargar el video en una plataforma externa...mi web de wordpress y hacer un pequeño código en html para que al terminar apareciera la nueva página... es algo para poder explicar en un video...

    • @LofichillMaao
      @LofichillMaao 11 месяцев назад

      @@NailethPinto si pero cuadrar el tamaño del video se me esta haciendo complicado, no he podido pasar de ahí... supongo que ha de haber otra manera de cargalo

  • @anahigarcia4690
    @anahigarcia4690 11 месяцев назад

    Disculpa quiero que mi invitación tenga audio cuando la abran que tenga una canción de fondo se podrá ????

    • @NailethPinto
      @NailethPinto  11 месяцев назад

      Hola, se debe agregar un icono y se debe hacer play

  • @JUANCHOMTZ1382
    @JUANCHOMTZ1382 11 месяцев назад

    Soy de México, si hago una invitacion para boda o 15 años entre otros como en cuanto les cobraria xq algunos me piden

    • @NailethPinto
      @NailethPinto  11 месяцев назад

      Hola, tengo un curso muy accesible para emprender con estas invitaciones, el precio varia según el pais... pero te comparto los detalles a tomar en cuenta nailethpinto1908.kpages.online/nueva-pagina-e86ec47c-12e4-4f99-ab5b-3cf89d23459f

  • @paulabayo7872
    @paulabayo7872 11 месяцев назад +1

    no veo el codigo de la cuenta regresiva

    • @NailethPinto
      @NailethPinto  11 месяцев назад

      td {border-style: solid;
      border-color: #000;
      border-width: 0px;
      color: #000;
      padding: 0px;
      font-size: 24px;
      font-family: Dancing Script Normal;
      text-align: center;}
      th {
      border-width: 0px;
      color: #000;
      text-align: center;
      padding: 0px;
      font-size: 10px;
      font-family: Monotype Corsive;}












      Días
      Horas
      Minutos
      Segundos




      document.addEventListener('DOMContentLoaded', () => {
      //===
      // VARIABLES
      //===
      const DATE_TARGET = new Date('05/26/2023 09:00 PM');
      // DOM for render
      const SPAN_DAYS = document.querySelector('span#days');
      const SPAN_HOURS = document.querySelector('span#hours');
      const SPAN_MINUTES = document.querySelector('span#minutes');
      const SPAN_SECONDS = document.querySelector('span#seconds');
      // Milliseconds for the calculations
      const MILLISECONDS_OF_A_SECOND = 1000;
      const MILLISECONDS_OF_A_MINUTE = MILLISECONDS_OF_A_SECOND * 60;
      const MILLISECONDS_OF_A_HOUR = MILLISECONDS_OF_A_MINUTE * 60;
      const MILLISECONDS_OF_A_DAY = MILLISECONDS_OF_A_HOUR * 24
      //===
      // FUNCTIONS
      //===
      /**
      * Method that updates the countdown and the sample
      */
      function updateCountdown() {
      // Calcs
      const NOW = new Date()
      const DURATION = DATE_TARGET - NOW;
      const REMAINING_DAYS = Math.floor(DURATION / MILLISECONDS_OF_A_DAY);
      const REMAINING_HOURS = Math.floor((DURATION % MILLISECONDS_OF_A_DAY) / MILLISECONDS_OF_A_HOUR);
      const REMAINING_MINUTES = Math.floor((DURATION % MILLISECONDS_OF_A_HOUR) / MILLISECONDS_OF_A_MINUTE);
      const REMAINING_SECONDS = Math.floor((DURATION % MILLISECONDS_OF_A_MINUTE) / MILLISECONDS_OF_A_SECOND);

      // Render
      SPAN_DAYS.textContent = REMAINING_DAYS;
      SPAN_HOURS.textContent = REMAINING_HOURS;
      SPAN_MINUTES.textContent = REMAINING_MINUTES;
      SPAN_SECONDS.textContent = REMAINING_SECONDS;
      }
      //===
      // INIT
      //===
      updateCountdown();
      // Refresh every second
      setInterval(updateCountdown, MILLISECONDS_OF_A_SECOND);
      });

    • @paoladenissedeleonhernande3681
      @paoladenissedeleonhernande3681 11 месяцев назад +1

      ​@@NailethPinto todo eso se pone

    • @NailethPinto
      @NailethPinto  11 месяцев назад

      @paoladenissedeleonhernande3681 si