JavaScript Gizle / Göster Sorunu H.K

Merhabalar ; Reklam alanı için ( Reklam Gizle - Göster ) Javascript destekli bir kod.

Fakat sorun şu ; Reklamı gizle yaptık diyelim. Reklam gizlendi buraya kadar sorun yok.
Başka bir sayfaya gidince reklam geri aktif oluyor.
Butona tekrar tıklamadan aktif olmasın reklam istiyorum. Nasıl yapılabilir ?

<style>
 
        body{
            background-color: #dedfdf;
        }
 
        #gizle{
          position: absolute;
          margin: auto;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0;
         
          background-color: #ccc;
          border-radius: 3px;
          border:2px solid #1c1c0c;
        }
 
        </style>


<script>
        var btnGizle=document.getElementById("btnGizle");
        btnGizle.onclick=function(){

          //display özelliği none yapılarak gizleme işlemi yapılır.  
         document.getElementById("gizle").style.display="none";

        }
    </script>


<style>
#ornek {

  padding: 50px 0;
  text-align: center;

}
</style>



<script>
function gizleGoster() {
  var x = document.getElementById("ornek");
  if (x.style.display === "none") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
}
</script>





<div id="soldakayan" style="position: fixed; left: 0px; top: 0px; z-index: 1;">
<div class="uk-card uk-card-default uk-card-small uk-border-radius-small uk-margin" style="width:88%;overflow: hidden;
    background: #f5f8fa;
    border-radius: 2px;"> <div class="uk-card-header">
                            <div class="uk-card-title"> <center> <button style="
    background-color:#323448;" onclick="gizleGoster()">Reklam Gizle/Göster</button></center></div>
                        </div>
                   
<div id="ornek">
                        <div class=" uk-profile-information">
                            

<a href="#"><img src="https://cdn.r10.net/editor/27818/2549053017.gif" style="height:412px;"></a>
                    
                            
                        </div></div>
                    </div></div>

Local Storage (Yerel Depolama) ve Session Storage (Oturum Depolama) dediğimiz tarayıcıların kullandığı bir depolama alanı vardır (çerezler gibi), bu iki kavramı araştırıp ikisinden birini uygulayabilirsin.

tıklanınca şu js yi çalıştır.

document.cookie = "customreklam";

reklamı da

 if(!document.cookie.includes("customreklam")) {

}

koşuluyla gösterebilirsin. en basit yöntem bu şekilde.

SESSION ve COOKIES aratmanızı öneririm

Hocam yukardaki verdiğim kodlara göre yapıp verir misin tam anlamadım nereye ekleneeğini

<script>
if(localStorage.getItem("gizli_mi") && localStorage.getItem("gizli_mi") == "evet") {
  document.getElementById("ornek").style.display = "none";
  // yada direkt olarak fonksiyonu çağırabilirsiniz.
  // gizleGoster();
}
function gizleGoster() {
  var x = document.getElementById("ornek");
  if (x.style.display === "none") {
    x.style.display = "block";
    localStorage.setItem("gizli_mi", "hayir");
  } else {
    x.style.display = "none";
    localStorage.setItem("gizli_mi", "evet");
  }
}
</script>

pm attım

Kral çözdü sağolasın