İYİ DEĞİL, EN İYİSİ İÇİN BURDAYIZ...

Özel 404 Sayfası Oluşturun


Özel 404 Hata Sayfası Oluşturun

1.Adım: Öncelikle şablonunuzun ]]></b:skin> kodundan önce aşağıdaki stil kodlarını ekleyin.

#error {
background-color: #F2F2F2;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVKwiiRi2XgwvKAK9xLeyrU68CWHx-05frSTRfnf3xIWL8vvT8QqhqMaH1f5d6dTr4t8sMe7APV8ssGxYONPFeqeuX-ukRj4arIRQm7F34VNq85YntYw5JVDKmG1KmT2FX1sq7wqFDpQET/s200/bg_ku.png');
background-repeat: repeat;
color: #555555;
height: 100%;
left: 0;
margin: 0;
padding: 0;
position: fixed;
text-align: center;
top: 0;
width: 100%;
z-index: 999;
line-height: 170%;
}
#error #halaman {
position: relative;
height: auto !important;
height: 100%;
min-height: 99%;
}
#error #halaman h2 {
margin: 1em 0;
}

#error #wadah {
margin-top: 120px;
}
#error .tengah {
margin: 0 auto;
width: 920px;
}
#error .box-atas, #error .box-bawah {
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJKH6SJM2-fkZdd4_2-6veWoWf8cxROcP6X9lBOIGd9Nf04aoy_oMKHahAXLEF9XWkxWBDrZ6zr0k7G1ZOBrSMyia5HCiwIqcFoA30hZCZiNKO9mwfXqcCFj0rWtCktfef9EucCrrm4YDj/s944/box-sprite.png');
background-repeat: repeat;
background-position: 0 0;
height: 43px;
margin: 0 -12px;
width: 944px;
}
#error .box-atas {
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJKH6SJM2-fkZdd4_2-6veWoWf8cxROcP6X9lBOIGd9Nf04aoy_oMKHahAXLEF9XWkxWBDrZ6zr0k7G1ZOBrSMyia5HCiwIqcFoA30hZCZiNKO9mwfXqcCFj0rWtCktfef9EucCrrm4YDj/s944/box-sprite.png');
background-repeat: no-repeat;
background-position: 0 -43px;
}
#error .box {
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEho7hZ0T0K0ec8L5A8OkTianpWm04bRn9BuGkWyHNWv3lVZFsbI0ugoNapeI5fyvHLXlvB83wumExu_jLk-0mOEtjtpLH1mKhg6syC06w6cbEzhlbnoyOWocVrQ5I-Fsas2QRqoezUPd8Oa/s920/box-horizontal.png');
background-repeat: repeat-y;
background-position: 0 0;
min-height: 200px;
padding: 10px 50px;

2.Adım: Şimdi Ayarlar > Arama tercihleri > Sayfa Bulunamadı Sayfası İçin Özel İçerik > Düzenle diyerek kutuya aşağıdaki kodları kendinize göre düzenleyerek ekleyin ve değişiklikleri kaydedin.

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<h1>SAYFA BULUNAMADI !</h1>
<div id="error">
<div id="wadah">
  <div class="tengah">
   <div class="box-atas"></div>
   <div class="box">
    <div id="halaman">
    <p><img style="background-image: none; border-bottom: 0px; border-left: 0px; padding-left: 0px; padding-right: 0px; border-top: 0px; border-right: 0px; padding-top: 0px" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiY3eZHILNeVNcHQGrHntjEhbvio56IceDxRszykRgTGX2mbUNBfIYB1bN_uO2p1C0ULyPBmJiSom3b1BBVsYrbqblxrYfFz66bNxfVLcOH-h6zX3D8dLYB4EZXQdtvHH_3CrCQuzQyBurY/s350/4041.jpg" /></p>
     <p>Ulaşmaya çalıştığınız sayfa bulunamadı.Lütfen ulaşmak istediğiniz sayfanın adresini doğru yazdığınızı kontrol edin.Eğer adresi doğru yazdığınızdan eminseniz ulaşmak istediğiniz sayfa silinmiş olabilir.  </p>
     <p> <h2><a href="http://antikawebmaster.blogspot.com/" title="AntikaWebmaster" >Ana Sayfa</a></h2></p>
    </div>
   </div>
   <div class="box-bawah"></div>
  </div>
</div>
</div>
</b:if>

Şimdi blogunuzda var olmayan her hangi bir sayfaya gitmye çalışın.Örneğin:

http://blogunuz.blogspot.com/laylaylom.html

Eski hata mesajının yerine tam ekran bir hata mesajı sayfası karşınıa çıkacaktır.Bu yöntemle çok daha yaratıcı hata sayfaları oluşturabilirsiniz.

0 yorum: