Penjualan Ulang Tahun Elemen

Nikmati diskon 60% untuk pembelian baru, pembaruan dan peningkatan.

00 Hari -hari
:
00 Jam
:
00 Menit
:
00 Detik

Beli sekarang

Cara Membuat Preloader Di WordPress Menggunakan Elementor

Muneeb Tutorial WordPress Nov 22, 2021

Preloader yang juga dikenal sebagai loader adalah animasi atau GIF sederhana atau kompleks yang terus berjalan di halaman saat konten halaman lainnya dimuat.

Sangat penting untuk membuat pengguna Anda terhibur untuk waktu singkat yang dibutuhkan situs web Anda untuk memuat konten. Ini tidak hanya membantu mempertahankan banyak pengguna tetapi juga memungkinkan untuk menciptakan kehadiran yang langgeng di benak pengguna. Dalam tutorial ini, kita akan memahami cara membuat Preloader menggunakan Elementor .

Cara Membuat Preloader Menggunakan Elementor

Elementor diisi dengan opsi yang memungkinkan Anda untuk mewakili situs web Anda pada tingkat yang sama sekali berbeda. Demikian pula, ini juga memungkinkan Anda membuat Preloader yang dengannya Anda dapat menangkap pengguna yang cepat terpental dari situs web Anda.

Untuk memulai, pastikan Anda membuat Preloader hanya untuk halaman yang benar-benar membutuhkan beberapa saat untuk memuat konten dan merupakan aspek penting dari situs web Anda.

Penawaran luar biasa

Ulang tahun ke -6 Elementor dengan diskon hingga 60%

Mulai sekarang

Setelah Anda memutuskan di halaman mana Anda akan menempatkan Preloader, temukan SVG atau GIF yang sesuai dengan situs web Anda dan halaman tersebut. Icons8 adalah sumber yang sangat terkenal untuk animasi Preloader.

Jika Anda tidak tahu cara mengimpor file Format SVG di Elementor, lanjutkan dan lihat tutorial kami.

Selanjutnya, ada dua cara untuk menggunakan Preloader di situs web Anda, baik dengan menggunakannya untuk halaman tertentu atau menggunakannya untuk seluruh situs web.

  • Jika Anda ingin menggunakan Preloader untuk seluruh situs web, buat bagian baru di Template Header .
  • Jika Anda ingin menggunakan Preloader untuk halaman tertentu, buat bagian baru di bagian atas halaman .

Sementara dalam kedua kasus ini, pastikan untuk mengubah pengaturan bagian ke No Gap .

Secara keseluruhan, ketika Anda selesai dengan pengaturan, buka tab Elemen di sebelah kiri layar Anda dan pilih HTML .

Di bidang HTML, tambahkan kode berikut sambil memastikan untuk mengubah URL Preloader dengan milik Anda.

>div class="loader" /divscript/scriptstyle/style

Pengkodean memiliki penjelasan komentar untuk pemula untuk membuat semacam perubahan jika diperlukan.

Terakhir, lanjutkan dan publikasikan Preloader Anda dan periksa apakah itu berfungsi dengan baik. Ini adalah bagaimana Anda dapat membuat Preloader dengan Elementor di situs WordPress Anda.

Kami berharap tutorial ini akan membantu Anda dalam mempertahankan pengguna situs web Anda dan juga membuatnya terlihat jauh lebih profesional. Itu saja dari kami untuk tutorial ini. Pastikan untuk bergabung dengan kami di Twitter dan Facebook kami untuk tetap update tentang konten kami.