Trik Terbaru Membuat Recent Post Unik di Blogger

Trik Terbaru Membuat Recent Post Unik di Blogger - Setiap tutorial Blog pada saat ini sangat membantu sekali terutama untuk pemula yang mulai menyukai dunia Blogger. Terlebih banyak Tutorial SEO Friendly yang memanjakan pembacanya. Seperti halnya Tutorial Membuat Recent Post, Menulis Artikel SEO Friendly, SEO Friendly Images, Template SEO Friendly dan masih banyak lagi SEO Friendly lainnya. Sebelumnya kita cari tahu dulu tentang apa itu SEO Friendly?.

OK gan kali ini saya akan sedikit menjelaskan Arti dari SEO Friendly ini khusus buat yang belum tahu kepastiannya nya ya hee. Ada dua kata SEO dan Friendly Ok untuk arti dari SEO merupakan singkatan dari search engine optimization. Yaitu salah satu teknik yang digunakan dan diterapkan pada blog, maka hasilnya blog akan lebih mudah dan cepat terindeks di mesin pencarian.

Bahkan kalau diterapkan dengan benar dan tepat, hasilnya tentu menempati halaman teratas. Dan di urutan pertama di Search Engine Result Page. Arti kata Friendly yang dimaksud adalah ramah dan baik terhadap search engine. Jadi pada intinya SEO dan Friendly tidak dapat di pisahkan satu sama lainnya saling melengkapi dan membuat blog anda lebih baik tentunya.

Ok kali ini saya akan membagikan tutorial simple membuat Recent Post unik di blogger. Cara berikut sangat simple gan anda nanti saya akan kasih link download yang berisikan HTML/JavaScript. JavaScript tersebut bisa anda langsung pasang di Blog sobat jadi anda sebaiknya siapkan saja blogger seboat untuk nanti percobaannya.

Berikut Tutorial simple Membuat Recent Post unik di blog anda
Sebelum anda masuk di pembahasan lengkapnya terlebih dahulu mengetahui tentang Recent Post berikut. Recent post merupakan salah satu widget yang menampilkan artikel terbaru pada sebuah blog. Pada dasarnya blogspot tidak memiliki widget recent post bawaan. Jadi untuk anda yang ingin menampilkan artikel terbaru di blog, Anda perlu menambahkan widget recent post secara manual. Agar recent post bisa muncul di blogspot Anda wajib memasang widget tersebut.

Ada dua Cara Untuk Menampilkan Recent Post di dalam Blog Anda
Ada dua cara untuk membuat recent post, yang pertama anda bisa membuatnya langsung yaitu dengan Gadget Feed dan yang terakhir menggunakan code script. Yang dapat membedakan hanyalah dari segi tampilan yang menggunakan code script lebih unik dan untuk recent post Feed tampilannya sederhana. Untuk lebih lengkapnya simak tutorialnya di bawah ini sudah saya bahas mulai dari recent post feed hingga yang menggunakan code script.

1# Tutorial simple membuat Recent post dengan Gadget Feed

1. Pertama yang mesti anda lakukan adalah masuk ke akun google, dan masuk di situs blogger.com.
2. Setelah masuk di halaman blog anda selanjutnya anda klik bagian tata letak Blog.
3. Lalu klik tambahkan Gadget disini anda cari Gadget Feed untuk membuat recent post anda.
4. Setelah anda menemukannya anda klik dan isikan link blogger anda.
5. Untuk pemasangan link bisa anda inputkan di bagian URL Feed klik lanjutkan untuk masuk di halaman selanjutnya.

Untuk konfigurasi Feed anda tentukan mulai dari judul dan jumlah halaman yang akan di tampilkan, di halaman konfigurasi terserah anda mau atur sesuai keinginan anda. Setelah konfigurasi feed selesai langkah terakhir anda klik simpan untuk melihatnya bisa anda masuk di blog sobat dan lihat hasilnya recent feed sudah tampil.

Anda bisa melihat post terbaru anda di halaman recent post ini semua artikel akan tersusun sesuai jadwal tayang artikel anda.

2#Tutorial simple Membuat Recent Post dengan Code Script
Untuk cara yang kedua ini sebenarnya sangat mudah dan simple anda gunakan, disini anda dapat memilih salah satu script yang anda sukai dan pastinya membuat tampilan recent post anda menjadi unik. Untuk cara memasangnya anda tinggal masuk di halaman tambahkan Gadget selanjutnya anda klik di bagian HTML/JavaScript. Disini anda tinggal inputkan mulai dari judul dan isi Scriptnya, untuk script dapat anda isi dengan Script code di bawah ini berikut codenya.

Start of code : 

<script type="text/javascript">

 function showlatestpostswiththumbs(t){document.write('<ul class="recent-posts-container">');for(var e=0;e<posts_no;e++){var r,n=t.feed.entry[e],i=n.title.$t;if(e==t.feed.entry.length)break;for(var o=0;o<n.link.length;o++){if("replies"==n.link[o].rel&&"text/html"==n.link[o].type)var l=n.link[o].title,m=n.link[o].href;if("alternate"==n.link[o].rel){r=n.link[o].href;break}}var u;try{u=n.media$thumbnail.url}catch(h){s=n.content.$t,a=s.indexOf("<img"),b=s.indexOf('src="',a),c=s.indexOf('"',b+5),d=s.substr(b+5,c-b-5),u=-1!=a&&-1!=b&&-1!=c&&""!=d?d:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSsR9kKyefrV9YeAbyyY2yFQmLygOSeR2MPnQQS4BCop5bUq1THQ3W2JT4qz991sTsZcmk3KuPUAUZai_Tk11o0Cc3lRZAhIvYvDUpA04xuIdP0d42i1WDJudvyjYInNfjHiSltZ8yMesk/s1600/no-thumb.png"}var p=n.published.$t,f=p.substring(0,4),g=p.substring(5,7),v=p.substring(8,10),w=new Array;if(w[1]="Jan",w[2]="Feb",w[3]="Mar",w[4]="Apr",w[5]="May",w[6]="Jun",w[7]="Jul",w[8]="Aug",w[9]="Sep",w[10]="Oct",w[11]="Nov",w[12]="Dec",document.write('<li class="recent-posts-list">'),1==showpoststhumbs&&document.write('<a href="'+r+'"><img class="recent-post-thumb" src="'+u+'"/></a>'),document.write('<div class="recent-post-title"><a href="'+r+'" target ="_top">'+i+"</a></div>"),"content"in n)var A=n.content.$t;else if("summary"in n)var A=n.summary.$t;else var A="";var k=/<\S[^>]*>/g;if(A=A.replace(k,""),1==post_summary)if(A.length<summary_chars)document.write(A);else{A=A.substring(0,summary_chars);var y=A.lastIndexOf(" ");A=A.substring(0,y),document.write(A+"...")}var _="",$=0;document.write('<br><div class="recent-posts-details">'),1==posts_date&&(_=_+w[parseInt(g,10)]+" "+v+" "+f,$=1),1==readmorelink&&(1==$&&(_+=" | "),_=_+'<a href="'+r+'" class="url" target ="_top">Read more</a>',$=1),1==showcommentslink&&(1==$&&(_+=" <br> "),"1 Comments"==l&&(l="1 Comment"),"0 Comments"==l&&(l="No Comments"),l='<a href="'+m+'" target ="_top">'+l+"</a>",_+=l,$=1),document.write(_),document.write("</div>"),document.write("</li>")}document.write("</ul>")}

  </script>

  <script type="text/javascript">

 var posts_no = 5;

 var showpoststhumbs = true;

 var readmorelink = true;

 var showcommentslink = false;

 var posts_date = true;

  var post_summary = true;

  var summary_chars = 70;

 </script>

 <script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script>

 <a style="font-size: 9px; color: #CECECE; margin-top: 10px;" href="https://honaseo.blogspot.com/" rel="nofollow">Recent Posts Widget</a>

  <noscript>Your browser does not support JavaScript!</noscript>

 <link href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed' rel='stylesheet' type='text/css' />

  <style type="text/css">

 img.recent-post-thumb{width:50px;height:50px;float:right;margin:5px -5px 0px 0px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;padding:3px;background: #fff}

  ul.recent-posts-container {list-style-type: none; background: #fff;padding: 0px;font:12px 'Ubuntu Condensed', sans-serif;margin: 5px 0px 5px 0px;}

  ul.recent-posts-container li:nth-child(1n+0) {background: #F49A9A; width: 100%}

  ul.recent-posts-container li:nth-child(2n+0) {background: #FCD092; width: 95%}

  ul.recent-posts-container li:nth-child(3n+0) {background: #FFF59E; width: 90%;}

  ul.recent-posts-container li:nth-child(4n+0) {background: #E1EFA0; width: 85%;}

  ul.recent-posts-container li:nth-child(5n+0) {background: #B1DAEF; width: 80%;}

 ul.recent-posts-container li {padding:5px 10px;list-style-type: none; margin: 0 0 -5px; color: #777;}

  .recent-posts-container a { text-decoration:none; }

  .recent-posts-container a:hover { color: #222;}

  .post-date {color:#e0c0c6; font-size: 11px; }

  .recent-post-title a {font-size: 14px;color: #444; font-weight: bold;}

  .recent-post-title {padding: 6px 0px;}

  .recent-posts-details a{ color: #222;}

  .recent-posts-deta

ils {padding: 5px 0px 5px; }

  </style>

End Of Code

Untuk anda tinggal copy paste code script di atas dan anda bisa ganti di bagian link yang berwarna orange dengan link blog milik anda. Untuk anda yang ingin menampilkan hanya salah satu recent post yang tampil anda harus mengisi link lengkap artikel yang sudah anda tayangkan.

Begitu mudah bukan memasang recent post di blog anda dengan code script, terakhir anda simpan kodenya dengan klik simpan lihat hasilnya 

Kesimpulan :
Membuat Recent Post di blogger sangat mudah dan bisa dilakukan oleh pemula sekalipun, adapun caranya yaitu ada dua cara untuk menampilkan Recent Post di blog anda. Antara lain adalah dengan cara otomatis tanpa code script dengan Gaget Feed langsung di dashboard blogger anda. dan yang kedua dengan menggunakan HTML/Java Script yang bisa anda pasang langsung di blog anda tanpa ribet dan hanya perlu mengedit sedikit.

Untuk pemula bisa anda lakukan sendiri, karena saya juga sudah mencobanya dan hasilnya sudah kelihatan sangat mudah anda terapkan di blog anda. Salah satu fungsi utama membuat recent post adalah untuk menampilkan postingan artikel anda yang baru saja di tayangkan. Umumnya setiap template kalau anda membelinya terkadang sudah di pasang recent post tetapi untuk anda yang ingin mencoba dari awal bisa menerapkan tutorial simple membuat recent post ini.

Jadi buat agan-agan bisa di terapkan langsung ke blog sobat yang belum ada recent post nya, karena saya disini sudah membahas recent post yang unik untuk memperindah tampilan blog anda secara maksimal. Ok semoga bermanfaat untuk pembahasan tutorial simple membuat recent post unik ini, terimakasih.

Share :