Membuat loading komentar dengan CSS

Komentar
Pernah melihat efek loading form komentar di blogger saat berkunjung ke blog lain? apakah sobat belum memasang ini di blog dan ingin tahu caranya, ikuti saja langkah di bawah ini.


selain menambah kesan apik, juga memberi keunikan tersendiri untuk tampilan blog. dan ini tidak berpengaruh kepada loading blog menjadi berat. langsung saja.

1. Login ke Blogger
2. Buka editor template
3. Simpan kode ini di atas </style> atau ]]></b:skin>

#comment-editor {background:transparent url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvymP65scdCbfwESZLWC2aI-ZjbE8x_fRzOynd03kzEbWYAV3Gy8qHuUnVEgKGUf3nlEv4zD_KqN5rS6YnlNkVZVyXlQEGfloLUQy6yvIMV2WvHIFE8_3ZGPscLuQrwqwe423zIeYQ8oeE/s1600/ajax-loader+(2).gif') no-repeat 50% 30%}

4. Simpan Template.

Cara di atas hanya memanipulasi background form komentar saja dengan mengisi sebuah backgroun animasi, sebelum memunculkan iframe. Apabila sobat ingin mengganti gaya dan bentuk tampilan efek loadingnya, silahkan kunjungi Web pembuat efek loading untun membuat efek lain yang berbeda.

Bagi sahabat yang membutuhkan gambar efek loading, dibawah ini saya ada 6 website Ajax loading generator online. Untuk mengunjungi klik saja linknya. sobat hanya perlu efeck gambar, dan bisa di ciptakan di situs - situs berikut ini

1. Preloaders.net
2. Web Script Lab
3. Chimply
4. Load Info
5. Xeosoft
6. Ajaxload.info

setelah anda memiliki animasi loading ganti saja

link gambar https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvymP65scdCbfwESZLWC2aI-ZjbE8x_fRzOynd03kzEbWYAV3Gy8qHuUnVEgKGUf3nlEv4zD_KqN5rS6YnlNkVZVyXlQEGfloLUQy6yvIMV2WvHIFE8_3ZGPscLuQrwqwe423zIeYQ8oeE/s1600/ajax-loader+(2).gif
dengan milik anda.

Semoga sukses...

Artikel Terkait

  • Membuat pesan formulir komentar dengan css
    Merubah tampilan dan gaya pesan untuk komentar di blogger agar terlihat lebih rapi dan mempunyai style tersendiri bukanlah hal yang sulit. trik ini terkadang berguna untuk membuat pengunjung lebih semangat berkomentar, anda ingin pesan form komentar blog anda bergaya seperti berikut ikuti panduan berikut ini... 1. Masuk Blogger. 2.Pilih Tem…
  • Komentar blogger threaded comment
    Sebelum melakukan installasi astikan Backup dulu template, untuk menghindari error pada installasi 1. Masuk ke Blogger 2. Klik Template --> Edit HTML, centang Expand Template Widget 3. Ganti semua kode <b:include data='post' name='threaded_comments'/> dengan <b:include data='post' name='comments'/>  apabila ti…
  • Modifikasi Alert Emoticon
    Saya telah membuat postingan Emoticon komentar otomatis namun pada postingan dahulu itu tidak ada modifikasi pemberitahuan pada saat emoticon tersebut di klik yang mana tampilannya masih menggunakan tampilan alert default. Demo Dan pada postingan saya kali ini saya akan membagikan cara modifikasi tampilan alertnya sesuka hati kita agar t…
  • Menandai komentar admin dengan css
    Buat sahabta blogger yang masih bertanya tanya tentang cara membuat tanda pada komentar admin untuk mempermudah pengunjung mencari mana komentar admin kali ini saya beri trik dan caranya. blogger tidak memberikan ijin secara penuh untuk melakukan modifikasi penuh komentar admin, lalu bagaimana jika kita ingin membuat tampilan komentar yang ber…
  • Membanned spamer di komentar dengan jquery
    Kali ini saya ingin berbagi buat sobat yang udah males dan capek menghapus komentar para spammer, yang satu ini palinf buat suasana jadi males dan menjengkelkan bila hadir di komentar blog kita. jquery ini bisa sobat gunakan untuk menghapus dan membanned para spamer tersebut dengan menghilangkan isi komentar juga link profile mereka agar user …
  • Membuat ucapan terimakasih di bawah komentar
    Pagi sobat blogger lagi liburan buat posting hiasan untuk blogger, kali ini saya mau share cara dan trik untuk membuat pesan ucapan terimakasih di bawah kotak komentar.   Triknya cukup mudah tinggal menambahkan css dan sedikit kode html di template sobat, langsung aja berikut ini caranya Buka editor template blogger anda sperti bias…

Tidak ada komentar :


Link aktif dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">...KODE ANDA DI SINI...</i>
Untuk menyisipkan script, gunakan <i rel="pre">...KODE SCRIPT ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">...URL GAMBAR ANDA ...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">...JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">...CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <b>...TEKS ANDA...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>...TEKS ANDA...</i>

Konversi KodeOOT

Back to Top
Loading...