Effect

By Gio Bastian At Saturday, September 02, 2023

Cara membuat Efek Loading Blog sederhana V1 di Blogger

By Gio Bastian At Saturday, September 02, 2023

Ada banyak cara untuk membuat tampilan blog atau websitemu terlihat menarik contohnya adalah dengan membuat efek loading blog sederhana ini. Memang secara umum kecepatan loading atau page speed merujuk pada seberapa cepat konten di suatu website dapat dimuat ketika diakses oleh browser yang digunakan user, loading speed menunjukkan berapa lama waktu yang diperlukan pengunjung untuk membuka sebuah halaman di blog kamu.

Perlu kamu perhatikan juga bahwa lama atau cepatnya loading blog atau website kadang kala berdampak pada banyaknya jumlah pengunjung. Lama waktu loading juga bisa dikurangi dengan mengurangi widget yang terpasang pada blog, atau menambahkan efek loading sebagai penarik perhatian pengunjung. Perlu juga diketahui bahwa loading suatu halaman blog dapat mempengaruhi persepsi pengunjung terhadap blog kamu.

Animasi Loading Blog

Efek Loading Blog Sederhana V1

Jika ada V1 tentu saja ada versi lainnya lagi, kamu dapat mencarinya di blog ini. Animasi efek loading blog ini akan muncul saat halaman blog kamu diload oleh browser atau juga akan muncul saat kamu berpindah halaman dari link satu ke link yang lain di blog kamu. Efek ini sering di pasang saat tidak terlalu memperdulikan kecepatan tapi lebih suka terkesan ke tampilan. Ok berikut cara membuatnya di Blogger.

Disini saya membagikan dua cara, yang pertama adalah memasangnya langsung kedalam template blog, dan yang kedua adalah menambahkannya sebagai widget blog. Oh yah sebelumnya juga admin pernah berbagi cara membuat template kosong juga tentang membuat menu navigasi dropd down dan cara membuat pricing table di Blogger. Ok sobat berikut cara membuatnya:

Cara Membuat Efek Animasi Loading Blog di Blogger

Cara yang pertama yaitu memasukannya ke dalam template Blog:

1. Di Blog Blogger 😀
2. Pilih menu Tema ➔ Edit HTML

Edit HTML Template

3. Di templatemu sebelumnya sudah ada kode external jQuery library, atau bisa gunakan jQuery di bawah ini (kode warna merah kalau sudah ada walau beda versi tidak perlu memasangnya lagi) dan letakan diatas kode </head> :

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script> <link href="https://cdn.rawgit.com/Brando07/seocips/Html/loading1.css" rel="stylesheet" type="text/css">

4. Selanjutnya letakan kode di bawah ini di atas </body> :

<script src="https://cdn.rawgit.com/Brando07/seocips/newbe/loading1.js"></script>

5. Letakan kode HTML di bawah ini dibawah <body> :

<div id="loadingHalaman"></div>

6. Save tema dan lihat hasilnya.

Cara ke dua menambahkannya sebagai widget

1. Di Blog kamu 😄
2. Pilih menu Tata Letak ➜ Tambahkan Gadget 👉 HTML/JavaScript

HTML / JavaScript

4. Masukan kode dibawah ini:

<link href="https://cdn.rawgit.com/Brando07/seocips/Html/loading1.css" rel="stylesheet" type="text/css"></link> <script src="https://cdn.rawgit.com/Brando07/seocips/newbe/loading1.js"></script> <div id="loadingHalaman"> </div>

5. Save.

Video

Kalau belum paham cara memasangnya bisa kamu simak video di bawah ini:

👉 LIHAT DEMO 👈

Selain ini masih banyak efek yang bisa digunakan untuk membuat tampilan blog lebih menarik, seperti memasang efek salju, efek gambar, efek daun berjatuhan, efek burung burung terbang dan saat ini adalah efek loading blog sederhana.

Sekian cara membuat efek animasi loading blog di Blogger, kamu bisa mencoba animasi-animasi loading blog lain yang admin bagikan nantinya. Terimakasih.

Gio Bastian at Saturday, September 02, 2023

By Gio Bastian At Wednesday, August 30, 2023

Cara Mudah Membuat Efek Salju Berjatuhan di Blog

By Gio Bastian At Wednesday, August 30, 2023

Membuat Efek Salju. Apakah kamu pernah berkunjung dan menemukan blog yang memasang efek salju ini? cara membuatnya ternyata mudah. Nah, Pada kesempatan ini sepeser.com akan berbagi bagaimana cara membuat efek salju berjatuhan di blog Blogger.

Ada banyak cara untuk membuat tampilan blog menjadi lebih menarik, seperti menambahkan widget, membuat navigasi yang menarik, menambahkan gambar dan memasang efek-efek ringan. Yah seperti memasang efek salju berjatuhan, efek daun berjatuhan, efek burung terbang dan masih banyak lagi efek-efek menarik lainnya.Oh yah, efek-efek ringan ini bisa kamu temukan loh di artikel lain di blog ini.

Mengunakan efek salju seperti ini di Blogger dulu sangat populer di kalangan Bloggers, banyak yang menggunakannya. Namun karena katanya memberatkan blog dan tidak jelas fungsinya apa, kalau blog bule jelas sih fungsinya untuk menambah suasana akhir tahun seperti musim dingin, sehingga saat ini sudah jarang yang menggunakannya.

Efek Salju

Efek Salju di Blog

Nah karena ini menjelang akhir tahun mungkin cocok untuk blog yang ingin meramaikan suasana, seolah-olah di blogmu juga ikut merasakan musim dingin. Cara memasangnya juga sangat mudah, kamu bisa menambahkannya ke widget blog, atau bisa juga memasukannya langsung kedalam template blog atau lewat Edit HTML.

Oh yah, di postingan sebelumnya juga admin telah berbagi tentang cara membuat template kosong buat kamu yang ingin latihan membuat template mulai dari nol dan cara membuat Sticky widget Facebook efek slide di Blogger. Nah bagi kamu yang ingin mencoba membuat efek salju ini kamu bisa menggunakan kode yang admin bagikan. Cara memasangnya seperti di bawah ini:

Cara 1: Memasang Efek Salju di Widget Blogger

1. Di Blogger pilih blog kamu
2. Pilih menu Tata Letak ➜ Tambahkan Gadget
3. Kemudian pilih widget HTML/JavaScript

Html/Javascript

4. Masukan kode di bawah ini:

<script type="text/javascript" src="https://raw.githack.com/Brando07/kompapa/main/efeksaljubeterbangan.js"></script>

5. Save.

Cara pertama admin pikir sudah cukup, namun jika kamu ingin mencoba cara yang kedua, kamu bisa mengikuti tutorial di bawah ini:

Cara 2: Memasang Efek Salju kedalam Template Blogger

1. Di Blogger
2. Pilih menu Tema 👉 kilik disamping SESUAIKAN 👉 Edit HTML

Edit HTML

3. Cari kode </head>
4. Copy kode di bawah ini tepat diatas kode </head>

<script type="text/javascript" src="https://raw.githack.com/Brando07/kompapa/main/efeksaljubeterbangan.js"></script>

5. Kemudian Save dan Lihat Tampilannya.

Sekarang kamu dapat mengeceknya apakah berhasi atau tidak dengan cara Lihat blog dan test apakah berhasil atau tidak.

Video Tutorial

👉 LIVE DEMO 👈

Mungkin saja kamu pemula dan baru dalam dunia blog jadi admin sediakan tutorialnya lewat video. Video di atas adalah contoh cara memasangnya di Blogger.

Gio Bastian at Wednesday, August 30, 2023

By Ndo Andre At Tuesday, August 29, 2023

Cara Membuat Efek Loading Blog Ringan V2 di Blogger

By Ndo Andre At Tuesday, August 29, 2023

Widget Efek Loading Blog Sederhana V2. Apakah sobat pernah menemukan blog yang menggunakan efek loading? ingin mencoba menggunakannya juga? Ok sobat, pada kesempatan ini sepeser.com akan berbagi cara membuat efek loading blog sederhana V2 setelah kemarin telah membagikan V1-nya.

Dalam menelusuri halaman blog di dunia maya, kecepatan blog salah satu menjadi hal utama yang perlu diperhatikan. Pengunjung membutuhkan halaman yang bisa diload cepat untuk mendapatkan informasi secepatnya. Semakin lama halaman blog atau website dimuat adapun jika waktu loading lama tanpa efek yang menarik biasanya membuat user kerap bosan dan meninggalkan halaman blog atau situs web tersebut.

Perlu kamu perhatikan bahwa lama atau cepatnya loading blog atau website berdampak pada pengunjung blog. Apabila waktu loading halaman blog atau website terlalu lama, maka mereka akan menilai kamu tidak serius dalam menjalankan blog kamu. Untuk itu, kamu bisa menambah efek loading blog agar proses akses informasi bagi user tidak membosankan tapi justru kelihatan menarik.

Efek loading v2

Efek Loading Blog Sederhana V2

Sebelumnya admin telah berbagi animasi loading blog sederhana V1 nah kesempatan ini juga admin akan berbagi animasi loading blog juga, animasi ini sederhana karna ringan saja, dibuat dengan css dan js yang singkat saja jadi ringan untuk blog.

Admin juga telah berbagi cara membuat animasi efek salju dan daun berjatuhan di blog, dan juga tentang cara membuat efek hover gambar berputar di blog. Ok lanjut, animasi loading ini selain akan muncul setelah pengunjung datang mampir ke blog kamu, juga muncul saat pengunjung berpindah halaman dari halaman yang satu ke halaman yang lain. Berikut cara membuatnya:

Cara Membuat Efek Loading Blog Sederhana V2 di Blogger

1. Di Blog kamu 😄
2. Pilih menu Tata Letak ➜ Tambahkan Gadget 👉 HTML/JavaScript

HTML / JavaScript

3. Masukan kode dibawah ini:

<link href="https://raw.githack.com/Brando07/sepeser.com/main/loadingv2.css" rel="stylesheet" type="text/css"></link> <script src="https://raw.githack.com/Brando07/sepeser.com/main/loading-www.sepeser.com.js"></script> <div id="loadingHalaman"> </div>

4. Save.

Video Tutorial + Demo

Kamu dapat mempercepat loading blog dengan mengurangi jumlah widget yang digunakan. Terlalu banyak widget dalam blog bisa mengurangi kecepatan loading halaman blog atau website kamu. Setiap kali suatu halaman dimuat, maka proses pemuatan akan menjadi semakin lama jika widget yang kamu pasang terlalu banyak.

Sekian tutorial membuat efek loading versi lainnya lagi disini, semoga bermanfaat.

Ndo Andre at Tuesday, August 29, 2023