Sebelum Kita Mulai, Lebih Baik Ucapkan Bismillah Terlebih Dahulu, Jika Sudah...
Langsung Saja Gas Kan...
Pertama Silahkan Edit Pada Tema HTML
Sekarang Cari ]]></b:skin> Taruh Script Berikut Sebelum ]]></b:skin>
/* Preloader Animation In Blogger */
.preloader {
position: fixed;
width: 100%;
height: 100vh;
background: #0f0f0f;
left: 0;
top: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
transition: all 400ms;
z-index: 2000;
}
.preloader.hide {
opacity: 0;
pointer-events: none;
}
.preloader .preloader-text {
color: #838383;
text-transform: uppercase;
letter-spacing: 8px;
font-size: 15px;
}
.preloader .dots-container {
display: flex;
margin-bottom: 48px;
}
.preloader .dot {
background: red;
width: 20px;
height: 20px;
border-radius: 50%;
margin: 0 5px;
}
.preloader .dot.red {
background: #ef476f;
animation: bounce 1000ms infinite;
}
.preloader .dot.green {
background: #06d6a0;
animation: bounce 1000ms infinite;
animation-delay: 200ms;
}
.preloader .dot.yellow {
background: #ffd166;
animation: bounce 1000ms infinite;
animation-delay: 400ms;
}
@keyframes bounce {
50% {
transform: translateY(16px);
}
100% {
transform: translateY(0);
}
}
Jika Sudah...
Cari </body> Lalu Paste Code Berikut Diatasnya </body>
<div class="preloader">
<div class="dots-container">
<div class="dot red"></div>
<div class="dot green"></div>
<div class="dot yellow"></div>
</div>
<div class="preloader-text">
Loading...
</div>
</div>
<script>
//<![CDATA[
const preloader = document.querySelector(".preloader");
const preloaderDuration = 500;
const hidePreloader = () => {
setTimeout(() => {
preloader.classList.add("hide");
}, preloaderDuration);
}
window.addEventListener("load", hidePreloader);
//]]>
</script>
Tinggal Save Dan Lihat Hasilnya :D
Tulisan Dapat Kamu Ubah dengan cara tekan CTRL + F dan Ketik <center><p>Loading...</p></center>
copypaste aja <center><p>Loading...</p></center> Dan Rubah Tulisan Loading Sesuai Yang Kamu Inginkan
Itu Saja Tutorial Dari Saya Terimakasih, Dan Sampai Ketemu Lagi Di Tutorial Selanjutnya (kalo ada lagi :v)
Thanks To LeaF Sebagai Penulis Konten Ini
Dan Di Sunting Ulang Oleh Rizuku
────────────────────
Yuk Support Kami Dengan Cara Berdonasi