Create Popup Cookies Consent Box in HTML CSS & JavaScript | Set Cookie JavaScript

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

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

  • @lyubon9492
    @lyubon9492 Год назад

    I just needed the JavaScript part with the cookie and it works perfectly. Thank you so much for this video. Very helpful : )

  • @tioem3399
    @tioem3399 Год назад +1

    Easy to follow and worked like a charm! Thank you!

  • @crissantanna6555
    @crissantanna6555 Год назад +4

    thank you!!!! how can I make the cookie window disappear when the person clicks reject?

  • @JhoanSBM
    @JhoanSBM 23 дня назад

    perfect :)

  • @aerticYT
    @aerticYT 2 года назад

    Hey, is it possible to use more of your stuff, like this password strength and email validation etc. on one screen at the same time on the site? If so, how?

  • @alman_harbi
    @alman_harbi 2 года назад +5

    Can you explain for what cookies are used for? If a user accepts it, what will be next, like we would know the user's information?

    • @CodingLabYT
      @CodingLabYT  2 года назад +3

      Cookies are small pieces of text sent to your browser by a website you visit. They help that website remember information about your visit, which can both make it easier to visit the site again and make the site more useful to you. The cookie box I have made is set only one cookie value which name is codinglab, and until that cookie expired model box will not come if you click on accept button. That cookie is for only that model box.

    • @benjawiBen
      @benjawiBen 2 года назад +3

      A good example of cookies is when you tick a box on a login page that says to remember your login for something like 30 days. Sets a cookie for 30 days and saves you having to log into that website every time. If you don't accept cookies on that website, then the remember me function won't work.

  • @lucblouin2747
    @lucblouin2747 Год назад +1

    Very good! Thank a lot ! It works fine except how can I make the cookies window disappear when the person clicks decline? I would just like the box not to recharge when the user refuses. Please tell me if you have a solution?

    • @MoroccanHub
      @MoroccanHub 6 месяцев назад

      const cookieBox = document.querySelector(".wrapper");
      const buttons = document.querySelectorAll(".button");
      // Function to check if a cookie exists
      function getCookie(name) {
      const nameEQ = name + "=";
      const cookies = document.cookie.split(';');
      for (let i = 0; i < cookies.length; i++) {
      let cookie = cookies[i];
      while (cookie.charAt(0) === ' ') {
      cookie = cookie.substring(1, cookie.length);
      }
      if (cookie.indexOf(nameEQ) === 0) {
      return cookie.substring(nameEQ.length, cookie.length);
      }
      }
      return null;
      }
      const executeCodes = () => {
      // Check if either cookieBy or cookieDeclined exists
      if (getCookie('cookieBy') || getCookie('cookieDeclined')) {
      return; // Do nothing if either cookie exists
      }
      cookieBox.classList.add("show");
      buttons.forEach((button) => {
      button.addEventListener("click", () => {
      cookieBox.classList.remove("show");
      if (button.id === "acceptBtn") {
      // Set cookie for acceptance
      document.cookie = "cookieBy=codinglab; max-age=" + (60 * 60 * 24 * 30);
      } else if (button.id === "declineBtn") {
      // Set cookie for decline
      document.cookie = "cookieDeclined=true; max-age=" + (60 * 60 * 24 * 30);
      }
      });
      });
      };
      // Execute function on page load
      window.addEventListener("load", executeCodes);

  • @LaurianeBL
    @LaurianeBL Год назад

    Hello and thanks for the tutorial but the pop up keeps showing after i refresh the page when i click on decline... do you have a solution ? Thank you :)

  • @PawełMurawski
    @PawełMurawski 6 месяцев назад

    Hello, what IDE are you using here?

  • @truegoldenhands
    @truegoldenhands Год назад

    very good and useful ´work!

  • @JAY-MAHAKAL-108-20
    @JAY-MAHAKAL-108-20 3 месяца назад +1

    Js no working

  • @lorenzolin4959
    @lorenzolin4959 Год назад

    Hello guys, should i use it on every page of the website? or just write it on 1 page?

    • @yenvi1546
      @yenvi1546 Год назад +1

      You should put it on your index or home page! So use it only once :)

  • @mar4974
    @mar4974 Год назад

    what is the use of cookies?

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

      You don't need to signin again in a website

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

    JS doesnt work

  • @enderbenderplayz5189
    @enderbenderplayz5189 2 года назад

    source code?

  • @omorfaruk6986
    @omorfaruk6986 2 года назад

    please give html css full website design tutorial

    • @CodingLabYT
      @CodingLabYT  2 года назад +1

      Here they are - ruclips.net/video/Xuso8gekEdg/видео.html
      ruclips.net/video/gUxIzo3gj-g/видео.html

  • @AbhinavMishraA-wc3ky
    @AbhinavMishraA-wc3ky 2 года назад

    @CodingLab Hi men! Please create a video on how to create a login system using cookie 🍪! In js. Pin me!

    • @CodingLabYT
      @CodingLabYT  2 года назад +1

      Okey I will think about it.