Cara Membuat Recent Post Keren Seperti Blog Mastimon

Hi, selamat sore, artikel ini akan membawakan mengenai blogo Cara Membuat Recent Post Keren Seperti Blog Mastimon simak selengkapnya 

Written By Teamwork212 20 August 2019

")}relatedUrls.splice(0,relatedUrls.length),relatedTitles.splice(0,relatedTitles.length)} //]]>

TeamWork212 -  Cara Membuat Recent Post Keren Seperti Blog Mastimon. Widget recent post merupakan widget yang ada atas blog fungsinya untuk menampilkan postingan karangan terbaru atas blog. 

Sumber : mastimon.com

Widget  recent post biasanya di pasang atas bagian kanan atau atas sidebar blog, tapi tidak menjadi  suatu keharusan sih atas sisi kanan semua tercantel keinginan sobat. akibat tampilan ini membuat pengunjung blog atau visitor di blog sahabat ikhwan bisa melihat postingan terbaru, dan karangan yang baru dipublikasipun dapat langsung di baca

NOTE : Jangan terlalu memasang widget di blog akibat akan mengurangi kecepatan loading blog

Kali ini admin coba memberikan sedikit tutorial singkat tentang Cara Membuat Recent Post Keren Seperti Blog Mastimon. 

Kebanyakan para blogger pingin mengikuti jejak kesuksesan dari mas timon dan cara dan tips ngeblog dari mastimon.

Tidak lupUt lagi cara design template dari Mastimon.com semuanya pingin di ikuti.

cara menampilkan recent post bagaikan mastimon

#1. Sobat login dulu ke blogger.com

#2. Setelah itu sahabat ikhwan langsung ke dashboard blog faksi menu " Tema" akan datang faksi menu "Edit HTML".

#3. Copy semua asas CSS dibawah ini dan pastekan di dalam asas CSS asing di letakan dalam edit HTML. 

 /* Artikel Terbaru */

 .artikel-terbaru ul li

    border-bottom: 2px dotted $(label.border.color);

    padding-bottom: 8px;

    margin-bottom: 8px;

    font-weight: 500;



.list-label-widget-content ul li, .LinkList ul li, .PageList ul li

    border-bottom: 2px dotted $(label.border.color);

    padding-bottom: 5px;



.artikel-terbaru ul li:before, .list-label-widget-content ul li:before, .LinkList ul li:before, .PageList ul li:before

    content: "\f14b";

    font-family: FontAwesome;

    font-style: normal;

    font-weight: normal;

    text-decoration: inherit;

    margin-right: 6px;



.artikel-terbaru ul li:before

    content: "\f14b";



.list-label-widget-content ul li:before

    content: "\f07b";



.LinkList ul li:before

    content: "\f14c";



.PageList ul li:before

    content: "\f249";

#4. Sobat cari asas Blogger CSS didalam kotak edit HTML dengan cara copy tulisan Blogger CSS setelah itu tekan tombol keyboard laptop menurut bersamaan (Ctrl + f) maka akan muncul bercokol sahabat ikhwan pastekan semua asas diatas tadi, setelah itu faksi " Simpan "

#5.  Sobat kembali lagi ke menu dashboard blog, akan datang faksi menu " Tata Letak " ⟹ Tambahkan Gadget.

#6. Setelah itu cari" HTML / JavaScript " dan faksi tanda  +

#7. Pada kolom judul sahabat ikhwan catat ajha " Artikel Terbaru " dan setelah itu sahabat ikhwan advis asas HTML atas kotak dibawahnya. faksi Simpan.

<div class='artikel-terbaru'>

<script>

functionartikelterbaru(e)document.write("<ul>");for(var t=0;t<e.feed.entry.length;t++)for(var r=0;r<e.feed.entry[t].link.length&&"alternate"!=e.feed.entry[t].link[r].rel;r++);var n="<li><a href="+("'"+e.feed.entry[t].link[r].href+"'")+'">'+e.feed.entry[t].title.$t+"</a> </li>";document.write(n)document.write("</ul>")

</script>

<scriptsrc="/feeds/posts/summary/?max-results=10&alt=json-in-script&callback=artikelterbaru"></script>

</div>

Lihat gambar

 Gampangkan...mungkin sampai disini dulu tutorial singkat Cara Menampilkan Recent Post Keren Seperti Blog Mastimon.



Mungkin akan lebih enteng dan gampang andaikata sahabat ikhwan menggunakan template Viomagz buatan mas sugeng

Seorang pengangguran yang embuh mendapatkan penghasilan melalui kegiatan blogging

", numPosts: 8, titleLength: "auto", thumbnailWidth: 250, thumbnailHeight: 170, noImage: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheKwLszs3jYXFqdljD6zL0PJCZIgGi6J4sooVLoB_smjiuBvfmZcmo3syjLaqFuCGtczqpULcxT-CIoTStDu8S7PtEPQf67HO3i_IBV6bSrdnUfRJmZKpDtownFFueli0lXkUeSl6reshJ/w255-c-h170/no-image.png", containerId: "related-post-6888435082771274965", newTabLink: false, moreText: "Read More", widgetStyle: 3, callBack: function() };

begitulah detil perihal Cara Membuat Recent Post Keren Seperti Blog Mastimon semoga tulisan ini menambah wawasan salam

tulisan ini diposting pada label blogo, blog bus hantu, , tanggal 25-09-2019, di kutip dari https://teamwork212.blogspot.com/2019/08/cara-membuat-recent-post-keren-seperti-mastimon.html