Memperkenalkan widget recent post dengan konsep preloader untuk menangani proses pemuatan halaman yang terlalu berat. Secara teknis, widget ini hanya akan memulai pemuatan konten setelah mencapai waktu yang telah ditentukan:
Pilih tata letak lalu pilih HTML/JavaScript, kemudian salin kode ini dan letakkan di dalam formulir :
<style type="text/css"> #dte_recent-post { margin:0 0; padding:0 0; font:normal 11px Arial,Sans-Serif; color:#333; margin:0 auto; min-height:100px; background:white url('http://reader-download.googlecode.com/svn/trunk/images/nivo-loading.gif') no-repeat 50% 50%; } #dte_recent-post li { list-style:none; margin:0 0; padding:7px 7px; background-color:white; border-bottom:1px solid #ddd; } #dte_recent-post li a img { float:left; margin:0 10px 0 0; padding:0 0; border:none; background:transparent; outline:none; } #dte_recent-post li a.title { display:block; font-size:12px; text-decoration:none; color:#1155CC; } #dte_recent-post li a.title:hover { text-decoration:underline; } #dte_recent-post li span.foot { clear:both; display:block; color:#ccc; margin-top:7px; font-size:10px; } </style> <ul id="dte_recent-post"></ul> <script type="text/javascript"> //<![CDATA[ var rp_homePage = "http://latitudu.blogspot.com", // Your blog homepage rp_numPosts = 5, // How many posts? rp_thumbWidth = 72, // Thumbnail width. Change to 0 if you want to disable the post thumbnail rp_numChars = 100, // Number of posts summary rp_sortByLabel = false, // Replace false with your specific label name to display posts by specific label // Example: rp_sortByLabel = "JQuery", to sort posts by label "JQuery" rp_noImage = "http://reader-download.googlecode.com/svn/trunk/images/meee-44x44.png", // A 'no-image' image rp_monthNames = [ "Januari", "Februari", "Maret", "April", "Mei", "Juni", "Juli", "Agustus", "September", "Oktober", "November", "Desember" ], rp_newTabLink = true, // If true, then all the widget links will automatically opens in new window/new tab rp_loadTimer = "onload"; // "onload" || time in milliseconds (e.g: 3000, 4000, ...) //]]> </script> <script type="text/javascript" src="http://reader-download.googlecode.com/svn/trunk/blogger-recent-post-with-preloader.js"></script>
Lalu Simpan, Selamat Mencoba...
Tidak ada komentar:
Posting Komentar
Kode yang panjang bisa menggunakan tag <i rel="pre">KODE PANJANG ANDA</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS ANDA DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS ANDA DI SINI...</i>