Blogger 404 Sayfa Bulunamadı (Page Not Found) Sayfası

Blogger bloglarının zamanla optimizasyona daha açık bir hale geldiğini, blogger gelişim sürecini takip eden kişiler de mutlaka farketmişlerdir. Bugün de  sizlere bu gelişim dalgasının bir ürünü olan “Blogger 404 Sayfa Bulunamadı” sayfasını blogunuza nasıl ekleyip, optimizasyonunu nasıl yapabileceğinizi anlatacağız. Peki nedir bu Blogger 404 sayfa bulunamadı sayfası ? Blogunuzda kırık bir link yada olmayan bir link tıklandığında diğer platformlardaki sitelerde veya scriptlerde açılan “404 page Not Found” sayfası yani sayfa bulunamadı sayfası; bu sayfada aradığınız şeyi sitemde bulamadınız, yada tıkladığınız link kırık, isterseniz sizi ana sayfaya tekrar geri götürelim, yada bizimle iletişim kurun, gibi linkler ekleyip ziyaretçinizi yönlendirebileceğiniz ve gelen ziyaretçiyi sayfanızda tutup, link kırık yada sayfa bulunamadı deyip, çıkıp gitmesine engel olmak için düşünülmüş ve tasarlanmış bir sayfa oluşturuyorsunuz.İşin özü bu aslında.Sizde blogunuza ait Blogger 404 sayfa bulunamadı sayfası nasıl görünüyor merak ediyorsanız aşağıdaki linki sitenize uyarlayıp kontrol edebilirsiniz.

http://www.siteadresiniz.com/404/

Blogger 404 Sayfa Bulunamadı Sayfası Nasıl Düzenlenir?

1-Blogger hesabınızla giriş yapıyorsunuz.
2-Aşağıdaki resim de de gördüğümüz gibi Ayarlar>Arama Tercihleri linklerini tıklıyoruz ve ardından Hatalar ve Yönlendirmeler kısmından “Sayfa Bulunamadı Sayfası için Özel İçerik” açıklamasının karşısında bulunan (Resimde 3 Numara) Düzenle Linkine tıklıyoruz.

3-Aşağıdaki resimde açılan kutu içerisine aşağıdaki kodu kopyalayıp yapıştırıyoruz.

<!-- blogokulu.org 404 Sayfa Bulunamadı -->
<div class='blogokulu-404-box'>
<p style='line-height: 30px'>
<strong>
<font color='#ff0000' size='5'>
Üzgünüz!!!
</font> <font color='#666666'>
Aradığınız sayfa ile ilgili yaşadığınız problemi giderebilmek için lütfen aşağıdaki seçeneklerden birini seçiniz:
</font></strong></p>
<ol style='line-height: 25px'>
<li>Yaşadığınız Problemi Rapor Etmek İçin <a href='http://blogokulu.org/p/iletisim.html'>TIKLAYINIZ...</a>&#160;&#160;&#160; <em>En kısa sürede sorunun çözümü için çalışacağımıza söz veriyoruz.</em>) </li>
<li>Ana Sayfaya Dönmek için <a href='http://blogokulu.org'>TIKLAYINIZ...</a>

</li>
</ol>
<p>
</p>
<p align='center'>
<font color='#0080ff' style='font-size: 150px'><strong>404</strong></font></p>
<p>
&#160;</p>
<p align='center'/>
<p align='center'>
<font size='5'>Sayfa Bulunamadı!</font></p>
</div>

Yukarıdaki kod içerisinde;
-Kırmızı renkle verdiğimiz http://blogokulu.org adresini kendi site adresiniz ile değiştirin, ve iletişim sayfa linkini de kendi sitenize ait iletişim sayfa linki ile değiştirin.
-Eğer mavi 404 sayısının rengini değiştirmek istiyorsanız kodlar içerisinde mavi renkle verdiğimiz #0080ff renk kodunun yerine istediğiniz renk kodunu yazın.(HTML renk kodları için Tıklayınız)
-Eğer isterseniz yukarıda kodlar içerisinde pembe renkle yazdığımız 404 yazısını silip yerine istediğiniz güzel bir resmi de koyabilirsiniz,(internetten “free 404 page not found images” diye aratırsanız çok güzel resimler bulabilirsiniz) bunun için yapmanız gereken;
404 yazısını silip yerine aşağıdaki kodu eklemek;
<img src=”Eklemek istediğiniz Resmin URL Adresi”> 
-Eğer ekleediğiniz resme tıklandığında ana sayfaya tekrar yönlenmesini istiyorsanız aşağıdaki kodu ekleyin;
<a href=”/”><img src=”Eklemek istediğiniz Resmin URL Adresi”></a>

Kod içerisindeki gerekli değişiklikleri yaptıktan sonra ve kodu ekledikten sonra “Değişiklikleri Kaydet” butonuna tıklıyoruz. (resimde 2 numaralı kısım)

4-Şimdi de Blogger 404 Sayfa bulunamadı sayfası için CSS kodlarımızı ekliyelim ve Şablon HTMLyi Düzenle yolunu takip ederek HTML kodları içerisinde Ctl+F yardımı ile ]]></b:skin> kodunu aratıp bulalım.

5-Aşağıdaki kodu kopyalayıp bulduğumuz ]]></b:skin> kodunun üst satırına yapıştıralım.

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<style type='text/css'>
.status-msg-wrap {
    font-size: 100%;
    margin: none;
    position: static;
    width: 100%;
}
.status-msg-border {
    display:none
}
.status-msg-body {
    padding: none;
    position: static;
    text-align: inherit;
    width: 100%;
    z-index: auto;
}
.status-msg-wrap a {
    padding: none;
    text-decoration: inherit;
}
.blogokulu-404-box {
  background:#FFFFFF;
  width:98%;
  margin:10px 0px;
  padding:20px 10px;
  border:1px solid #ddd;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  box-shadow: 5px 5px 5px #CCCCCC;
}
</style>
</b:if>

Yukarıda kodlar içerisinde kırmızı renkle verdiğimiz #FFFFFF renk kodunu değiştirip, Blogger 404 sayfa bulunamadı sayfanızın arka plan rengini değiştirebilirsiniz.(HTML renk kodları için Tıklayınız)
 6-CSS kodumuzu ekledikten sonra Şablonu Kaydet butonuna tıklıyoruz ve çıkıyoruz.

Yukarıda anlattığımız 6 basamaklı işlme sonunda özelleşmiş bir blogger 404 Sayfa bulunamadı (Page Not Found) sayfamız olacak.

Sizde 404 Sayfa bulunamadı sayfanızı test etmek istiyorsanız aşağıdaki gibi site adresiniz sonuna abuksubuk şeyler yazıp deneyebilirsiniz.
http://www.siteadresiniz/ıvırzıvır
http://www.siteadresiniz/abafadffee gibi 🙂