Skip to main content

Cara Mudah Membuat Widget Recent Post Simpel di Blog

Cara Mudah Membuat Widget Recent Post Simpel di Blog - Hallo sahabat Gadgetplus, Pada Artikel yang anda baca kali ini dengan judul Cara Mudah Membuat Widget Recent Post Simpel di Blog, kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan Artikel Blogger, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.

Judul : Cara Mudah Membuat Widget Recent Post Simpel di Blog
link : Cara Mudah Membuat Widget Recent Post Simpel di Blog

Baca juga


Cara Mudah Membuat Widget Recent Post Simpel di Blog

Cara Mudah Membuat Widget Artikel Terbaru Simpel di Blog, Widget recent post atau biasa disebut Widget Artikel Terbaru adalah salah satu widget yang wajib dipasang pada sebuah blog, widget ini menampilkan artikel-artikel yang terakhir dipublikasikan.

Oleh karenanya dengan dipasangnya widget Recent Post dapat sekaligus mempromosikan artikel yang baru dipublikasikan, sehingga lebih cepat mendapatkan views.

Pada kesempatan kali ini saya akan berbagi cara membuat widget recent post simple dan keren, pada widget recent post ini hanya menampilkan judul artikel dan ditambah numbering yang terletak di sebelah kiri membuat widget recent post ini terlihat keren.

Sobat dapat melihat demonya terelbih dahulu di bawah ini, atau juga lihat widget recent-post yang akan di Gunakan di Sidebar.


Bagi yang tertarik langsung saja ke tutorialnya, yuk simak Cara Mudah Membuat Widget Recent Post Simpel di Blog di bawah ini.

Membuat Widget Recent Post Simpel

Pertama silahkan Login ke Blogger sobat, kemudian pilih Menu Tata Letak, lalu tambahkan Gadget di bagian Sidebar.

Pilih HTML/Javascript, kemudian paste kode di bawah ini ke dalam widget
<style>
/* Artikel Terbaru by Riswan.net*/
#recent-post {background:#1565c0;border-radius:0px}
#recent-post h2,#recent-post h3{background:#ffce41!important;border-radius:0}
#recent-post a:link, #recent-post a:visited{font-weight:normal}
#recent-post ul{width:100%;padding:0 0 10px}
#recent-post ul li {margin:0 !important;padding:8px 8px 8px 42px !important;position:relative;counter-increment:num;border-bottom:1px dotted #31c067 !important}
#recent-post ul li a {font-weight:normal !important;color:#fff !important;letter-spacing:0.5px;text-decoration:none;transition: all 0.3s ease-out 0s !important;line-height:1.4em !important;padding-right:8px !important}
#recent-post ul li a:hover {color:#ffce41 !important;}#recent-post ul li:before,#recent-post ul li .item-title a{font-weight:300;font-size:12px;color:inherit;text-decoration:none}
#recent-post ul li:before{content:counter(num);display:block;position:absolute;font-size:20px !important;top:9px;left:10px;font-weight:bold !important;font-style:italic;color:#ffce41 !important}
#recent-post{margin:0 auto}
#recent-post ul li:last-child{border-bottom:none !important}
</style>
<div id='recent-post'>
<ul id="riswannet"></ul>
</div>
<script>
//<![CDATA[
// Atk Tbr by Riswan.net
var homePage = "https://www.riswan.net/",
numPosts = 10;
function recentPosts(a){if(document.getElementById("riswannet")){var e=a.feed.entry,title,link,content="",ct=document.getElementById("riswannet");for(var i=0;i<numPosts;i++){for(var j=0;j<numPosts;j++){if(e[i].link[j].rel=="alternate"){link=e[i].link[j].href;break}}var title=e[i].title.$t;content+='<li class="riswannet"><a href="'+link+'" title="'+title+'" target="_blank">'+title+'</a></li>'}ct.innerHTML=content}}var rcp=document.createElement('script');rcp.src=homePage+'/feeds/posts/summary?alt=json-in-script&orderby=published&max-results='+numPosts+'&callback=recentPosts';document.getElementsByTagName('head')[0].appendChild(rcp);
//]]>
</script>

Jangan lupa untuk merubah https://www.riswan.net dengan alamat situs sobat, sobat juga dapat merubah jumlah artikel yang tampil pada widget recent post ini dengan merubah value 10.

Apabila sudah selesai lansung Simpan, lalu silahkan cek hasilnya. Sampai sini sobat sudah berhasil memasang widget recent post simpel dan keren di blog, mudah bukan?

Baca Juga: Cara Membuat Slot Iklan Banner Keren di Blog

Demikianlah artikel mengenai Cara Mudah Membuat Widget Recent Post Simpel di Blog, semoga dengan tutorial blogging singkat ini semoga dapat membantu sobat dalam editing tampilan blog dan dapat meningkatkan peforma blog.


Demikianlah Artikel Cara Mudah Membuat Widget Recent Post Simpel di Blog

Mudah-mudahan tutorial Cara Mudah Membuat Widget Recent Post Simpel di Blog Kali ini, bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya. Dan jangan lupa share tutorial ini agar semakin berguna bagi orang banyak.

Anda sekarang membaca artikel Cara Mudah Membuat Widget Recent Post Simpel di Blog dengan alamat link https://www.gadgetplus.my.id/2018/11/cara-mudah-membuat-widget-recent-post_13.html
Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Buka Komentar
Tutup Komentar