Tutorial Letak Salji Dalam Blog : Ver 2

Meletakkan salji dalam blog boleh dijadikan unsur yang boleh menambahkan lagi ceria blog anda.:).



Ando boleh tengok demo salji berwarna purple yang admin letak di blog demo ini.

Tutorial untuk letak salji ini seperti berikut.

1. Dari dashboard > design > add a gadget > HTML javascript

2. Copy dan paste kod salji mengikut warna yang anda mahu ke dalam HTML/javascript

Putih

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowwhite.js"></script>

Purple

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowpurple.js"></script>

Hitam

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowblack.js"></script>

Biru

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowblue.js"></script>

Merah

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/snowred.js"></script>

3. Save dan lihat hasilnya.:)


Nota: Drag element ada ke bawah 'header' supaya salji muncul dari atas page blog anda.:)

Animated Recent Post Ver2

Recent post menunjukkan apakah post terbaru yang baru dihasilkan oleh seseorang blogger untuk blognya. Adanya animated recent post widget, dapat menambahkan lagi 'seri' bagi senarai recent post anda.



Anda boleh lihat demo animated recent post ver2 ini di blog demo ini.

Tutorial untuk membuat animated recent post ini adalah seperti berikut.

1. Dari dashboard > design > add a gadget > HTML/javascript

2. Copy dan paste kod di bawah ke dalam ruangan HTML/javascript yang anda buka.

<style type="text/css">
#rp_plus_img{height:377px;}
#rp_plus_img li {height:60px;padding:5px;list-style:none;
background-color:#ffffff;
border:solid 1px #000000;}
#rp_plus_img a{color:#00000;}
#rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
text-align:justify;
-moz-border-radius: 5px;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;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="https://sites.google.com/site/unwanted86/javascript/recentpost.js"></script>
<script type="text/javascript">
var speed = 1500;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img">
<script style="text/javascript">
var numposts = 5;
var numchars = 0;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul><small><a href="http://tutorialuntukblog.blogspot.com/2011/07/animated-recent-post-ver2.html" target="_blank">get this widget here</a></small>

3. Save dan lihat hasilnya.

p/s: Sebelum ini admin juga ada buat tutorial animated recent post ver1.