Cara Membuat Recent Post Super Fast Load Tanpa Gambar Valid HTML 5 di Blogspot

Cara Menambahkan Widget Recent Post Tanpa Gambar Valid HTML 5 di Blogspot - Template blog yang kita gunakan Bukan hanya harus responsive tetapi juga valid HTML 5. Menurut pakar, katanya jika template yang kita gunakan valid Html 5 maka artikel kita akan mudah dikenali oleh mesin pencari. Itu artinya jika artikel kita mudah dikenali maka besar kemungkinan artikel kita dapat di indeks google dengan cepat.

Saya tidak tahu pasti, apakah semua itu benar atau tidaknya, namun bagi saya yang terpenting adalah template tersebut tidak eror, loadingnya cepat, responsive dan tampilannya sederhana. Namun jika Anda telah menggunakan template yang valid Html 5, maka untuk mensinergikan widget - widgetnya agar tidak memberatkan loading, gunakanlah yang valid Html 5.

Seperti widget recent post yang akan saya bagikan ini, telah valid Html. Sehingga tidak memberatkan loading blog. Anda dapat Cek Loading blog sebelum dan sesudah menggunakan widget ini.

Langkah - langkah untuk memasang widget Recent Post Valid Html 5:

1. Login ke Dashboard Blogger Anda
2. Klik Tata Letak => Tambah Gadget
3. Pilih HTML/ JavaScript, Masukan kode dibawah ini lalu simpan. Dengan begitu Anda telah menambahkan widget recent post pada template Anda.

<script type="text/javascript">
function showrecentposts(json){for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}posttitle=posttitle.link(posturl);if(standardstyling)document.write('<li>');document.write(posttitle)}if(standardstyling)document.write('</li>')}
</script><ul>
<script type="text/javascript">var numposts = 10;var standardstyling = true;</script><script type="text/javascript" src="http://www.adsenstock.com.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts"></script></ul>

KETERANGAN:

• warna merah dengan alamat Url blog Anda
• Nomor 10 merupakan jumlah recent post yang ingin Anda tampilkan, silahkan diganti sesuai keinginan Anda.

Selanjutnya, agar tampilan blog Anda rapi dan valid Html 5, masukan kode css dibawah ini pada template Anda. Berikut kodenya ;

/* Widget Recent Post */
#sidebar3 h4, #sidebar3 h3, #sidebar3 h2{background:#049b16;color:#fff;text-transform:capitalize;font-family:Roboto, Sans-Serif;font-size:100%;font-weight:700;position:relative;padding:12px 0 15px;text-align:center;margin:0}
#sidebar3 .widget-content{background:#fff;padding:0 0 0 10px}
#sidebar3 a:link, #sidebar3 a:visited{font-weight:normal}
#sidebar3 ul li {margin:0 5px 0 0 !important;padding:6px 0 !important;position:relative;border-bottom:1px dashed #d5d5d5 !important}
#sidebar3 ul li:last-child{border:none !important}
#sidebar3 ul li a {font-size:13px !important;font-weight:normal !important;color:#333 !important;text-decoration:none;transition: all 0.3s ease-out 0s !important;line-height:1.4em !important}
#sidebar3 ul li a:hover {color:#6aba82 !important;}

Dengan begitu, widget recent post telah ada pada homepage Anda, namun jika loading blog Anda terasa lebih berat. Pindahkan widget recent post hanya pada halaman postingan saja, dengan cara tambahkan kode berikut seperti gambar di bawah ini, yaitu  <b:if cond='data:blog.pageType == &quot;item&quot;'>.................</b:if>

Sekarang, loading blog Anda telah jauh lebih cepat.

Demikianlah cara menambahkan widget recent post tanpa gambar valid html 5 di Blogspot semoga artikel ini bermanfaat, jika ada kendala atau ada yang mau enambahkan silahkan isikan di kolom komentar.

Share this post