Ngalor Ngidul: Widget

Cara membuat Popular Post dengan Thumbnail Bentuk Grid/Gallery

Sabtu, Juni 16, 2012 Kelulut Klanceng 21

<div dir="ltr" style="text-align: left;" trbidi="on"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzz1ASQmJ4Uc8uZ9U3PpW4G5VnjIxuglmP19M2EBby8JdOK7_CzAbBhA1jhTIORnXb4EJs_hdcBSuKXRB8j1BSDtOSSaa_7lmYM4y-hGVKzohxzH9Y2tYnBCAnkzDhniJOrMfP3ouGeus/s1600/pop+sc.PNG" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img alt="Cara membuat Popular Post dengan Thumbnail Bentuk Grid/Gallery" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzz1ASQmJ4Uc8uZ9U3PpW4G5VnjIxuglmP19M2EBby8JdOK7_CzAbBhA1jhTIORnXb4EJs_hdcBSuKXRB8j1BSDtOSSaa_7lmYM4y-hGVKzohxzH9Y2tYnBCAnkzDhniJOrMfP3ouGeus/s320/pop+sc.PNG" title="Cara membuat Popular Post dengan Thumbnail Bentuk Grid/Gallery" width="313" /></a></div><div style="text-align: justify;">Setelah sebelumnya pernah membahas <i><a href="http://realfa84.blogspot.com/2012/01/cara-membuat-popular-post-dengan.html" target="_blank">Cara membuat Popular Post dengan Thumbnail Horizontal</a>, </i>kali ini kita akan mencoba memodifikasi Popular Post dengan Thumbnail Bentuk Grid atau Gallery. Keuntungan dari cara ini adalah kita bisa sedikit menghemat space atau ruang di blog.</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Sistem atau <strong>Cara membuat Popular Post dengan Thumbnail Bentuk Grid atau Gallery</strong> ini sebenarnya sama saja dengan dengan <i><a href="http://realfa84.blogspot.com/2012/01/cara-membuat-popular-post-dengan.html" target="_blank">Cara membuat Popular Post dengan Thumbnail Horizontal</a>. </i>Hanya saja pemasangannya tetap di sidebar. Atau bisa juga di footer yang telah di bagi menjadi 2 atau 3 kolom.</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Pada tutorial ini admin menggunakan sidebar dengan lebar 300px. Jika anda memiliki lebar sidebar yang berbeda, mungkin anda harus melakukan sedikit perubahan agar lebih serasi dengan template.</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Berikut ini adalah Langkah-langkah untuk <strong>Cara membuat Popular Post dengan Thumbnail Bentuk Grid atau Gallery</strong>:</div>1. Seperti biasa masuk kedashboard => Design => Edit Html.<br />
2. Cari kode ]]</b:skin><br />
3. Letakkan kode CSS dibawah ini di atasnya.<br />
<blockquote class="tr_bq">.sidebar .popular-posts ul li img:hover, .cross2 ul li img:hover {-moz-transform:scale(1.1) rotate(-0deg); -webkit-transform:scale(1.1) rotate(-0deg); -o-transform:scale(1.1) rotate(-0deg); -ms-transform:scale(1.1) rotate(-0deg); transform:scale(1.1) rotate(-0deg);filter:alpha(opacity=100);opacity:1;border-radius: 50%;}<br />
.sidebar .popular-posts ul{margin:0;padding:2px;}<br />
.PopularPosts .widget-content ul li {padding: .1em 0;}<br />
.sidebar .popular-posts ul li {margin: 0 3px;background:none;float:left;width:91px;list-style-type:none;border:none;line-height:0px;}<br />
.sidebar .popular-posts ul li img {-webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; transition:all 0.5s ease;width: 85px;height: 85px;opacity: 0.7;opacity:0.7;filter:alpha(opacity=70);background:#444; border:1px solid #191919; border-bottom:1px solid #666; border-right:1px solid #666;padding:4px;}<br />
.PopularPosts .item-thumbnail {margin: 0;}<br />
.sidebar .PopularPosts .item-title {display: none;}</blockquote>4. Save template.<br />
5. Kembali ke Dashboard => Design => Add Element.<br />
6. Pasang popular post bawaan blogger dibagian sidebar. Bagi yang telah memasangnya, settingan yang "harus" dilakukan adalah seperti gambar dibawah ini.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwFQoUdhHP1h9RZZmExCwCkaQpI1DNybJ-2KzENUKgpl8M82kl__4Iadvyppk6oHeO_age5HAA7JUb8uVKzrsGbBbGTO6p810Nx7T-hlCI4bLNZnJLRVNbX_8TzgcK99KirnaDTsvM2-c/s1600/popular+setting.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Cara membuat Popular Post dengan Thumbnail Bentuk Grid atau Gallery" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwFQoUdhHP1h9RZZmExCwCkaQpI1DNybJ-2KzENUKgpl8M82kl__4Iadvyppk6oHeO_age5HAA7JUb8uVKzrsGbBbGTO6p810Nx7T-hlCI4bLNZnJLRVNbX_8TzgcK99KirnaDTsvM2-c/s1600/popular+setting.PNG" title="Cara membuat Popular Post dengan Thumbnail Bentuk Grid atau Gallery" /></a></div><blockquote class="tr_bq">1. Hilangkan ceklist pada snippet.<br />
2. Atur jumlah postingan tampil menjadi 3, 6 atau 9.</blockquote></div>

Setelah sebelumnya pernah membahas Cara membuat Popular Post dengan Thumbnail Horizontal , kali ini kita akan mencoba memodifikasi Popular P...

Baca selengkapnya »

Cara Paling Cepat Memasang Facebook komentar di blogspot

Jumat, Juni 15, 2012 Kelulut Klanceng 12

<div dir="ltr" style="text-align: left;" trbidi="on"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQjFBxrz6DAf2OAKghbg2Vn5qbCe-OVqt-m9tnS_TwdrWEEeh0-YnfdIAR1HMEpqGIZFQ8K0gPUFNonyEqrKvxXBvtr6K1pESvsAAxOZkC4l6r8nWDIFyLXGcudyrO-vfkYBYlrC7utb4/s1600/facebook+coment.PNG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQjFBxrz6DAf2OAKghbg2Vn5qbCe-OVqt-m9tnS_TwdrWEEeh0-YnfdIAR1HMEpqGIZFQ8K0gPUFNonyEqrKvxXBvtr6K1pESvsAAxOZkC4l6r8nWDIFyLXGcudyrO-vfkYBYlrC7utb4/s1600/facebook+coment.PNG" /></a></div><br />
<br />
Hari demi hari perkembangan fitur diblogspot semakin mudah untuk di otak-atik. Beraneka ragam fitur tersebut di buat selain untuk mempercantik tampilan blog, sebagian juga memang mempunyai fungsi tertentu agar pengunjung yang hadir tidak hilang begitu saja.<br />
<br />
Salah satu fitur blogger yang semakin hari semakin berkurang adalah komentar-komentar dari pengunjung. Hal ini disebabkan orang lebih  suka berkomentar di situs-situs jejaring social seperti facebook. <br />
<br />
Nah, untuk mengatasi hal ini kita bisa menggunakan fitur komentar facebook dengan memasang widgetnya di blog kita. Cara pemasangannya sangatlah gampang. Kita cukup mengikuti langkah-langkahnya seperti dibawah ini.<br />
<br />
1. Masuk ke DASHBOARD => DESIGN => EDIT HTML. Kemudian centang Expand Widget Templates.<br />
2. Cari kode <i><span style="color: blue;"><b:includable id='status-message'></span></i><br />
3. Jika anda perhatikan, tepat diatasnya kita akan menemukan kode <i><span style="color: red;"></b:includable></span></i> tepat di atasnya.<br />
4. Copas kode dibawah ini dan letakkan di atas kode <i><span style="color: red;"></b:includable></span></i> tadi.<br />
<blockquote class="tr_bq"><b:if cond='data:blog.pageType == &quot;item&quot;'> <br />
<div id='fb-root'/><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:comments expr:href='data:post.url' num_posts='12' width='610'/> <br />
</b:if></blockquote>5. Simpan Template dan buka salah satu postingan di blog anda.<br />
<br />
Semoga Bermanfaat..!!!</div>

Blogging designe Tips n Trik Widget Cara Paling Cepat Memasang Facebook komentar di blogspot

Hari demi hari perkembangan fitur diblogspot semakin mudah untuk di otak-atik. Beraneka ragam fitur tersebut di buat selain untuk memperca...

Baca selengkapnya »

Sript Random post With thumbnail + Title + Comment + Post Time

Minggu, Juni 10, 2012 Kelulut Klanceng 4

<div dir="ltr" style="text-align: left;" trbidi="on"><div style="text-align: justify;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2GMNJcLh4bbq3ce0PhgwpVE4MNf4EZ5t_qud-4f7HSNgEbQl0kTpqrq4vEnPhC8NjBupPMQRhTQ40fmdgqGthNyz8exgAoOAJhFS-qVvSeLFimf-YRRC9vCMi0lUah32EwIQNLUHqp0o/s1600/rdp.PNG" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="270" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2GMNJcLh4bbq3ce0PhgwpVE4MNf4EZ5t_qud-4f7HSNgEbQl0kTpqrq4vEnPhC8NjBupPMQRhTQ40fmdgqGthNyz8exgAoOAJhFS-qVvSeLFimf-YRRC9vCMi0lUah32EwIQNLUHqp0o/s320/rdp.PNG" width="229" /></a><br />
Beberapa hari yang lalu, saya sudah sharen script random post with thumnail only. Pada kesempatan kali ini, Admin ngalor ngidul kembali ingin share script random post. Tapi script random post kali ini bukan hanya bisa menampilkan gambar saja. Tapi sekaligus bisa menampilkan gambar atau thumbnail, judul artikel, komentar dan juga hari penulisan postingan.<br />
<br />
Seperti yang di ketahui bersama, script ini sangat berguna bagi anda yang tidak ingin memasang banyak fitur di blog anda. Karena dengan memasang satu script ini saja sudah bisa menampilkan beragam postingan terdahulu. Dimana Script ini nantinya akan menampilkan daftar posting yang berbeda setiap kali halaman di refresh.</div><br />
Tanpa banyak basa-basi langsung saja copas scriptnya dibawah ini.<br />
<br />
<pre class="javascript" name="code"><script type="text/javaScript">
var rdp_numposts=7;
var rdp_snippet_length=60;
var rdp_info='yes';
var rdp_comment='Comment';
var rdp_disable='';
var rdp_current=[];
var rdp_total_posts=0;
var rdp_current=new Array(rdp_numposts);
function totalposts(json){
rdp_total_posts=json.feed.openSearch$totalResults.$t
}
document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalposts\"><\/script>');
function getvalue(){
for(var i=0;i<rdp_numposts;i++){
var found=false;
var rndValue=get_random();
for(var j=0;j<rdp_current.length;j++){
if(rdp_current[j]==rndValue){
found=true;break
}
};

if(found){i--}
else{
rdp_current[i]=rndValue
}
}
};
function get_random(){
var ranNum=1+Math.round(Math.random()*(rdp_total_posts-1));
return ranNum
};
</script>

if
(rdp_get_snippet.length<rdp_snippet_length){
var rdp_snippet=rdp_get_snippet
}
else{
rdp_get_snippet=rdp_get_snippet.substring(0,rdp_snippet_length);
var space=rdp_get_snippet.lastIndexOf(" ");
rdp_snippet=rdp_get_snippet.substring(0,space)+"…";};

for(var j=0;j<entry.link.length;j++){

if('thr$total'in entry){var rdp_commentsNum=entry.thr$total.$t+' '+rdp_comment
}

else{
rdp_commentsNum=rdp_disable
};

if(entry.link[j].rel=='alternate'){
var rdp_posturl=entry.link[j].href;if(y!=-1){
rdp_posturl=rdp_posturl+'?m=0'
}

var rdp_postdate=entry.published.$t;
if('media$thumbnail'in entry){
var rdp_thumb=entry.media$thumbnail.url
}
else{
rdp_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPVXJKIl3DRjRdDXMaNaInPm18JAn2MM498HfjPkCCn1YbEcpe6dOAkzvmL5pdgLUM9j6fvtZWOpVijmzKPGqxcB52JnZBRZNzcrmqwIuEizatpXdJuBGOXoA_sLfwWMx2_znzjHsVvPq8/"
}
}
};

document.write('
<li>');
document.write('<img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'"/>');
document.write('<div>
<a href="'+rdp_posturl+'" rel="nofollow" title="'+rdp_snippet+'">'+rdp_posttitle+'</a></div>');

if(rdp_info=='yes'){
document.write('<span>'+rdp_postdate.substring(8,10)+'/'+rdp_postdate.substring(5,7)+'/'+rdp_postdate.substring(0,4)+' - '+rdp_commentsNum)+'</span>'
}
document.write('<div style="clear:both">
</div></li>
')
}};
getvalue();
for(var i=0;i<rdp_numposts;i++){
document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index='+rdp_current[i]+'&max-results=1&callback=random_posts\"><\/script>')
};
</script>
</pre><br />
*** Sebagai tambahan saja agar terlihat lebih cantik, anda bisa menambahkan CSS sesuai selera. Sebagai contoh mungkin bisa menggunakan contohnya dibawah ini.<br />
<br />
<blockquote class="tr_bq"><style><br />
#random-posts-area {width:100%;}<br />
#random-posts img{float:left;margin-right:10px;border:1px solid #999;background:#FFF;width:36px;height:36px;padding:3px}<br />
#random-posts li {list-style:none;background: none;<br />
padding: 0;}<br />
#random-posts ul {padding:0; margin:0;}<br />
#random-posts span {clear:both;}<br />
</style></blockquote><br />
Lalu untuk cara penggunaannya bisa langsung kemenu design =>add gadget =>HTML/javascript.<br />
<blockquote class="tr_bq"><span style="color: #cc0000;">Letakkan kode CSS disini..</span><br />
<div class="random-posts-area"><br />
<ul id="random-posts"><br />
<span style="color: #cc0000;">Letakkan Script Diatas disini... </span><br />
</ul><br />
</div></blockquote><br />
</div>

Blogging designe Javascript Menengah Widget Sript Random post With thumbnail + Title + Comment + Post Time

Beberapa hari yang lalu, saya sudah sharen script random post with thumnail only. Pada kesempatan kali ini, Admin ngalor ngidul kembali ing...

Baca selengkapnya »

Script Random Post with Thumbnail

Minggu, Februari 19, 2012 The Doctor Template 14

<div dir="ltr" style="text-align: left;" trbidi="on"><div style="text-align: justify;"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKdu67UXrJMyhsk6TV4PfOW8gVsOQpfEYWQAveiJWzghNRGjO5BKm_4ih68O5_-Kw-gpr2345yusw8qw4QXF7BxYwsdjQJ7qkKXZI6FgW9oZrY_2YVZZ0n8rn9cBHwchnq08D_sAVFFjvY/s1600/4.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="251" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKdu67UXrJMyhsk6TV4PfOW8gVsOQpfEYWQAveiJWzghNRGjO5BKm_4ih68O5_-Kw-gpr2345yusw8qw4QXF7BxYwsdjQJ7qkKXZI6FgW9oZrY_2YVZZ0n8rn9cBHwchnq08D_sAVFFjvY/s320/4.jpg" width="320" /></a></div>Dari kemaren pengen banget update postingan. Tapi bingung mau posting apa. Setelah berkelana kesana kemari sambil belajar design template buat blogspot, akhirnya saya menemukan sedikit bahan buat bahasan. Tema yang ingin saya bahas disini adalah tentang Script Random Post with Thumbnail.<br />
<br />
Random Post with thumbnail atau gambar ini sebenarnya sudah disediakan oleh blogger dalam bentuk widget. Jika belum tahu widgetnya kalian bisa membaca langsung di <b><i>Blogger Pluggins</i></b> dipostingan <b><a href="http://www.bloggerplugins.org/2010/09/random-posts-widget-for-blogger.html">Random Posts Widget for Blogger with Thumbnails</a></b>. Namun saya disini tidak membahas tentang widget tersebut. Saya ingin membahas Cara memasang Random post tersebut Tanpa menggunakan Pluggin tapi hanya berupa mentahan scriptnya saja. Dan Bahasan Random Post with Thumbnail sangat banyak di share di google, tapi tidak satu pun yang benar-benar seperti yang saya inginkan.<br />
<br />
Seperti kita ketahui bersama widget-widget bawaan blogger ini sudah mempunyai pengaturan default dan script yang digunakan juga All  in One. Sehingga hal ini juga pasti mempengaruhi loading dari blog. Apalagi pengguna dari script yang sama juga pasti tidak sedikit mengingat pertumbuhan dari para blogger baru yang demikian pesat.<br />
<br />
Oleh sebab itu disini saya ingin share sebuah script yang bisa anda gunakan hanya di blog anda sendiri.</div><pre class="javascript" name="code"><script type="text/javascript">
var showpostthumbnails_gal = true;
 var showpostsummary_gal    = false;
 var random_posts      = false;
function showgalleryposts(json) {
 document.write('<div id="featured" class="clearfix grid_12">

<ul>'); 
 for (var i = 0; i < numposts_gal; i++) {
  if (random_posts == true){
  var random_int  = Math.floor(Math.random()*json.feed.entry.length);
  var entry_gal = json.feed.entry[random_int];
  }
  else{
  var entry_gal = json.feed.entry[i];
  }
  var posttitle_gal = entry_gal.title.$t;
  var posturl_gal;if (i == json.feed.entry.length) break;
  for (var k = 0; k < entry_gal.link.length;k++){
   if (entry_gal.link[k].rel == 'alternate') {
    posturl_gal = entry_gal.link[k].href;break;
   }
  }
  if("content"in entry_gal){
   var postcontent_gal=entry_gal.content.$t;
  }

s = postcontent_gal;
            a = s.indexOf("<img");
            b = s.indexOf("src=\"", a);
            c = s.indexOf("\"", b + 5);
            d = s.substr(b + 5, c - b - 5);
            if ((a != -1) && (b != -1) && (c != -1) && (d != "")) {
                var thumburl_gal = d;
            } else var thumburl_gal = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiafgBnw1QbN795uPXkAvF-LHTm_Z2WO69x8ysA8i48aVv0bhxuZ25ynXRwS2IAG5wPZn1b2UV72DZyxfiax0OlELlLTEBfJ77yRzzp_yujyQ9kCp1wvnKrwUvSobGYqjx32-ibVIgsH-aH/s1600/green-butterfly.jpg';

document.write('<li> <a href="'+ posturl_gal + '"><img src="'+thumburl_gal+'" alt="" title="'+posttitle_gal+'" /><span>'+posttitle_gal+'</span>');

}
</script>
</pre><br />
<div id="CSS-area1"><div id="CSS-area"><script><br />
var numposts_gal = <span style="color: purple;"><b>1</b></span>;<br />
var random_posts = <span style="color: blue;"><b>true</b></span>;<br />
</script><br />
<script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showgalleryposts"><br />
</script><br />
<br />
</div></div>Keterangan:<br />
var numposts_gal = <b><span style="color: purple;">1</span></b>; berfungsi untuk menentukan jumlah posting yang ingin ditampilkan. Ganti angka satu sesuai kebutuhan.<br />
var random_posts = true; berfungsi untuk menampilkan secara acak. Jika ingin mematikan sistem acak, maka anda cukup ganti kata <b><span style="color: blue;">true</span></b> dengan <b><span style="color: #cc0000;">false</span></b><br />
<br />
Perlu diketahui jika script tersebut hanya mentahan dan bisa hanya bisa menampilkan gambar postingan. Agar bentuk dan tampilannya sesuai keinginan kalian bisa menambahkan CSS sesuai selera.<br />
Agar bisa di jalankan di blogger, Script di atas harus di jadikan file .js dan di upload ke hosting yang support file .js agar bisa dipasang langsung di body template. Jika tidak mempunyai hosting sendiri, Anda bisa menguploadnya ke google code. Atau bisa juga dengan memasangnya langsung melalui fitur Add Element HTML/Javascript. Untuk cara pemasangannya sendiri sudah sedikit saya bahas di postingan <i><a href="http://realfa84.blogspot.com/2012/06/script-random-post-thumbnail-only-by.html" target="_blank">Script Random Post Thumbnail Only - By Label</a></i>.<br />
<br />
<div style="text-align: justify;">Melalui postingan ini juga saya ingin sedikit memberikan kritikan atau lebih tepatnya perbandingan dan sedikit penjelasan tentang script-script yang biasa di pakai oleh para designer blogger template untuk mempercantik blog mereka dengan fitur-fitur postingan mereka. Pada dasarnya hampir semua script tersebut berasal dari Blogger Pluggins, Hanya saja mereka biasanya sudah melakukan sedikit modifikasi.<br />
<br />
Blogger Pluggins sendiri telah banyak menyediakan fitur-fitur siap pakai, diantaranya Pluggin Popular Post, Recent Post, Random Post, Featured Post, Related Post Dan banyak lagi yang lain. Perlu di ketahui jika  menurut yang saya ketahui setiap script tersebut mempunyai fungsi-fungsi yang berbeda.<br />
<br />
<b>Popular Post atau Entri Populer</b> ini sesuai namanya merupakan sebuah fitur yang berfungsi untuk menampilkan Postingan yang paling banyak dibaca atau dilihat.<br />
<b>Recent Post</b> = berfungsi untuk menampilkan artikel-artikel terakhir berdasarkan tanggal posting atau juga Artikel yang di update.<br />
<b>Featured Post</b> berfungsi untuk menampilkan postingan atau artikel berdasarkan label-label khusus.<br />
<b>Related Post</b> berfungsi dan memiliki cara kerja yang hampir sama dengan Featured post. Biasanya Related Post ini dibuat hanya tampil jika kita sudah masuk ke postingan.<br />
<b>Random Post</b> berfungsi untuk menampilkan artikel-artikel secara acak, Baik itu secara keseluruhan maupun berdasarkan label-label tertentu.<br />
<br />
Sebagai Contoh hasil dari Script Random Post with Thumbnail ini bisa kalian lihat di bagian footer <i><a href="http://www.blogger.com/infogame-online.blogspot.com"><b>blog ini</b></a></i>. Silakan refresh halaman homepagenya, maka jika kalian perhatikan setiap kali direfresh maka gambar setiap label akan berubah.<br />
<br />
Nah..<br />
Jika ada para master-master blogger punya pendapat lain, Mohon di share dikolom komentar dibawah.</div></div>

Javascript Menengah Tingkat Lanjut Tips n Trik Widget Script Random Post with Thumbnail

Dari kemaren pengen banget update postingan. Tapi bingung mau posting apa. Setelah berkelana kesana kemari sambil belajar design template bu...

Baca selengkapnya »

Cara membuat Recent Post by label horizontal diblogspot

Jumat, Februari 10, 2012 Kelulut Klanceng 11

<div dir="ltr" style="text-align: left;" trbidi="on"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS4b0P_wzgG9oXRaC3BXCY0y2P8cx4V4H0uhD_bkrLGNGEw31NySSy7OTDdetZILPnrcetWGgVllmjY1S6KVnyl_UyeogzyKQPNk6R3XN9ax807A_gGaZnuZbswK1QFQGHrU_hetfn4eE/s1600/vertikal+-+Horizontal.PNG" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS4b0P_wzgG9oXRaC3BXCY0y2P8cx4V4H0uhD_bkrLGNGEw31NySSy7OTDdetZILPnrcetWGgVllmjY1S6KVnyl_UyeogzyKQPNk6R3XN9ax807A_gGaZnuZbswK1QFQGHrU_hetfn4eE/s320/vertikal+-+Horizontal.PNG" width="282" /></a></div><div style="text-align: justify;">Postingan <strong>Cara membuat Recent Post by label horizontal diblogspot</strong> ini juga masih berhubungan dan tidak beda jauh dari dengan postingan sebelumnya. yaitu <b><a href="http://realfa84.blogspot.com/2012/01/cara-membuat-popular-post-dengan.html">Cara membuat Popular post horizontal</a></b>. Namun pada postingan ini, saya tidak memberikan tutorial lengkap karena saya anggap semua sudah mahir dan jago design blogger template sendiri.<br />
<br />
</div><div style="text-align: justify;">Oopss..!!!<br />
Jangan protes dulu ya..!!!<br />
Jika mengalami kesulitan, anda bisa tinggalkan komentar dibawah kok. Lagi pula kalau selalu diberikan tutorial siap pakai, kapan mau belajar dan pintarnya..??!!!!<br />
<br />
<br />
<div>Hehee...!!! ^_^</div><div><br class="Apple-interchange-newline" /></div><div>Ok..!!!</div><div>Tanpa banyak basa-basi, kita langsung saja masuk ke pokok pembahasan.</div><div><br />
</div></div><div style="text-align: justify;">Yang harus kita lakukan pertama adalah membuat sebuah kolom tempat widget <strong>Recent Post by label horizontal</strong> ini akan kita pasang.</div><div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Anda bisa mengambil referensi CSS dibawah ini untuk membuatnya.</div><div style="text-align: justify;"><br />
</div><pre class="CSS" name="code">.gadgetr-wrapper{}
.gadget {
 color: #333;
 line-height: 1.2em;
 margin:0 text-align: left;
 padding: 0 }
 
.gadget ul {
  font: normal 13px Arial;
  text-transform: none;
  list-style: none;
  margin: 0;
  padding: 0 }
 
.gadget li {
  text-indent: 0;
  line-height: 1.2em;
  text-align: left;
  margin: 0 auto;
  padding: 0 auto }
 
.gadget li a:hover {
  color: #36c;
  text-decoration: none;
  text-shadow: 1px 1px #111 }
 
.gadget .widget {
  background: none;
  border-bottom: 1px ridge #125;
  margin: 0 0 5px;
  padding: 10px }
 
.gadget img.label_thumb {
  float: left;
  height: 60px;
  width: 60px;
  margin: 0 10px 5px 0;
  border: ridge 1px #125;
  padding: 4px }
 
.gadget .label_with_thumbs {
  float: left;
  width: auto;
  max-height: 65px;
  margin: 0 auto;
  padding: 0 auto }
 
.gadget ul.label_with_thumbs li {
  min-height: auto;
  width: 200px;
  float: left;
  border: none;
  clear: none;
  margin: 0 10px 5px 0;
  padding: 0 }
 
.gadget ul.label_with_thumbs li a:link,.gadget ul.label_with_thumbs li a:visited {
   color: #333;
   text-decoration: none;
   line-height: 1.2em;
   font: bold 13px Georgia }

.gadget ul.label_with_thumbs li a:hover {color:#35c;text-decoration: none }
</pre><br />
<br />
<div style="text-align: justify;">Jika pembuatan kolom ini benar maka kira-kira kita akan mempunyai kolom pemasangan seperti format dibawah ini.</div><br />
<div id="CSS-area1"><div id="CSS-area"><div id='gadget-wrapper'><br />
        <b:section class='gadget' id='gadget' preferred='yes'/><br />
</div></div></div>Karena semua udah jago otak-atik CSS, maka semua pasti tahu yang harus kita lakukan hanyalah sedikit menyesuaikan lebar dan warna dari area template utama yang kita pakai. <span style="text-align: justify;">Saya anggap semua sudah mengerti tentang cara pembuatan dan pembagian kolom ini. Jika belum mengerti, silakan baca terlebih dahulu baca </span><b style="text-align: justify;"><a href="http://realfa84.blogspot.com/2011/12/cara-membuat-dan-membagi-kolom-dengan.html">postingan sebelumnya</a></b><span style="text-align: justify;">.</span><br />
<div style="text-align: justify;"><br />
</div><div style="text-align: justify;">Selanjutnya kita tinggal pasang <b><a href="http://realfa84.blogspot.com/2012/01/kode-script-dan-cara-memasang-recent.html">Script Recent Post by</a></b> label melalui <b>Dashboard</b> -> <b>Design</b> -> <b>Add Gadget</b> -> <b>HTML/Javascript</b>. Script Recent Post by label ini bisa anda dapatkan pada postingan yang telah kita bahas <a href="http://realfa84.blogspot.com/2012/01/kode-script-dan-cara-memasang-recent.html"><b>dipostingan ini</b>.</a></div><div style="text-align: justify;"><br />
</div><div style="text-align: center;"><b><span style="font-size: large;">Semoga bermanfaat..!!</span></b></div></div>

Blogging CSS Menengah Widget Cara membuat Recent Post by label horizontal diblogspot

Postingan Cara membuat Recent Post by label horizontal diblogspot ini juga masih berhubungan dan tidak beda jauh dari dengan postingan sebe...

Baca selengkapnya »

Trik dan Kode-kode Untuk Menampilkan dan Menghilangkan Widget Content Blog

Selasa, Januari 31, 2012 Kelulut Klanceng 16

<div dir="ltr" style="text-align: left;" trbidi="on"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiWj9KIEsDZAIJyBslH_2yWXkc2pBqQhT9Xso-H056x0EJjtBbkLbSuCI-VwAAvjdhFRDNEY0pCxcp088tJUjSNbPcIP2peasYFL1pqng3yqKd2WS6vIKp0CpRU8ti1Q-1A_B2nO6GD4U/s1600/menghilang.gif" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" title="Trik dan Kode-kode Untuk Menampilkan dan Menghilangkan Widget Content Blog"><img alt="Trik dan Kode-kode Untuk Menampilkan dan Menghilangkan Widget Content Blog" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiWj9KIEsDZAIJyBslH_2yWXkc2pBqQhT9Xso-H056x0EJjtBbkLbSuCI-VwAAvjdhFRDNEY0pCxcp088tJUjSNbPcIP2peasYFL1pqng3yqKd2WS6vIKp0CpRU8ti1Q-1A_B2nO6GD4U/s1600/menghilang.gif" width="330px" /></a></div><div style="text-align: justify;">Dipostingan kali ini kita akan membahas bagaimana <strong>cara menghilangkan dan menampilkan suatu objek diblog</strong>. Dalam mendesign sebuat template, Penggunaan <strong>Trik dan Kode-kode Untuk Menampilkan dan Menghilangkankan</strong> ,atau lebih tepatnya <strong>menyembunyikan Widget Content Blog</strong> ini sangat diperlukan agar hasil template yang kita buat tidak terlihat monoton. Sebagai contoh adalah widget slider dan salah satu sidebar yang ada pada blog ini. Widget tersebut hanya akan muncul dihalaman utama dan kategori blog dan akan menghilang jika kita masuk kehalaman posting.<br />
<br />
<strong>Kode-kode Untuk Menampilkan dan Menyembunyikan Widget Content Blog</strong> ini biasanya pasti ada ditemplate-template dengan gaya magazine atau majalah. Seperti yang kita ketahui, template blog dengan gaya Magazine Style merupakan salah satu favorit template yang sering di pakai oleh para blogger. Salah satu ciri template blog dengan gaya Magazine Style adalah adanya widget yang muncul lalu menghilang atau awalnya menghilang lalu muncul pada suatu halaman atau postingan blog.<br />
<br />
Berikut ini adalah jenis dan fungsi kode untuk mengatur tampilan content blog dari muncul lalu menghilang dan menghilang kemudian muncul. yang bisa Anda terapkan untuk mengatur tampilan widget blog Anda.</div><div id="CSS-area1"><div id="CSS-area">1. Hanya pada Halaman Utama Blog<br />
<div style="text-align: center;"><b><span style="color: #990000;"><b:if cond="data:blog.url == data:blog.homepageUrl"></span></b></div><div style="text-align: center;"><b>...Konten...</b></div><div style="text-align: center;"><b><span style="color: #990000;"></b:if></span></b></div>Kode ini berfungsi untuk menampilkan widget blog hanya pada halaman utama blog saja alias akan menghilang ketika kita mengklik Label Post atau membaca postingan secara keseluruhan.<br />
<br />
2. Kategori Post dan Single Post<br />
<div style="text-align: center;"><b><span style="color: #990000;"><b:if cond="data:blog.url != data:blog.homepageUrl"></span></b></div><div style="text-align: center;"><b>...Konten...</b></div><div style="text-align: center;"><b><span style="color: #990000;"></b:if></span></b></div><br />
Kode ini berfungsi untuk menampilkan widget blog pada kategori post dan single post (postingan secara keseluruhan).<br />
<br />
3. Halama Utama Blog dan Kategori Post<br />
<div style="text-align: center;"><b><span style="color: #990000;"><b:if cond="data:blog.pageType != &quot;item&quot;"></span></b></div><div style="text-align: center;"><b>...Konten...</b></div><div style="text-align: center;"><b><span style="color: #990000;"></b:if></span></b></div><br />
Kode ini berfungsi untuk menampilkan widget blog pada main post dan kategori post dan akan menghilang ketika membaca postingan secara keseluruhan.<br />
<br />
4. Single Post atau Halaman Postingan<br />
<div style="text-align: center;"><b><span style="color: #990000;"><b:if cond="data:blog.pageType == &quot;item&quot;"></span></b></div><div style="text-align: center;"><b>...Konten...</b></div><div style="text-align: center;"><b><span style="color: #990000;"></b:if></span></b></div><br />
Kode ini berfungsi untuk menampilkan widget blog hanya pada single post saja atau ketika anda membaca postingan secara keseluruhan dan tidak akan muncul pada main post atau kategori post.<br />
<br />
5. Halama Utama Blog dan Kategori Post<br />
<div style="text-align: center;"><b><span style="color: #990000;"><b:if cond="data:blog.pageType == &quot;index&quot;"></span></b></div><div style="text-align: center;"><b>...Kontent...</b></div><div style="text-align: center;"><b><span style="color: #990000;"></b:if></span></b></div><br />
Fungsi kode ini sama dengan fungsi kode pada nomer 3.<br />
<br />
6. Menampilan Widget Blog Pada Postingan Tertentu Saja<br />
<div style="text-align: center;"><b><span style="color: #990000;"><b:if cond="data:blog.url == &quot;URL_POST_TERTENTU&quot;"></span></b></div><div style="text-align: center;"><b>...Konten...</b></div><div style="text-align: center;"><b><span style="color: #990000;"></b:if></span></b></div>Kode ini berfungsi untuk menampilkan suatu widget blog hanya pada suatu postingan tertentu.<br />
<br />
7. Menyembunyikan Widget Post Pada Postingan Tertentu Saja<br />
<div style="text-align: center;"><b><span style="color: #990000;"><b:if cond='data:blog.url != &quot;URL_POST_TERTENTU&quot;'></span></b></div><div style="text-align: center;"><b>...Konten...</b></div><div style="text-align: center;"><b><span style="color: #990000;"></b:if></span></b></div><br />
Kode ini merupakan kebalikan dari kode no 6 dimana widget blog akan menghilang dari suatu postingan tertentu dan baru muncul pada postingan yang lain.</div></div><br />
<div style="text-align: justify;">Cara penggunaan kode ini sangatlah gampang. Kita cukup menambahkan kode yang kita inginkan kewidget yang ingin kita tampilkan atau sembunyikan.<br />
<br />
Untuk penerapan kode-kode diatas ada 2 cara yaitu langsung pada widget dan secara kelompok atau dengan memberikan perintah melalui kode CSS-nya. Namun biasanya, penerapan kode-kode ini melalui CSS hanya di gunakan untuk mengatur komposisi dari suatu kolom widget konten. Misalnya lebar dan posisi widget atau objek berbeda dihalaman utama dan postingan. Mungkin hal ini akan kita bahas di postingan berikutnya.<br />
<br />
Mungkin itu saja yang saya tahu tentang Kode-kode Untuk Menampilkan dan Menyembunyikan Widget Content Blog ini. Jika teman-teman punya pendapat atau ilmu yang lain, silakan tinggalkan komentar dan url postingannya dibawah ini. Semoga bermanfaat.</div></div>

Blogging designe Menengah Tingkat Lanjut Tips n Trik Widget Trik dan Kode-kode Untuk Menampilkan dan Menghilangkan Widget Content Blog

Dipostingan kali ini kita akan membahas bagaimana cara menghilangkan dan menampilkan suatu objek diblog . Dalam mendesign sebuat template, P...

Baca selengkapnya »

Kode Script dan Cara Memasang Recent Post By Label Di Blogspot

Sabtu, Januari 28, 2012 Kelulut Klanceng 12

<div dir="ltr" style="text-align: left;" trbidi="on"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghdMr4J-GBRIUl1kw5EYFAHuMWQyyxQTBWVBg2rdWE1NWeg8OlBtYJTW5PObbL6O6Oeovh0MBnF5UP_cr_ymItKV8d2ng-7FGavKIq1JkOBoYffb1JELPIibtI6kec_0I4iqb0jEEjpOg/s1600/featured+by+label.PNG" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;" title="Kode Script dan Cara Memasang Recent Post By Label Di Blogspot"><img alt="Kode Script dan Cara Memasang Recent Post By Label Di Blogspot" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghdMr4J-GBRIUl1kw5EYFAHuMWQyyxQTBWVBg2rdWE1NWeg8OlBtYJTW5PObbL6O6Oeovh0MBnF5UP_cr_ymItKV8d2ng-7FGavKIq1JkOBoYffb1JELPIibtI6kec_0I4iqb0jEEjpOg/s320/featured+by+label.PNG" width="296" /></a></div><div style="text-align: justify;">Sebenarnya <strong>Cara Memasang Recent Post</strong> ini sudah banyak dibahas oleh para master blogger. Namun biasanya dan kebanyakan yang dibahas hanya bisa menampilkan artikel-artikel yang disortir berdasarkan postingan terakhir yang diterbitkan.<br />
<br />
Nah, Pada postingan kali ini kita akan coba membahas yang sedikit berbeda. Yaitu Bagaimana Cara menampilkan postingan-postingan terakhir tersebut diurutkan berdasarkan label. Hal ini akan sangat berguna buat kita jika blog yang ingin kita tulis berupa Blog berita. Seperti yang kita ketahui bersama biasanya blog atau web yang berupa berita ini biasanya menggunakan design seperti halnya Magazine atau Majalah.<br />
<br />
Perbedaan template ini biasanya dilengkapi dengan kolom yang banyak agar kita bisa memasang widget yang juga tidak sedikit. Dimana nantinya setiap widget ini mempunyai fungsi untuk menampilkan artikel-artikel terdahulu yang di shortir berdasarkan label dari postingan.<br />
<br />
Berikut ini adalah fungsi yang bisa kita manfaatkan dengan <strong>Memasang Script Recent Post By Label</strong> ini.<br />
<br />
1. Recent Post By Label Hanya Judul Postingan.<br />
2. Recent Post By Label Judul dan Gambar Postingan.<br />
3. Recent Post By Label Judul, Gambar dan Jumlah Komentar Postingan.<br />
4. Recent Post By Label Judul, Gambar dan Tanggal Postingan.<br />
5. Recent Post By Label Judul, Gambar, Jumlah Komentar dan Tanggal Postingan.<br />
6. Recent Post By Label Judul, Gambar, Jumlah Komentar, Tanggal Postingan dan Baca Selengkapnya.<br />
<br />
Cara pemasangannya.<br />
1. Masuk ke Dashboard -> Design -> Edit Html.<br />
2. Cari kode </head><br />
Kemudian letakkan kode berikut diatasnya.</div><pre class="javascript" name="code"><script type="text/javascript">
//<![CDATA[
function labelthumbs(w){document.write('<ul class="label_with_thumbs">');for(var v=0;v<numposts;v++){var f=w.feed.entry[v];var g=f.title.$t;var z;if(v==w.feed.entry.length){break}for(var r=0;r<f.link.length;r++){if(f.link[r].rel=="replies"&&f.link[r].type=="text/html"){var n=f.link[r].title;var o=f.link[r].href}if(f.link[r].rel=="alternate"){z=f.link[r].href;break}}var j;try{j=f.media$thumbnail.url}catch(q){s=f.content.$t;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){j=d}else{j="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiR3_UtYV8F98HuHzySj5lpOfgrL8WDGd-buW_GwmfSyHGPrTOeVthkC_8YYNSSMPHGGqGD-EdC_WSRF7v9Yhi5tIJCp7Jcp9kDowliK0NFF8djLmbUAj0GxCmam5pqjAQe-RPV4DNxHeI/s1600/no_thumb.gif"}}var x=f.published.$t;var m=x.substring(0,4);var l=x.substring(5,7);var t=x.substring(8,10);var h=new Array();h[1]="Jan";h[2]="Feb";h[3]="Mar";h[4]="Apr";h[5]="May";h[6]="Jun";h[7]="Jul";h[8]="Aug";h[9]="Sep";h[10]="Oct";h[11]="Nov";h[12]="Dec";document.write('
<li class="clearfix">');if(showpostthumbnails==true){document.write('<a href="'+z+'" target ="_top"><img class="label_thumb" src="'+j+'"/></a>')}document.write('<strong><a href="'+z+'" target ="_top">'+g+"</a></strong>
");if("content" in f){var y=f.content.$t}else{if("summary" in f){var y=f.summary.$t}else{var y=""}}var p=/<\S[^>]*>/g;y=y.replace(p,"");if(showpostsummary==true){if(y.length<numchars){document.write("");document.write(y);document.write("")}else{document.write("");y=y.substring(0,numchars);var e=y.lastIndexOf(" ");y=y.substring(0,e);document.write(y+"...");document.write("")}}var A="";var u=0;document.write("
");if(showpostdate==true){A=A+h[parseInt(l,10)]+"-"+t+" - "+m;u=1}if(showcommentnum==true){if(u==1){A=A+" | "}if(n=="1 Comments"){n="1 Comment"}if(n=="0 Comments"){n="No Comments"}n='<a href="'+o+'" target ="_top">'+n+"</a>";A=A+n;u=1}if(displaymore==true){if(u==1){A=A+" | "}A=A+'<a href="'+z+'" class="url" target ="_top">More »</a>';u=1}document.write(A);document.write("</li>
");if(displayseparator==true){if(v!=(numposts-1)){document.write("")}}}document.write("</ul>")};
//]]>
</script>

</pre><br />
4. Save Template.<br />
5. Kembali ke Dashboard -> Design -> Add Element -> HTML/JavaScript.<br />
<div id="CSS-area1"><div id="CSS-area"><script type="text/javascript"><br />
var numposts =<b> <span style="color: magenta;">4</span></b>;<br />
var showpostthumbnails = <b><span style="color: red;">false</span></b>;<br />
var displaymore = <b><span style="color: red;">false</span></b>;<br />
var displayseparator = <b><span style="color: red;">false</span></b>;<br />
var showcommentnum =   <b><span style="color: blue;">true</span></b> ;<br />
var showpostdate = <b><span style="color: blue;">true</span></b>;<br />
var showpostsummary = <b><span style="color: blue;"> true</span></b> ;<br />
var numchars = <b><span style="color: magenta;">340</span></b>;<br />
</script><br />
<br />
<div style="text-align: center;"><script src="/feeds/posts/default/-/<b><span style="color: #660000;">LabelPost</span></b>?orderby=published&amp;alt=json-in-script&amp;callback=labelthumbs" type="text/javascript"><span style="text-align: justify;"></script></span></div></div></div></div><div id="CSS-area1"><div id="CSS-area">Keterangan kode:<br />
<br />
1. var numposts =<b> <span style="color: magenta;">4</span></b>;  = jumlah Postingan yang ingin ditampilkan<br />
2. var showpostthumbnails = <b><span style="color: red;">false</span></b>; = Kode Menampilkan gambar<br />
3. var displaymore = <b><span style="color: red;">false</span></b>;  Kode Menampilkan tulisan read more<br />
4. var showpostdate = <b><span style="color: blue;">true</span></b>; = Kode Menampilkan tanggal posting<br />
5. var showcommentnum =   <b><span style="color: blue;">true</span></b> ; Kode Menampilkan Jumlah Komentar Postingan<br />
6. var showpostsummary = <b><span style="color: blue;"> true</span></b> ; Kode Menampilkan sebagian isi Postingan<br />
7. var numchars = <b><span style="color: magenta;">340</span></b>; Panjang karakter isi postingan yang ditampilkan<br />
8. var displayseparator = <b><span style="color: red;">false</span></b>; Kode Untuk memberikan Pembatas setiap tampilan</div></div>Ganti <b><span style="color: #cc0000;">false</span></b> (kode warna merah) dengan  <b><span style="color: blue;">true</span></b> (kode warna biru) untuk menampilkan, demikian juga sebaliknya.<br />
<div id="CSS-area1"><div id="CSS-area"><div style="text-align: center;"><script src="/feeds/posts/default/-/<b><span style="color: #660000;">LabelPost</span></b>?orderby=published&amp;alt=json-in-script&amp;callback=labelthumbs" type="text/javascript"> </div></div></div><br />
Ganti <b style="color: #660000;">LabelPost </b>(kode warna cokelat) Dengan Label yang ingin ditampilkan. Jika label tersebut menggunakan spasi, maka ganti kode spasi dengan %20.<br />
Contoh Label = <b style="color: #660000;">Belajar Blog</b> maka untuk penulisannya harus dengan format seperti ini:<br />
<div id="CSS-area1"><div id="CSS-area"><div style="text-align: center;"><script src="/feeds/posts/default/-/<b><span style="color: #660000;">Belajar</span><u><span style="color: #3d85c6;">%20</span></u><span style="color: #660000;">Blog</span></b>?orderby=published&amp;alt=json-in-script&amp;callback=labelthumbs" type="text/javascript"></div></div></div><div style="text-align: justify;">Tambahan:<br />
Kode ini juga bisa dipakai untuk memanggil feed post blog kita yang lain. Caranya adalah cukup dengan menambahkan URL BLOG dan Label yang ingin ditampilkan.<br />
<br />
Contoh: <br />
<div id="CSS-area1"><div id="CSS-area"><div style="text-align: center;"><script src="<b><span style="color: blue;">http://URL-BLOG-ANDA</span></b>/feeds/posts/default/-/<b><span style="color: #660000;">Belajar</span><u><span style="color: #3d85c6;">%20</span></u><span style="color: #660000;">Blog</span></b>?orderby=published&amp;alt=json-in-script&amp;callback=labelthumbs" type="text/javascript"></div></div></div></div>

Blogging Javascript Menengah Tutorial Widget Kode Script dan Cara Memasang Recent Post By Label Di Blogspot

Sebenarnya Cara Memasang Recent Post ini sudah banyak dibahas oleh para master blogger. Namun biasanya dan kebanyakan yang dibahas hanya bi...

Baca selengkapnya »