BELOG GILA

Showing posts with label GILA tutorial. Show all posts

Tutorial cara buat recent post version 2 by Blogger blog tutorial..
recent post versi ni nampak cantik sikit berbanding versi yang 1 tu..versi ni ada ringan sikit...

cara pasang recent post ni senang saja..sama macam pasang widget yang lain..

Mula2 pergi ke desbot---desaign---ada gajet----HTML / Javascript..Kemudian copy code dibawah

<center><style type="text/css">
#rp_plus_img{height:424px;overflow:hidden;background:#6e6e6e;
border:3px solid #7d7d7d;-moz-border-radius: 50px 50px; border-radius: 21px 21px; padding:6px 10px 14px 5px;}
#rp_plus_img ul{list-style-type:none;margin:0;padding:0}
#rp_plus_img li{border:0; margin:0; padding:0; list-style:none;}
#rp_plus_img li{height:60px;padding:5px;list-style:none;}
#rp_plus_img a{color:#151515;}
#rp_plus_img .news-title{display:block;font-weight:bold !important;margin-bottom:4px;font-size:11px;}
#rp_plus_img .news-text{display:block;font-size:11px;font-weight:normal !important;color:#fff;text-align:justify;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #585858;width:55px;height:55px;}
</style><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://javasriptcode.googlecode.com/files/rpplusimgnt-v1.0.js.txt"></script>
<script type="text/javascript">
var speed = 400;
var pause = 2500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img">
<script style="text/javascript">
var numposts = 10;
var numchars = 55;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul></center>
<span style="color: #fff; font-size: small;"><b><a href="http://belogila.blogspot.com/2012/02/gila-tutorial-cara-buat-recent-post.html" target="_blank">Get This Widget</a></b></span>

angka 10 yang kaler pelik tu anda boleh ubah jika mahu tambah jumlah recent post anda..

Live demo..lebar widget tu mengikut lebar yang di setkan pada section tu..jika anda letakkan widget tu pada sidebar..lebar dia tidak seperti di bawah tu..yang di bawah ti lebar dia ikut lebar entri ni..('',)

GILA tutorial - cara buat recent post dengan gambar version2

GILA tutorial

mula2 pergi ke desbot---desaign---ada gadget---edit html... jangan tick pada expand widget template...

Kemudian cari code ...

]]></b:skin>

kemudian masukkan code di berikut di atas code yang dicari tadi...

.blog-list-container {height:355px;overflow:auto;}

Contoh :

.blog-list-container {height:355px;overflow:auto;}
]]></b:skin>

Untuk ubah ketinggian bloglist tu.. tukar 355px contoh 455px.. makin besar angka makin tinggi...

Jika anda ada lebih dari 1 bloglist.. coding css ni akan membuatkan semua bloglist anda mempunyai scrollbar..

Sekian

GILA tutorial - cara letak scrollbar pada bloglist

GILA tutorial

Mula2 pergi ke dashbord----posting----edit pages---New page

gunakan edit html.. bukan compose...

copy code di bawah...gantikan tulisan URL BLOG ANDA dengan url blog kau orang la..

<div id='cl_option'>

<span style='text-align:center;font-size:61px;'>Loading...</span> </div>
<div id='cl_content_list'>

</div>
<script type='text/javascript'>
var jumlah_kata_dalam_ringkasan =0;
</script>
<script src='http://polste.googlecode.com/files/POLSKA_sitemaperr2.js'>

</script>
<script src='http://URL BLOG ANDA.blogspot.com/feeds/posts/default?alt=json-in-script&callback=onLoadFeed&max-results=9999'>
</script>

CONTOH

<div id='cl_option'>

<span style='text-align:center;font-size:61px;'>Loading...</span> </div>
<div id='cl_content_list'>

</div>
<script type='text/javascript'>
var jumlah_kata_dalam_ringkasan =0;
</script>
<script src='http://polste.googlecode.com/files/POLSKA_sitemaperr2.js'>

</script>
<script src='http://belogila.blogspot.com/feeds/posts/default?alt=json-in-script&callback=onLoadFeed&max-results=9999'>
</script>

Sekian..