Widget Recent Post atau Artikel Terbaru terdapat dua Jenis. yaitu yang pertama dengan memakai gambar atau Thumbnail dan yang kedua hanya judul saja. Kedua jenis Recent post ini sama saja, namun kalau anda menginginkan yang responsive atau fast Loading sanggup memakai yang judul saja. alasannya tidak memakai gambar widget ini sangat responsive.
Dan Kali ini aku akan membagikan Cara memasang widget artikel terbaru memakai Judul saja. yang akan menciptakan Loading Blog tidak terlalu berat serta sangat responsive. untuk tutorialnya sanggup anda ikuti dibawah ini.
Cara Memasang Artikel Terbaru Responsive di Blog
1. Pertama Silahkan Masuk Dasboard - Tata Letak - Tambahkan Gadget dan Pilih Menu HTML/Java Script
2. Kemudian Silahkan Judul Widget Bisa Recent Post, Artikel Terbaru atau Terserah anda. Selanjutnya pada kolom bawah silahkan Isi dengan Kode CSS dibawah ini.
<ul id="recent-posts"></ul>
<script>
//<![CDATA[
var homePage = "http://blogespada.blogspot.com/",
numPosts = 7;
function recentPosts(a){if(document.getElementById("recent-posts")){var e=a.feed.entry,title,link,content="",ct=document.getElementById("recent-posts");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="recent-posts"><strong><a href="'+link+'" title="Sekilas Info Trik Memasang Widget Artikel Terbaru Responsive di Blog" target="_blank">'+title+'</a></strong></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>
<script>
//<![CDATA[
var homePage = "http://blogespada.blogspot.com/",
numPosts = 7;
function recentPosts(a){if(document.getElementById("recent-posts")){var e=a.feed.entry,title,link,content="",ct=document.getElementById("recent-posts");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="recent-posts"><strong><a href="'+link+'" title="Sekilas Info Trik Memasang Widget Artikel Terbaru Responsive di Blog" target="_blank">'+title+'</a></strong></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>
Pengaturan
- Ganti var homePage: Dengan URL Blog anda
- Ganti numPosts: Dengan Jumlah Artikel yang ingin ditampilkan
3. Terakhir Tinggal Simpan dan Lihat Hasilnya.
Baca: Cara Memasang Random Post Responsive di Blog
Demikian Artikel Mengenai Cara Pasang Artikel Terbaru Responsive di Blog, Sekian Tutorial Blog yang sanggup aku bagikan dan Semoga Bermanfaat.
No comments:
Post a Comment