Merhaba @m.smhunlu ,

Sorunun çözümüne geçmeden önce, anahtar kelimeleri içeren etiketleri gönderine eklemeni rica ediyoruz. Detaylı bilgiye Türkçe Kullanım Rehberi üzerinden ulaşabilirsin. Soru'na geçelim.

Wix Sitelerine Yükleme Animasyonu Ekleme

Wix web sitelerine sayfa yüklenmeleri için animasyon eklemek mümkün. Bunun şimdilik 2 yolu bulunmaktadır.

• Wix Corvid kullanmak(uzun yol, hata oluşma ihtimali yüksek)

• Mobil sürüm için hoş geldin ekranı(kısa ve en basit yol)

Masaüstü sürümde sayfa geçişlerine ihtiyaç duyacağını sanmıyoruz, yükleme hızı fena değil ancak mobil sürüm şu an için tam bir facia olduğundan kullanıcıların en azından sıkılmalarını önlemek adına mobil tarayıcıda hoş geldin ekranı özelliğini kullanmak daha mantıklı olur.

Wix Corvid karmaşık yapısı ve hataları yüzünden sürekli takibe muhtaç bir sistem. Aşağıdaki kodun bir geliştiriciden alındığını ve bu sürede API'ın değişmiş olabileceğini unutma(yani çalışmama ihtimali var).

1) Mobil Tarayıcıda Hoş Geldin Ekranı Oluşturma

Tam rehbere İngilizce dilinde ulaşabilirsin. Kısaca;

1. Site editöründen mobil editöre giriş yap

2. Editörün sol kısmında yer alan araçlar kısmına tıkla

3. Hoş Geldin ekranına tıkla

4. Seçenekler kısmında kullanmak istediğin görseli seç(120x120 olmalı)

5. İşin bitince Tamam'a tıkla.

2) Wix Corvid ile Yükleme Ekranı Oluşturma

Uğraşmak istersen aşağıdaki kodu sitenin izleme araçlarındaki başlık etiketine ekle ve tüm sayfalar için izin ver. Senin URL'n kısmına kullanmak istediğin görselin ya da GIF'ın bağlantısını yapıştır(Daha önce sitene eklenmiş bir uzantı olmalı).

Ayrıca sitenin yüklenme hızına göre, aşağıdaki kodun yeniden düzenlenmesi de gerekmektedir.

<div id="preloader">
<div id="IMG-preloader">
</div>
</div>

<script type="text/javascript">
  (
 function() {
 var preload = document.getElementById("preloader");
 var isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
 var loading = 0;
 var id = setInterval(frame, 64);

 function frame() {
 if (loading == 60) {
          clearInterval(id);
         preload.style.display = "none";
        } else {
          loading = loading + 1;
 if (!isMobile) {
 if (loading == 10) {
              document.getElementById("preloader").classList.add('hidden');
              }
          } else if (isMobile)

          {
 if (loading == 14) {
              document.getElementById("preloader").classList.add('hidden');
                }
          }
        }
      }
    })();

</script>

<style>
  #preloader {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 999;
    overflow: visible;
    background: #fff;
    opacity: 1;
    transition: 2s opacity ease-in;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #preloader.hidden {
    opacity: 0;
  }
  #IMG-preloader {
    background: url('https://static.wixstatic.com/media/[görsel URL'si]) no-repeat center center;
    background-size:320px 320px;
    width: 320px;
    height: 320px;
    margin:0 auto;
  }
</style>