Tutorial | Recent post floating bar widget

Recent posts floating bar  seperti yang korang nampak kat bawah blog ini adalah widget yang sangat menarik. Widget tersebut memaparkan tajuk post terkini yang berefek slider.

steps:

1. Log in dashboard--> Template --> Edit HTML --> Proceed.

2. Seterusnya tick "Expand Widget Templates"

3. Dengan menggunakan keyboard, tekan "Ctrl+F" cari kod </head>

4. Copy dan paste kod css ini, di atas atau sebelum kod </head> 

<style type='text/css'>
#bd {
float:bottom;
font-family:Arial, Helvetica, sans-serif;
line-height:1.5;
margin-top:5px;
font-size:12px
}
.text {
color:#98BF2F;
margin-left:8px
}
div#news-1 .gk_news_highlighter {
font-family:Verdana, Arial;
font-size:11px;
color:#666
}
div#news-1 {
width:960px;
height:24px;
margin-left: -10px;
display:scroll;
position:fixed;
bottom:1px;
border-top:1px solid #CCC;
border-bottom:1px solid #CCC;
background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZoQzDXePElMGOMaVc2B5E_rdiv-RYm0RaxdfZnHZ4_CGkIj6gjH2UZBVDSwhUsNwAUw7y3xYs_2h-Dfhg7EchCThh5G7PJvMcWjHZDg8zCh9AIY_gI5ozGRvXQdk86g6XAsB8rTTRYP-f/s320/gradient.png) repeat-x 0 -100px;
clear:both;
overflow:hidden
}
div#news-1 .gk_news_highlighter_wrapper {
float:left;
width:820px;
height:24px;
line-height:24px;
overflow:hidden;
position:relative
}
div#news-1 .gk_news_highlighter_item {
width:auto;
height:24px;
padding-left:20px;
display:none;
position:absolute
}
div#news-1 .nowrap {
white-space:nowrap
}
div#news-1 .gk_news_highlighter_title {
padding-left:5px
}
div#news-1 .gk_news_highlighter_desc {
padding-right:5px
}
div#news-1 .gk_news_highlighter_interface {
float:left;
width:120px;
height:24px;
text-align:right;
line-height:24px;
z-index:1000
}
div#news-1 .gk_news_highlighter_interface .text {
float:left;
display:block;
width:auto;
padding-left:5px;
font-weight:700
}
div#news-1 .gk_news_highlighter_interface div {
width:30px;
float:right
}
div#news-1 .gk_news_highlighter_interface a.prev,div#news-1 .gk_news_highlighter_interface a.next {
cursor:pointer;
width:13px;
height:24px;
display:block;
background:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitgDlADFMxXui3nD4MNle960VsoaiJFiYQ_eQsbWU3at938sioUZMTCfrywECZVu-Q80LbwinjSpNI2CNBniOsYQXtPWcEgQgye_0DaFJfZ8hEYRngDGAbBsXoLU3PjyjyMgCHNN7wQSo/s1600/play.png&#39;) no-repeat 0 50%;
float:left
}
div#news-1 .gk_news_highlighter_interface a:hover.prev {
background-position:-13px 50%
}
div#news-1 a,div#news-1 a:link,div#news-1 a:visited,div#news-1 a:active,div#news-1 a:focus {
color:#FFF
}
div#news-1 .gk_news_highlighter_interface a.next {
float:right;
background-position:-26px 50%
}
div#news-1 .gk_news_highlighter_interface a:hover.next {
background-position:-39px 50%
}
</style>

5. Then, tekan "Ctrl+F" cari pula kod <div id='content-wrapper'>. 

Bagi blog yang menggunakan template dari template designer, cari kod </footer>

6. Copy dan paste kod HTML dibawah atau selepas kod <div id='content-wrapper'>

 Bagi blog yang guna template dari template designer, paste kod HTML dan Javascript ini kat atas atau sebelum </footer>

<div id='bd'>
<div class='gk_news_highlighter' id='news-1'>
<div class='gk_news_highlighter_interface'>
<span class='text'>HOT NEWS</span>
<div>
<a class='prev' href='#'/>
<a class='next' href='#'/>
</div>
</div>
<div class='gk_news_highlighter_wrapper'>
<script language='JavaScript'>
imgr = new Array();
showRandomImg = false;
aBold = true;
text = &quot;no&quot;;
showPostDate = false;
summaryPost = 200;
summaryFontsize = 12;
summaryColor = &quot;#000&quot;;
icon = &quot; &#187; &quot;;
label = &quot;&quot;;
numposts = 30;
home_page = &quot;http://www.tyralee.my/&quot;;
</script>
<script src='http://yourjavascript.com/11843262101/post-hotnews.js' type='text/javascript'/>
</div>
</div>
</div>
<script src='http://yourjavascript.com/01042612211/mootools.js' type='text/javascript'/>
<script src='http://javscript-code.googlecode.com/files/engine_compress.js' type='text/javascript'/>
<script type='text/javascript'>
try {$Gavick;}catch(e){$Gavick = {};};
$Gavick[&quot;gk_news_highlighternews-1&quot;] = {
&quot;animationType&quot; : 3,
&quot;animationSpeed&quot; : 200,
&quot;animationInterval&quot; : 2000,
&quot;animationFun&quot; : Fx.Transitions.linear,
&quot;mouseover&quot; : 1};
</script>

7. tukar yang warna merah dengan url blog korang .
8. Seterusnya klik Preview. kalau kedudukan bar terlalu ke kiri atau ke kanan, korang edit nilai pada kod yang di bold dengan warna biru kat langkah 4.

width:960px; (Panjang bar)
margin-left: -10px; (kalau kedudukan bar terlalu ke kanan, edit nilai -10 kepada 10 dan sebaliknya)

9 . Akhir sekali,kalau korang berpuas hati dengan kedudukan bar tersebut, klik Save.

Tyra Lee (Author)

About Guest Author:
Assalamualaikum. I'm the only author for this blog. Cik adik, cik kakak, cik abang tak kan baca je . apa pendapat korang plak? comment la sikit. Dont worry, aku open minded :D.

Follow @RarraLee

Tutorial | simple calender

Langkah 1

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya, klik pada HTML/Javascript.

Langkah 2

Salin kod biru di bawah dan pastekan pada Content HTML/Javascript 

<script language="JavaScript">

var fixd;       

                   

function isGregLeapYear(year) 

{                              

    return year%4 == 0 && year%100 != 0 || year%400 == 0;

}                                       

                                       

function gregToFixed(year, month, day)

{                                   

    var a = Math.floor((year - 1) / 4);

    var b = Math.floor((year - 1) / 100);

    var c = Math.floor((year - 1) / 400);

    var d = Math.floor((367 * month - 362) / 12);

                                      

    if (month <= 2)

        e = 0;   

    else if (month > 2 && isGregLeapYear(year)) 

        e = -1; 

    else    

        e = -2; 

                           

    return 1 - 1 + 365 * (year - 1) + a - b + c + d + e + day;

}    

     

function Hijri(year, month, day) 

{                        

    this.year = year; 

    this.month = month; 

    this.day = day;     

    this.toFixed = hijriToFixed;

    this.toString = hijriToString;

}         

        

function hijriToFixed()

{       

    return this.day + Math.ceil(29.5 * (this.month - 1)) + (this.year - 1) * 354 + 

        Math.floor((3 + 11 * this.year) / 30) + 227014 - 1;

}            

               

function hijriToString()

{ 

    var months = new Array("Muharam","Safar","Rabi\'ul Awal","Rabiul Akhir","Jamadil Awal","Jamadil Akhir","Rejab","Sya\'ban","Ramadan","Syawal","Dzulka\'edah","Dzulhijjah");

return this.day + " " + months[this.month - 1]+ " " + this.year; 

}               

                

function fixedToHijri(f) 

{          

var i=new Hijri(1100, 1, 1);

i.year = Math.floor((30 * (f - 227015) + 10646) / 10631);

var i2=new Hijri(i.year, 1, 1);    

var m = Math.ceil((f - 29 - i2.toFixed()) / 29.5) + 1;

i.month = Math.min(m, 12); 

i2.year = i.year;

     i2.month = i.month;  

     i2.day = 1;    

i.day = f - i2.toFixed() + 1; 

return i; 

} 

   

var tod=new Date();

var weekday=new Array("Ahad","Isnin","Selasa","Rabu","Khamis","Jumaat","Sabtu");

var monthname=new Array("Januari","Februari","Mac","April","Mei","Jun","Julai","Ogos","September","Oktober","November","Disember"); 

              

var y = tod.getFullYear();

var m = tod.getMonth();

var d = tod.getDate();

var dow = tod.getDay();

           

document.write(weekday[dow] + " : " + d + " " + monthname[m] + " " + y);

     

m++;   

fixd=gregToFixed(y, m, d);

var h=new Hijri(1421, 11, 28);

h = fixedToHijri(fixd);

document.write(" &nbsp;&nbsp;<br>@ " + h.toString() + "H");

  

    </script>

dah tu, save!

Tyra Lee (Author)

About Guest Author:
Assalamualaikum. I'm the only author for this blog. Cik adik, cik kakak, cik abang tak kan baca je . apa pendapat korang plak? comment la sikit. Dont worry, aku open minded :D.

Follow @RarraLee

Bahasa Inggeris peringkat degree

Okay, harini punya topik . bahasa inggeris peringkat degree  

Bukan aku nak cerita pasal subject aku blaja ke ape. Just cerita yang aku nak share pasal english.  Aku mengaku, aku tak fluent sangat pun english. biasa2 je. kalau orang tanya, boleh jawab. present pun xde la sampai langsung tak boleh. 

Tapi aku ada masalah bahagian pronunciation (sebutan) . aku agak pelat dalam certain words.  

Haritu dalam kelas, lecturer tengah briefing pasal assignment semua tu. kitorang nanti kena cari company yang buat product dengan service . aku pun angkat tangan sebab nak tanya samada nak sekali kan or separate them . 

Maksud aku company yang kite nak cari tu bisnes yang combine kan product and service sekali cam KFC/Mcd dimana mereka telah menggunakan product and service dalam bisness dyorang tak pun company yang just jual product/services je. (info je. tayah paham. tak penting dalam cerita aku ni) haha

pastu lecturer tu cakap "separate"

dia saja cakap lambat2 and tenung aku . haha . tebal jugak muka . aku pun ulang balik ape dia cakap dengan muka sengeh2 . cover malu la konon . yelah . aku sebut salah . huruf 'e' sepatut e utk epal, aku pergi sebut 'e' untuk emak. haha

malu jugak la asyik kena tegur. tapi that was fun. :D aku tak malu nak tanya sesuatu perkara. nak2 pasal ilmu. thanks pada kawan2 yang support aku. Nasihat aku, sementara masih muda, belajarlah... nanti dah tua lagi malu.. penting sangat taw. 

now on pun Alhamdulillah... Aku bersyukur..

Follow @RarraLee

Header baru sempena dah jadi budak degree LOL

kalau korang update dengan aku , tu pun kalau lah , korang mesti perasan yang header aku kaler dia lebih2 kurang je . paling tak pun pusing2 , color sama je . tapi korang jangan tak paham . sebenarnya jadik camtu pasal aku tak pernah tukar background aku . 

memang agak lama jugak la. makan tahun . 10x tukar header , background still tak tukar . domain dah nak habis bayar dah , background still nama hijaulembut lagi . haha . kali ni aku buat header versi degree . versi degree aku lah . 

yang atas ni yang aku dah tak pakai dah . bosan dah . haha .

 sebelum tu , aku nak story sikit pasal gambar header baru kat bawah ni . sorry la pada art and design punya kaki . sebab tak kemas sikit , aku buat ni tergesa2, anak sdara datang nak tekan-tekan lappy . haha . gambar ni sebenarnya diambil masa karnival mesra segamat. ktorang sumua organizer, bawah UiTM segamat . 


kalau korang jumpa baju camni pastu ade logo M cam MIG david teh o tu, sah la tu budak marketing, UiTM Johor.  satu fakulti pakai baju ktorang taw . hehe baju ni custom made by department aku. si Aliff. Tu budak yang paling tinggi dalam gambar tu .

Gambar di  atas juga sebenarnya gambar time ktorang masuk pertandingan makan . tak sangka menang tempat kedua kalau tak salah , muka aku sedikit masam tiime tu sebab tengah fikir cemane aku nak habiskan ice cream cair tu secepat mungkin . Tapi group ktorang mmg super laju wa cakap lu . rindu pulak dah . hehe (padahal kat karnival tu baru kenal-certain lah)

okay , kalau aku rajin aku tukar lain . tak smooth je aku tengok grrr.... ape pendapat korang dengan header baru aku ni?

KLIK LINK NI KALAU NAK TENGOK HEADER YANG AKU PERNAH PAKAI SEBELUM NI.
Follow @RarraLee

cerita kenapa aku tak update blog

Assalamualaikum orang kampung . haih lama bebenor tak update . disebabkan kemaluan aku terhadap osmet (housemate) aku . yelah, mane tak malu , dia dah la stalk blog aku . dah tu siap tanya aku pulak pasal entry aku tuh . kalau stalk diam-diam , takde lah aku segan nak meninggal ni . haha

seminggu yang lepas, aku nak update dah blog . tapi tetiba pulak nenek kucing aku nak bersalin , terpaksa lah aku tangguh . yelah, nyawa kucing lagi penting dari update blog kan . nasib jugak aku ni penyabar orangnya . kalau tak , mahu mahu saja aku tinggal kan nenek kucing tu bersendirian . amboi bermadah berhelah pulak ^.^

empat hari lepas, aku dah tekan suis wifi dah . baru jek nak login blogger , tetiba anak jiran ajak aku main batu seremban . aku cakap dah , batu seremban takde . batu kuantan mungkin ada . tapi dia degil ya ampun . so aku terpakse lah main batu kuantan ala2 batu seremban . aku harap dia tertipu lah dengan batu kuantan tu . 

tiga hari lepas,  aku dah rilex-rilex dah nak buat entry pasal lauk berbuka . tetiba pulak aku terlekat kat depan drama korea , puas jugak aku tarik-tarik tangan sendiri agar tak terpengaruh dengan kehenseman mamat-mamat korea tu. tapi ternyata usaha ku gagal . so tak berupdate lah entry lauk berbuka ku . 

dua hari lepas , aku online tengah malam .  konon konon nak curi-curi online lah . bukan main lagi aku online dalam gelap . pup! tetiba xboleh search . rupanya daddy tutup wifi -,-' aku pun mengambil keputusan untuk duduk bersila sambil cari jalan untuk bukak balik wifi yang ada dalam bilik daddy sampai tertido haa...

semalam , aku cuba nak online blog . aku bukak je lappy , aku taip fb , twitter and last skali blog . time bukak fb aku amik masa 5 minit. bukak twitter ambil 3 jam . nak bukak blog , aku dah malas . so aku pun tak update blog . 

tadi aku bukak lappy , aku pun taip-taip .  sedar-sedar dah sampai sini . okay , sebab tu aku berjaya publish entry ni.. kah3... terima kasih kerana gigih membaca :D

tepuk tangan "applause"

Follow @RarraLee

kampus life

Harini nak upload gambar je . malas nak cerita pepanjang sangat . haha . aku sangat selekeh . tapi , tape.. selekeh2 pun dah ade buah hati sayang.. hahaha

cop cop ni bukan buah hati aku . ni faiz . rakan sekelas . cewah . amik gambar pasal ktorang sama kuning . :D

time ni tengah tunggu kenji pegi amik kereta . 

agak-agak erin marah tak aku letak gambar ni ek? haha . 

sweet je nadia . :D 

syida . semangat nak amik gambar kat sofa . haha

kadang2 nampak muka ktorang macam tak jauh beza je . hahaha .

sonok kawan ngn korang . <3

Follow @RarraLee

Tutorial | effect tulisan berlampu neon

tuto ni di request dari Adam Faiz

mksud nya camni..

1.layout>add gadget>add html>pastekan bawah ni dlm kotak tu

<script language="JavaScript1.4">

jsver = 1.4;

var neonbasecolor="#000000" 

var neontextcolor="af0" 

var neontextcolor2="" 

var flashspeed=50 // kecepatan flashing dalam milliseconds

var message="Assalamualaikum.. tutorial ini dari www.tyralee.my . sila comment kalau anda berjaya . :D"

var flashingletters2=1 // bilangan huruf yg di flashing pada neontextcolor2 (0 to disable)

var flashingletters=6 // bilangan huruf yang di flashing pada neontextcolor

var flashpause=0 // pause diantara flash-cycles dalam milliseconds

var n=0

if (document.all||document.getElementById){

document.write('<font color="'+neonbasecolor+'">')

for (m=0;m<message.length;m++)

document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')

document.write('</font>')

}

else

document.write(message)

function crossref(number){

var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)

return crossobj

}

function neon(){

//Change all letters to base color

if (n==0){

for (m=0;m<message.length;m++)

crossref(m).style.color=neonbasecolor

}

//cycle through and change individual letters to neon color

crossref(n).style.color=neontextcolor

if (n>flashingletters-1) crossref(n-flashingletters).style.color=neontextcolor2

if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=neonbasecolor

if (n<message.length-1)

n++

else{

n=0

clearInterval(flashing)

setTimeout("beginneon()",flashpause)

return

}

}

function beginneon(){

if (document.all||document.getElementById)

flashing=setInterval("neon()",flashspeed)

}

beginneon()

</script>

2. last sekali tukar warna merah ngn warna biru tu. 

• warna merah tu tukar color lampu tu.
• warna biru tu untuk ayat korang.

3. ok,save . 

Tyra Lee (Author)

About Guest Author:
Assalamualaikum. I'm the only author for this blog. Cik adik, cik kakak, cik abang tak kan baca je . apa pendapat korang plak? comment la sikit. Dont worry, aku open minded :D.

Follow @RarraLee

Tutorial | last korang datang sini

Aqu Mad tanya camne buat ni .

cara2nya.

layout>add widget> add html> paste kan dalam kotak tu .

<center><script type = "text/javascript">
//
var days = 730; // days until cookie expires = 2 years.
var lastvisit=new Object();
var firstvisitmsg="thank you for coming !";
lastvisit.subsequentvisitmsg="hye , last korang dtg sini pada <b>[displaydate]</b>";
lastvisit.getCookie=function(Name){
var re=new RegExp(Name+"=[^;]+", "i");
if (document.cookie.match(re))
return document.cookie.match(re)[0].split("=")[1];
return'';
}
lastvisit.setCookie=function(name, value, days){
var expireDate = new Date();
var expstring=expireDate.setDate(expireDate.getDate()+parseInt(days));
document.cookie = name+"="+value+"; expires="+expireDate.toGMTString()+"; path=/";
}
lastvisit.showmessage = function() {
var wh = new Date();
if (lastvisit.getCookie("visitc") == "") {
lastvisit.setCookie("visitc", wh, days);
document.write(firstvisitmsg);
}
else {
var lv = lastvisit.getCookie("visitc");
var lvp = Date.parse(lv);
var now = new Date();
now.setTime(lvp);
var day = new Array("Sun", "Mon", "Tues", "Wed", "Thur", "Fri", "Sat");
var month = new Array ("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec");
var dd = now.getDate();
var dy = now.getDay();
dy = day[dy];
var mn = now.getMonth();
mn = month[mn];
yy = now.getFullYear();
var hh = now.getHours();
var ampm = "AM";
if (hh >= 12) {ampm = "PM"}
if (hh >12){hh = hh - 12};
if (hh == 0) {hh = 12}
if (hh < 10) {hh = "0" + hh};
var mins = now.getMinutes();
if (mins < 10) {mins = "0"+ mins}
var secs = now.getSeconds();
if (secs < 10) {secs = "0" + secs}
var dispDate = dy + ", " + mn + " " + dd + ", " + yy + " " + hh + ":" + mins + ":" + secs + " " + ampm
document.write(lastvisit.subsequentvisitmsg.replace("\[displaydate\]", dispDate))
}
lastvisit.setCookie("visitc", wh, days);
}
lastvisit.showmessage();
</script>
</center>

okay, tukar yang warna merah tu kalau nak la :D

Tyra Lee (Author)

About Guest Author:
Assalamualaikum. I'm the only author for this blog. Cik adik, cik kakak, cik abang tak kan baca je . apa pendapat korang plak? comment la sikit. Dont worry, aku open minded :D.

Follow @RarraLee

Aku tukar header lagi

Saja asah bakat yang terpendam . disamping nak tengok aku punya progression dalam edit mengedit ni . haha

dulu

second

baru

latest .

nampak cam matang sikit . konon nye lah . haha

owh! klik untuk tumbesaran . haha

Follow @RarraLee

Tutorial | welcome note

Welcome note ni cam kat bawah . before masuk blog orang , dia suruh klik untuk masuk . yang ni korang boleh edit gambar sendiri :D kalau nak mintak aku buatkan pun boleh . RM5.00 siap sekali pasang kat blog korang. 

steps:

1.dashboard>design>edit html>tick expand

2.tekan Ctrl+f and cari code ]]></b:skin>

3.pastekan code nie atas code tadi

/* to top */
#toTop { width:100px;background:none;border:0px solid #ccc;text-
align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#666;text-
decoration:none; }
</style></head>
<script language="javascript" type="text/javascript">
/* toggle() checks to see if the images has already been faded
or not and sends the appropriate variables to opacity(); */
function toggle(el,milli) {
// Get the opacity style parameter from the image
var currOpacity = document.getElementById(el).style.opacity;
if(currOpacity != 0) { // if not faded
fade(el, milli, 100, 0);
} else { // else the images is already faded
fade(el, milli, 0, 100);
}
}
/* changeOpacity() uses three different opacity settings to
achieve a cross-browser opacity changing function. This
function can also be used to directly change the opacity
of an element. */
function changeOpacity(el,opacity) {
var image = document.getElementById(el);
// For Mozilla
image.style.MozOpacity = (opacity / 100);
// For IE
image.style.filter = "alpha(opacity=" + opacity + ")";
// For others
image.style.opacity = (opacity / 100);
}
/* fade() will fade the image in or out based on the starting
and ending opacity settings. The speed of the fade is
determined by the variable milli (total time of the fade
in milliseconds)*/
function fade(el,milli,start,end) {
var fadeTime = Math.round(milli/100);
var i = 0; // Fade Timer
// Fade in
if(start < end) {
for(j = start; j <= end; j++) {
// define the expression to be called in setTimeout()
var expr = "changeOpacity('" + el + "'," + j + ")";
var timeout = i * fadeTime;
// setTimeout will call 'expr' after 'timeout' milliseconds
setTimeout(expr,timeout);
i++;
}
}
// Fade out
else if(start > end) {
for(j = start; j >= end; j--) {
var expr = "changeOpacity('" + el + "'," + j + ")";
var timeout = i * fadeTime;
setTimeout(expr,timeout);
i++;
}
}
}
</script>
<div class="input" onClick="javascript:toggle('wise', 3000); this.style.display='none';
document.getElementById('june').style.display=''">
<img src="LINK GAMBAR"
style="opacity:0.4;filter:alpha(opacity=40)"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.7;this.filters.alpha.opacity=40"/>
</div>
<div id="wise" style="filter : alpha(opacity=0); -moz-opacity : 0; opacity : 0;">
<div id="june" style="display : none;">
<body>

Note:
Link gambar tu korang letak gambar korang . 
kalau tak de gambar , search google je . 
kalau nak resize . tambah width="1200" height="890" lepas <img src="LINK GAMBAR"

tukar width ngn height ikut kesesuaian.
Follow @RarraLee

Tutorial | Wishlist

1) Sign In www.blogger.com

2) Pergi ke Design >> Add A Gadget >> HTML Java Script

3) Copy Code dibawah ni ye .

<input type="checkbox" name="mybox" value="satu" checked />tyra comel<br />
<input type="checkbox" name="mybox" value="dua" disabled />tyra comel<br />
<input type="checkbox" name="mybox" value="tiga" checked />tyra comel<br />
<input type="checkbox" name="mybox" value="empat" disabled />tyra comel

Kalau korang nak wishlist korang ada selang 1 baris , copy yang bawah ni .

<input type="checkbox" name="mybox" value="satu" checked />tyra comel<br />
<br />
<input type="checkbox" name="mybox" value="dua" disabled />tyra comel<br />
<br />
<input type="checkbox" name="mybox" value="tiga" checked />tyra comel<br />
<br />
<input type="checkbox" name="mybox" value="empat" disabled />tyra comel

Note :
1. Tukarkan yang biru 

disable macam ni
checked macam ni

2. Tukarkan merah kpada wish korang .

save kat sidebar. siap... thanks to aku . haha
Follow @RarraLee

Tutorial | Buat Arrow back to top

Arrow back to top ni biasanya ada kat belah kanan bawah . yelah , senang kalau dah scroll panjang2 , tekan je . dia terus terbang ke atas semula . :D

cara-cara . 


1. Klik Layout > Add a Gadget Javascript / HTML

2. Copy kod di bawah dan Pastekan kedalamnya.


<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Top"><img src="http://dl8.glitter-graphics.net/pub/1201/1201168ofvs3093f7.gif" /></a>

3 . then save . preview kay . Oh! lupa . yang warna merah tu korang boleh tukar dengan apa yang korang suka . tak tukar pun tak apa . yang aku bagi tu dah meriah dah . :D

p/s: kat bawah ni boleh amik . free je .

http://dl8.glitter-graphics.net/pub/1201/1201168ofvs3093f7.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqfBYDmpfe8IxYS6GkpyUHVE-27aH8ysIEMvQJjQcrHlhYQEQKXbMyghbr2i1MNBX7TANinI3wUu15dmkHlPsOm7x0_A3u1WC5GPp_Lbc6m0u9d3iViePuF_SAYit7yFOBFyU_KG6LG1I/s1600/top+1.png

 

http://thisisyoke.com/wp-content/themes/shaken-grid-free/images/backTopOff.png

http://i1112.photobucket.com/albums/k492/syazmacjoy22/newone.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHwgY8awcoRXQCPoUwieCSRrghUp3OezhYpPHh65FkXfgmsfbSZfx0s6LovI2ZAqCRAArE6286bvg3iurH7T9S8cxPFvrMKb_Ux648bmWTaJXr-JxHDK4yQ19B-jCWjtPuo5iXXk0dr6U/s1600/Back+To+Top.jpg

http://i265.photobucket.com/albums/ii205/memeyukiko/tumblr_lmie64iQyY1qaghqzo1_100.png

 

http://i47.photobucket.com/albums/f158/jasaeve/Linguistics/Arrows/pink--animated_up.gif

Follow @RarraLee

Tutorial | Lazy Load

Lazy load ni untuk meringankan berat blog korang . try lah . syok bebeh . :D

Oke first ke dashboard/Design/Add a gadget/HMTL/Javascript/paste kod ini

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script><script type='text/javascript' src='https://sites.google.com/site/jquery01/jquery.lazyload.mini.js?ver=1.5.0'></script><script type="text/javascript">jQuery(document).ready(function($){if (navigator.platform == "iPad") return;jQuery("img").lazyload({effect:"fadeIn",placeholder: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPlxquiRdAzZwcGghRMpvGQYiGIlK5dIs36I38GsQY00sJCy6ru1XzDfsw-HN5qqM7o64Gfqt3RGGmFdH-Rp4uXAzkXUy05oufql4yRVuLItEYbZP-Slz5oqXIRQIRcwfWqEQ82Y0mYbU/s1600/grey.gif"});});</script>

Save . Preview .
Follow @RarraLee

Tutorial | Centerkan header

Taw tak header tu apa? korang mestilah taw kan.. tapi bagi yang newbie , header ni cam dalam setiap blog . atas sekali . cam blog aku , ni haaa...

1. Klik pada Design -> Edit HTML 

2. Guna ctrl+f untuk mencari kod ni /* Content

3. Lepas tu..copy kod di bawah ni...paste di atas kod tadi.

.Header img {
  margin-$startSide: auto;
  margin-$endSide: auto;
}

4. Preview dan kalau ok, save!!

Done..

Follow @RarraLee