Datalife Engine - Türkçe Destek ( DLE )

Sayfa arkaplanda yüklenirken, ön planda jQuery ile sayfalar arası geçiş efekti verebiliyoruz. Çok basit bir işlem.

Animasyonlar için şurayı inceleyebilirsiniz. Mesela şuradan yükleniyor yazıp GIF oluşturabilirsiniz.

1-) İlk olarak sitemize jQuery ekliyoruz. (Eğer önceden çağırmışsanız bu adımı es geçebilirsiniz.)

main.tpl aç ve /head üzerine ekle;

<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>

2-) Eklentiyi çağırıyoruz.

main.tpl aç ve {AJAX} bul, üzerine ekle;

<!-- Preloader -->
<div id="preloader">
    <div id="status">&nbsp;</div>
</div>
   <!-- Preloader -->
<script type="text/javascript">
    //<![CDATA[
        $(window).load(function() { // makes sure the whole site is loaded
            $('#status').fadeOut(); // will first fade out the loading animation
            $('#preloader').delay(350).fadeOut('slow'); // will fade out the white DIV that covers the website.
            $('body').delay(350).css({'overflow':'visible'});
        })
    //]]>
</script>

3-) Görselliğini ayarlıyoruz.

styles.css aç ve ekle;

/* Preloader */
#preloader {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#fff; /* sayfa yüklenirken gösterilen arkaplan rengimiz */
    z-index:99; /* efektin arkada kalmadığından emin oluyoruz */
}
#status {
    width:200px;
    height:200px;
    position:absolute;
    left:50%;
    top:50%;
    background-image:url(resimklasorumuz/yukleniyor.gif); /* burası yazının ilk başında bahsettiğimiz animasyonu çağırır */
    background-repeat:no-repeat;
    background-position:center;
    margin:-100px 0 0 -100px;
}

Yukarıda resimklasörumuz/yukleniyor.gif kısmına oluşturduğunuz GIF resmin yolunu girin.

Eklenti kurulumu tamamlandı, siteye CTRL+F5 yapın.