Cara Membuat Widget Postingan Terbaru Di Blog Blogspot Keren

0
318

Cara membuat widget Postingan Terbaru Di Blog

Cara membuat widget Postingan Terbaru Di Blog
Cara membuat widget Postingan Terbaru Di Blog – Ilustrasi

Cara membuat widget Postingan Terbaru Di Blog mungkin sebagian blogger yang menggunakan blogspot masih belum tahu atau kesulitan untuk menampilkan artikel yang baru di posting, karena memang secara default blogger tidak ada fitur tersedia untuk menampilkan recent posts pada blog kita, yang ada hanyalah fitur archive saja, tapi itu masih tidak begitu keren kalau menurut kami pribadi, padalnya terlalu blepotan dan gak secara spesifik untuk menampilkan postingan baru.

Cara membuat widget Postingan Terbaru Di Blog sebenarnya bukanlah hal yang sulit untuk bisa dilakukan oleh para pemilik blog dari blogger atau blogspot, apalagi sudah banyak para master coding yang dengan suka rela berbagi ilmu untuk memberikan solusi bagaimana Cara membuat widget Postingan Terbaru Di Blog dengan mudah, artinya kita hanya tinggal pakai saja tanpa harus membeli karena telah dibuatkan gratis.

Beragam model widget Artikel terbaru keren yang telah dibuatkan oleh para master coding, tinggal kita pilih mau pake yang model apa, hanya saja perlu diketahui oleh para pemilik blog pemula, jika ingin akses blog tidak lemot, maka jangan terlalu banyak menambahkan widget pada blog entah itu dengan alasan agar terlihat keren dan cantik, karena kebanyakan widget justru akan membuat blog sangat berat diakses.

Percuma juga punya blog dengan berbagai hiasan kalau susah di buka oleh pembaca, karena pada intinya, sebaik-baik blog adalah yang mudah diakses karena loadingnya ringan dan isinya bermanfaat.

Blog yang kita bikin di blogspot statusnya masih numpang di google, maka, jangan sampai kita kena teguran, sudah numpang malah nambah berat hosting google, karena blog terlalu dibuat aneh-aneh dengan hiasan yang sebenarnya gak terlalu ada manfaatnya.

Kembali ke pembahasan Cara membuat widget Postingan Terbaru Di Blog dari blogspot, untuk bisa menampilkan widget recent posts kita hanya memerlukan beberapa code script untuk memanggil fungsi tersebut agar artikel terbaru bisa tampil di bagian widget postingan terbaru yang telah kita buat khusus.

  • Contoh tampilan Widget Recent Post Simple tapi tetap keren, seperti pada blog bangtohir yang lain, bisa kamu lihat Demonya Disini

Adapun Cara membuat widget Postingan Terbaru Di Blog sebagai berikut:

Langkah Pertama: Login Ke Blogger seperti biasanya

Langkah kedua: Pilih “Tata Letak” / “Layout

Langkah ketiga: Tambahkan “Widget baru” ( Add a Widget) – Pilih “HTML/JavaScript“.

Langkah Keempat: Copy Paste Kode Dibawah Ini kedalam Kolom baru tadi:

<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>

<script type=”text/javascript”>var numposts = 9;var showpostdate = false;var

showpostsummary = false;var numchars = 0;var standardstyling = true;</script>
<script type=”text/javascript” src=”https://domainkamu.co.id/feeds/posts/default?

orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts”></script>

Keterangan yang harus di edit pada Kode diatas:

*** tulisan berwarna Merah (https://domainkamu.co.id/) ganti dengan url blog kamu. tanda (/) harus ada satu.

*** Angka sembilan berwarna biru bisa diganti sesuai kebutuhan mau menampilkan berapa judul di widget artikel terbaru pada blog kamu.

Tambahan: Kode diatas mungkin bagi kamu kurang bagus hasil tampilannya di blog, jika kamu ingin membuatnya lebih rapi. maka tambahkan kode berikut kedalam HTML template kamu:

.sidebar li {
margin: 8px 0;
padding: 0 0 5px;
border-bottom: 1px solid #4169E1;
list-style: none;
}

Note: yang berwarna merah untuk mengganti warna garis pemisah antar judul. Kalau gak diubah juga gak apa-apa, karena itu sudah bangtohir ubah menggunakan warna biru.

Cara Memasukan Kode tambahan diatas kedalam kode HTML Template blog:

  • Login ke blogger atau blogspot kamu
  • Pilih Template – Klik Edit HTML
  • Cari bagian kode “/* SIDEBAR WRAPPER */” kalau sudah ketemu cari lagi kode ” .sidebar li 

Untuk memdahkan kamu menemukan kode tersebut, cukup ketikan di keyboard : CTRL+F dan masukan ” .sidebar li ” ke kolom seacrh. seperti pada gambar berikut:

Widget Recent Post Blog

  • kalau sudah ketemu, silahkan ganti dengan kode dibawah ini.

.sidebar li {
margin: 8px 0;
padding: 0 0 5px;
border-bottom: 1px solid #4169E1;
list-style: none;
}

  • Setelah ditambahkan, Klik SAVE TEMPALET / SIMPAN dan lihat hasilnya.

Sampai disini sudah selesai langkah cara membuat widget postingan terbaru di blog kamu dan tinggal update artikel baru terus agar selalu terlihat ada postingan baru di blog kamu.

** Jika mengalami kendala terkait Cara membuat widget Postingan Terbaru Di Blog kamu karena permasalahan kode gak berfungsi, segera beritahu kami agar dicarikan solusinya.

Baca Juga: 3 Cara Membuat Kotak Komentar Facebook di blog blogspot

LEAVE A REPLY