Turkcell | Geleceği Yazanlar

Soru & Cevap

Bir Sitede Navbarı Tüm Sayfalara Dahil Etmek

30.05.2020 - 23:13

Merhabalar, örneğin index sayfasında bulunan navbarı diğer sayfalara(info,blog,contact.html) nasıl kodları copy paste yapmadan otomatik oluşmasını sağlarım ?

226 Görüntülenme

5 Cevap

Metin
03.06.2020 - 21:16

Sana şu şekilde söyleyeyim. Hiçbir framework e geçmene gerek yok. Aşağıdaki kodu sayfana ekle. Ekleyeceğil elementi örn: navbar <div mtnsmsk-ekle="navbar.html"></div> Olarak Ekleyebilirsin. 
Sayfanın Sonuna Bu Kodu Ekle!
<script>
function includeHTML() {
  var z, i, elmnt, file, xhttp;
  z = document.getElementsByTagName("*");
  for (i = 0; i < z.length; i++) {
    elmnt = z[i];
    file = elmnt.getAttribute("mtnsmsk-ekle");
    if (file) {
      xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (this.readyState == 4) {
          if (this.status == 200) {elmnt.innerHTML = this.responseText;}
          if (this.status == 404) {elmnt.innerHTML = "Dosya Bulunamadı!.";}
          elmnt.removeAttribute("mtnsmsk-ekle");
          includeHTML();
        }
      }
      xhttp.open("GET", file, true);
      xhttp.send();
      return;
    }
  }
}
</script>

Sitede yorum yapabilmek için giriş yapın ya da üye olun.

Metin
03.06.2020 - 21:16

Sana şu şekilde söyleyeyim. Hiçbir framework e geçmene gerek yok. Aşağıdaki kodu sayfana ekle. Ekleyeceğil elementi örn: navbar <div mtnsmsk-ekle="navbar.html"></div> Olarak Ekleyebilirsin. 
Sayfanın Sonuna Bu Kodu Ekle!
<script>
function includeHTML() {
  var z, i, elmnt, file, xhttp;
  z = document.getElementsByTagName("*");
  for (i = 0; i < z.length; i++) {
    elmnt = z[i];
    file = elmnt.getAttribute("mtnsmsk-ekle");
    if (file) {
      xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (this.readyState == 4) {
          if (this.status == 200) {elmnt.innerHTML = this.responseText;}
          if (this.status == 404) {elmnt.innerHTML = "Dosya Bulunamadı!.";}
          elmnt.removeAttribute("mtnsmsk-ekle");
          includeHTML();
        }
      }
      xhttp.open("GET", file, true);
      xhttp.send();
      return;
    }
  }
}
</script>

Sitede yorum yapabilmek için giriş yapın ya da üye olun.

Metin
03.06.2020 - 21:14

Sana şu şekilde söyleyeyim. Hiçbir framework e geçmene gerek yok. Aşağıdaki kodu sayfana ekle. Ekleyeceğil elementi örn: navbar <div mtnsmsk-ekle="navbar.html"></div> Olarak Ekleyebilirsin. 
Sayfanın Sonuna Bu Kodu Ekle!
<script>
function includeHTML() {
  var z, i, elmnt, file, xhttp;
  z = document.getElementsByTagName("*");
  for (i = 0; i < z.length; i++) {
    elmnt = z[i];
    file = elmnt.getAttribute("mtnsmsk-ekle");
    if (file) {
      xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (this.readyState == 4) {
          if (this.status == 200) {elmnt.innerHTML = this.responseText;}
          if (this.status == 404) {elmnt.innerHTML = "Dosya Bulunamadı!.";}
          elmnt.removeAttribute("mtnsmsk-ekle");
          includeHTML();
        }
      }
      xhttp.open("GET", file, true);
      xhttp.send();
      return;
    }
  }
}
</script>

Sitede yorum yapabilmek için giriş yapın ya da üye olun.

Gürkan
31.05.2020 - 10:47

Bunun için normal Asp.Net / WebForm'ları kullanarak Master Page yapısıyla yapabilirsiniz. İkinci bir yol olarak da MVC ya da diğer Asp.Net Core platformlarında bulunan Layout yapısını kullanabilirsiniz. İyi çalışmalar.

Sitede yorum yapabilmek için giriş yapın ya da üye olun.

Mertcan Dursun
31.05.2020 - 13:34
Çok teşekkür ederim hocam cevabınız için sizlere de iyi çalışmalar.
30.05.2020 - 23:27

Bunu core html ile yapamazsın bunun için bu  bağlantıdaki js dosyasını kullanarak yapa bilirsin ancak dosya sisteminde yine çalışmayacaktır. Çünkü cross koruma diye bir şeye takılıyor tam hakim değilim konuya. Yada en güzeli Angular öğren :D

Sitede yorum yapabilmek için giriş yapın ya da üye olun.

Mertcan Dursun
30.05.2020 - 23:30
Hocam teşekkürler cevabınız için. Angular'a yakında geçeceğim. Bu sorun aklımı karıştırdı çok araştırdım bir türlü cevap bulamadım.

Sitedeki sorulara cevap verebilmek için giriş yapın ya da üye olun.