Didalam kotak Add custom CSS, just tambahkan code HTML seperti dibawah ni :
#header-inner img {
margin-left: auto;
margin-right: auto;
}
margin-left: auto;
margin-right: auto;
}
then,save. :))
Steps :
- Pergi ke DASHBOARD > DESIGN > EDIT HTML
- Cari code dibawah nie dan untuk memudahkan pencarian, korang boleh tekan Ctrl + F dan paste coding ini untuk search ye.
.main-inner .column-center-inner {
- Bila dah jumpe code diatas nie, korang tambahkan code dibawah nie pulak untuk tambahkan border
border:5px solid #000000;
- Dan coding korang akan jadi mcmkat bawah nie :-
.main-inner .column-center-inner {
padding: 0 $(main.padding);
border:5px solid #000000;
}
- Explanation :-
- 5px = Code ini untuk nilai ketebalan border.
- solid = Ini code untuk jenis border. Korang boleh tukar kepada dashed atau dotted...
- #000000 = Ini untuk warna border korang. Kod warna tue boleh tukar ikut kesukaan masing-masing ye.
Bila dah siap, korang tekan button preview dulu tengok ada error ke tak ye. Kalau nampak semua ok, baru save. Dan dah siap.
Steps!
- Open Design tab then Edit HTML tab.
- Find the following code:
/* Variable definitions
====================
<Variable name="keycolor" description="Main Color" type="color" default="#66bbdd" value="#66bbdd"/> - Paste the following right below the step 2 code:
<Group description="Sidebar Background" selector="body">
<Variable name="sidebar.bgl.color" description="Left Sidebar BG Color" type="color" default="#DCDCDC" value="#DCDCDC"/>
<Variable name="sidebar.bgr.color" description="Right Sidebar BG Color" type="color" default="#666666" value="#666666"/>
</Group> - The result of step 2 and step 3 codes will look like this:
/* Variable definitions
====================
<Variable name="keycolor" description="Main Color" type="color" default="#66bbdd" value="#66bbdd"/>
<Group description="Sidebar Background" selector="body">
<Variable name="sidebar.bgl.color" description="Left Sidebar BG Color" type="color" default="#DCDCDC" value="#DCDCDC"/>
<Variable name="sidebar.bgr.color" description="Right Sidebar BG Color" type="color" default="#666666" value="#666666"/>
</Group>
- After that, find ]]></b:skin> and paste the following code just before it:
.column-left-inner, column-left-outer { background: $(sidebar.bgl.color); }
.column-right-inner, column-right-outer { background: $(sidebar.bgr.color); }
- Preview and Save your template.
- Open Template Designer & go to the 'Advanced' tab. You'll see the first option as 'Sidebar Background'. Open it and configure the color of right or left sidebar backgrounds!
Cara-Cara :-
- Design > Template Designer > Advanced (on left) > Add CSS (bottom of Advanced list).
Didalam kotak Add custom CSS, korang tambahkan code HTML seperti dibawah nie dan lihat perubahan pada warna background footer korang :
.footer-inner {
background: #ffff66 none;
}
background: #ffff66 none;
}
- Code yang bewarna merah ialah code HTML untuk warna yang korang pilih. Code warna nie korang boleh edit dan tukar dengan code warna yang korang semua suka dan sesuai dengan blog masing-masing. Untuk mendapatkan code warna html untuk warna-warna yang lain, korang boleh dapatkan disini ye.
Pastikan korang semua preview dulu tengok ada error ke tak ye. Kalau nampak semua ok, baru save. Dan dah siap.
Cara-caranya adalah seperti berikut
- Login ke Blogspot
- Klik Layout > Add a Gadget Javascript / HTML
- Copy kod di bawah dan Pastekan kedalamnya
<div class="widget"><h4></h4> <div class="textwidget"><p style="text-align: justify;"><script type="text/javascript"># Bahagian tulisan yang berwarna merah itu boleh ditukar dengan ayat sendiri.
/***********************************************
* Display time of last visit script- by JavaScriptKit.com
* This notice MUST stay intact for use
* Visit JavaScript Kit at http://www.javascriptkit.com/ for this script and more
***********************************************/
var days = 730; // days until cookie expires = 2 years.
var lastvisit=new Object();
var firstvisitmsg="Ini adalah kunjungan pertama anda di blog tutorial dido Selamat Datang!";
lastvisit.subsequentvisitmsg="Terima kasih kerana sudi melawat blog ini. Kunjungan terakhir anda 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><br />
<script>
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function DeleteCookie (name) {
var exp = new Date();
exp.setTime (exp.getTime() - 1);
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString();
}
var expDays = 30;
var exp = new Date();
exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
function amt(){
var count = GetCookie('count')
if(count == null) {
SetCookie('count','1')
return 1
}
else {
var newcount = parseInt(count) + 1;
DeleteCookie('count')
SetCookie('count',newcount,exp)
return count
}
}
function getCookieVal(offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
</script>
<script>
document.write("Anda pernah singgah di blog tutorial dido sebanyak <b>" + amt() + "</b> kali. Terima kasih. Datang lagi ya...")
</script></p>
</div></div>
4. Selepas itu SAVE dan VIEW..
Selamat Mencuba!
2. Klik Layout > Add a Gadget >HTML/Javascript .
3. Copy code di bawah ini dan pastekan kedalamnya
<SCRIPT language=JavaScript>
<!-- http://www.spacegun.co.uk -->
var message = "TULISLAH APA KORANG NAK TULIS";
function rtclickcheck(keyp){ if (navigator.appName == "Netscape" && keyp.which == 3){ alert(message); return false; }
if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2) { alert(message); return false; } }
document.onmousedown = rtclickcheck;
</SCRIPT>
1. Login ke Blogspot .
2. Klik Layout > Add a Gadget Javascript / HTML
3. Copy kod di bawah dan Pastekan kedalamnya.
<a href='#' style='position: fixed; right: 1px; bottom: 260px;' title='back to top'><img height="21" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFP_4ouKwx7aM6WtULyFQEK9gHeFgR6lAlF2Uhd6j5bftvEw9JgrKz8HZnwz5lpdvTevWKDjnf_MjcYHmOlfK6ISTmwdGTSf5vfN6KqIkW5Zapco-DFUZQAXki85aCMDQ1Tbgc_n6FdS8/s320/up.png" width="21" /></a><a href='http://sweetpoisontutorial.blogspot.com/' style='position: fixed; right: 1px; bottom: 287px;' title='home'><img height="21" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhW3zqrC4tMwtwjU5egd_zUIxNnd7TGh9_QYk7kJ4dkFl7Mwx2i4MkA-Ps2UkHe-vc-bXUhyLMeRNbHYanGaLy6V5Be-okbM2CZCUdvlh26WEaR3EbE2dEWXd3T2WyVDnuJ91hI67AX2S0/s320/home1.png" width="21" />
#right-left untuk kedudukan kanan atau kiri
### tak payah letak tajuk kat add widget tu..nanti menyemak!
1.Login ke Blogspot .
2. Klik Layout/design > klik Edit HTML
3. Cari kode ini ye kawan-kawan.
2. Klik Layout/design > klik Edit HTML
3. Cari kode ini ye kawan-kawan.
<head>
Gunakan ctrl F untuk memudahkan proses mencari.
Ambil<head>yang paling atas sekali.
4. Selepas itu copykan code di bawah dan pastekan di bawah kode yang di atas
<script language='JavaScript'>var txt="Welcome to BLOG THE MOUSTACHE";var kecepatan=100;var segarkan=null;function bergerak() { document.title=txt;txt=txt.substring(1,txt.length)+txt.charAt(0);segarkan=setTimeout("bergerak()",kecepatan);}bergerak();</script>
5. Ayat Welcome to BLOG THE MOUSTACHE itu tukarlah dengan ayat anda!
6. Klik SAVE TEMPLETE...view dan tengok hasilnya.
Selamat mencuba!
Salam! Jom masuk kelas tutorial Miss Farah.
Hari ini mood begitu baik sekali membuat tutorial..
Hari ini nak ajar tutorial yang mudah lagio senang!
Anda tahu tak apa itu button pada blog?
Contoh macam ini..lihat ye
Sila clik kalau nak tahu apa dia button untuk blog!
Cara2 nak buat amat2 la mudah seperti minum air!..
<a href="http://www.facebook.com/hugsmuahxmuahx?ref=tn_tnmn" target="blank"><button>My Facebook</button></a>Sila ubah link yang berwarna biru ke LINK anda.
Sila ubahtulisan merah ke tajuk button anda
Kemana nak letak button ini?
- Login ke Blogspot
- Klik Layout > Add a Gadget Javascript / HTML
- Copy kod di atas dan Pastekan kedalamnya.
- Save dan priview.
- Login ke Blogspot
- Klik Layout > Add a Gadget Javascript / HTML
- Copy kod di bawah dan Pastekan kedalamnya.
<p>Tapi sebelum itu tukar la benda2 ini sebelum SAVE..
<div style="background-color: #F8B4BF;">
Home |
<a href="http://hamsterXXX.blogspot.com/" title='blog hamster aku'>My Hamster</a> |
<a href="http://www.facebook.com/XXX" target" title='Add la My Facebook'>Facebook</a> |
<a href="http://XXX.blogspot.com/search/label/resepi" title='jom memasak'>My Resepi</a> |
<a href="http://twitter.com/#!/XXX" target" title='Follow My Twitter'>My Twitter</a> |
<a href="http://www.tagged.com/XXX" target" title='Jom Tag'>Tagged</a> |
<br />
</div>
</p>
#Yang berwarna hijau itu adalah kod warna untuk latar belakang..ubah la ikut kesesuaian blog anda
#Yang berwarna biru adalah LINK anda.
# warna kuning untuk title
# warna merah tajuk bila dihover
# yang dilight merupakan kod untuk satu menubar...boleh ditambah2..mengikut keperluan..
4. then, SAVE dan VIEW....dragkan widget dibawah header ..tengok hasilnya..ting tong!
*info - kalau nak buat blockquote cuma highlightkan tulisan yang nak di blockquote dan tekan tanda seperti di bawah
 |
| yang kotak merah itu adalah blackquote |
ini lah blackquate box i..cantikan pink! u all nak? jom belajar ye sayang..i tak kedekut ilmu.
CARA 1 : ( templete berbeza, so coding pun berbeza..harap maklum )
1.Login ke Blogspot, clik design/ layout > Edit HTML
2. Lepas itu, sila cari code di bawah.. gunakan Ctrl F untuk memudahkan pencarian
.post-body {3. Sila Copy code di bawah dan paste kan di ATAS code .post-body { seperti yang u all cari tadi
.post blockquote { background-image:url(URL GAMBAR BACKGROUND BLOCKQOUTE); -moz-border-radius-topleft: 10px; -moz-border-radius-bottomright: 10px; padding: 6px; Border: 3px solid #FF0080; margin:1em 20px; }
4. Code yang i warnakan MERAH, boleh la ditukar mengikut citarasa.
5. URL GAMBAR BACKGROUND BLOCKQOUTE boleh la direplace dengan URL u all
6. Save
CARA 2 :Memandangkan ramai yang tak boleh test cara di atas..so I akan ajar coding ini pula..sila ambil perhatian ye..
1.Login ke Blogspot, clik design/ layout > Edit HTML
2. Lepas itu, sila cari code di bawah.. gunakan Ctrl F untuk memudahkan pencarian
.post blockquote {3.Copy dan pastekan code di bawah, di bawah .post blockquote {
4. Sila letakkan URL anda di URL imagebackground: url(URL image);border-top: 1px dashed #000000;border-left: 1px dashed #000000;border-right: 1px dashed #000000;border-bottom: 1px dashed #000000;
5. 1px adalah ketebalan : lagi banyak nombor lagi tebal, dashed boleh diubah kepada solid atau dotted.
6. Save.. Sila tinggal komen selepas mencuba!!
CARA 3 ( Template Designer ) :Tak jadi ye??memandangkan ramai yang memakai Template Designer dan cara di atas mungkin sesuai untuk Minima Template.. Aku ajarkan cara ini pula.. Haaa ambikk sampai 3 sekali tutorial Kotak Blockquote. Semua ini sebab sayangkan reader la...Nanti LIKE2 la Fage aku tau..@___@
1. Sila Klik Dashboard - Design - Edit HTML
2. Klik Download Full Template (kalau takut template korang hancuzz)
3. Tick pada kotak Expand Widget Templates
4. Cari kod di bawah ini di dalam kotak HTML, kalau nak mudah mencari tanpa sakit mata sila tekan Ctrl F sahaja
.post blockquote {5. Gantikan code yang dicari di atas dengan code ini
margin:1em 20px;
}
.post blockquote {
background: #F430C0;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;
padding: 6px;
Border: 1px solid #020202;
margin:1em 20px;
}
@ #F430C0 untuk warna background nya.. Kalau nak gantikan dengan gambar sila replace code background: #F430C0; dengan code ini background-image:url(URL GAMBAR BACKGROUND BLOCKQOUTE);
6. Dan SAVE.. tengoklah hasilnya..
p/s: Tak boleh jadi jugak tak tahulah..mungkin ada penunggu dalam blog korang muahaha..
http://content.mycutegraphics.com/backgrounds/winter/winter-hearts-backgrounds.gif
http://content.mycutegraphics.com/backgrounds/winter/winter1.gif
http://www.mycutegraphics.com/backgrounds/swirly/th-swirlybg10.gif
http://mycutegraphics.com/backgrounds/stars/th-starbg56.gif
http://www.mycutegraphics.com/backgrounds/dots/dotbg126.gif
http://www.mycutegraphics.com/backgrounds/hearts/hrtbg106.gif
http://content.mycutegraphics.com/backgrounds/color/colorbg25.gif
http://content.mycutegraphics.com/backgrounds/blue/blue-background6.gif
#korang boleh guna background yang aku bagi ni. Tips, better guna background colour soft untuk lebih menarik.
1. Sila sign in blogger > Dashboard > Design/Layout > Edit HTML >Tick Expand Widget Template.
2. Sila cari code di bawah ini ye kawan-kawan..ingin memudahkan pencarian anda hanya tekan Ctrl F
3. Dah jumpa code itu...sila COPY code ini</body>
<center>I LOVE BLOG TUTORIAL DIDO</center>
dan paste DI ATAS code </body>
4. Gantikan I LOVE BLOG TUTORIAL DIDO dengan ayat u all. Preview dulu..kalau dah jadi sila SAVE.
Senangkan..ayat i pun skema je hahaha...komen bila dah try!!
2. Klik Layout > Add a Gadget >HTML/Javascript .
3. Copy code di bawah ini dan pastekan kedalamnya
<script language=JavaScript>
<!--
//Disable right click script III- By Renigade (renigade@mediaone.net)
//For full source code, visit http://www.dynamicdrive.com
var message="";
///////////////////////////////////
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
// -->
</script>
4. Lepas itu save then test..menjadi?
2. Klik Layout > Add a Gadget >HTML/Javascript .
3. Copy code di bawah ini dan pastekan kedalamnya
<script type="text/javascript">4. Sila SAVE dan tengok hasil tangan anda..
/***********************************************
* Disable Text Selection script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
function disableSelection(target){
if (typeof target.onselectstart!="undefined") //IE route
target.onselectstart=function(){return false}
else if (typeof target.style.MozUserSelect!="undefined") //Firefox route
target.style.MozUserSelect="none"
else //All other route (ie: Opera)
target.onmousedown=function(){return false}
target.style.cursor = "default"
}
//Sample usages
//disableSelection(document.body) //Disable text selection on entire body
//disableSelection(document.getElementById("mydiv")) //Disable text selection on element with id="mydiv"
</script>
<script type="text/javascript">
disableSelection(document.body) //disable text selection on entire body of page
</script>
p/s nak curi i punya tutorial? i tak kisah asalkan u all letak kredit berlink kepada i..:) hehehe...
1.Login ke Blogspot, clik design/ layout > Edit HTML
2. Cari code ini, nak mudah tekan Ctrl F
3. Dah jumpa code tadi sila COPY dan PASTE code ini DI ATAS code tadi.<b:skin><
Ini adalah contoh divider...nak lain?belambak sangat..
Apa perlu dibuat? Ikuti langkah ini satu persatu ye..tak menjadi u tanggung sendiri..ayooo
1.Login ke Blogspot, clik design/ layout > Edit HTML > jangan lupa untuk tick pada Expand Widget Templates.
2. Untuk langkah keselamatan sila download full templete ye..mana tahu kot tersalah langkah pula..boleh back up semula.
3. Cari code ini..Guna Ctrl F untuk memudahkan mata anda..
4. Kalau dah jumpa sila REPLACE dengan code di bawah, lain templete lain jenis so ambil bahagian .post { sampai }.post {
margin: 0 0 1.5em;
padding-bottom: 1.5em;
}
.post {5. Sila letakkan url anda di url divider anda.
background: url(url divider anda);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:5.5em;
}
6. Lepas dah letak URL sila PREVIEW dulu..then dah puas hati dan menjadi SAVE je..
Selamat mencuba ye..sila komen dah cuba.
2. Sebelum korang mengikuti langkah selanjutnya, ingin aku mengingatkan bahawa korang Download Full Templates terlebih dahulu k. Kalau silap ada back up. Nanti jangan salahkan aku bila tak jadi.
3. Cari code di bawah, nak mudah korang tekan Ctrl F, lepas keluar kotak Find, paste code di bawah ke dalam kotak Find. Faham? ni dah panjang lebar penjelasannya..
expr:title='data:newerPageTitle'><data:newerPageTitle/>4. Replace/padamkan code yang dimerahkan ( Newer Page )dan gantikan dengan code ini
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNby0TH8fdsNOOnR4vZBLyN9vkhXZR7xYL9wJBItRsXOKAjxiKR7M54VIfRufkXGJJS-LvIIMBanmRCPaHO_u8z9i8fdLDmIagsyVcbpvmxrfAHhlRlTZeHIj1dIseIZH09phqVqFJSXw/s1600/638148hihxwgn8gx.gif'/># Boleh tukar yang biru dengan icon/gambar url korang
5. Cari code ini untuk gambar older pages pula :
expr:title='data:olderPageTitle'><data:olderPageTitle/>6. Replace/padamkan code merah dan gantikan dengan code di bawah
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFJzS0x-N1hVVFf314ZsKiOGxo5jxCizyEJDtvrCVWNkBloAJ788CXbhPd_UVFmOHgXh7u5fRcBJlZZzy5UdHfl_gHLru86ZuLBmPeeN7j_nIMgy_ucJhz_DKvBj7PYQX1T9nek5_aoqw/s1600/older.gif'/># Boleh tukar yang biru dengan icon/gambar url korang
7. Cari code ini untuk Home pula :
expr:href='data:blog.homepageUrl'><data:homeMsg/>8. Macam biasa, replace/padamkan code yang dimerahkan dan gantikan dengan code di bawah
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQrlAeVrcOiMPKb9RXjjh5SerQ3uNn_49EFVBHeuD6dUNLCIVsoC9T8oHS6CJUYO-cj37nBF_S2P89hF7s8YVUZd6WxAhBpxa3BJaSb5tcBixq13TmKLNlLl7mnsjdN48jopK-iSJWvIA/s1600/home+sweet+home.gif'/># Boleh tukar yang biru dengan icon/gambar url korang
9. Preview dan SAVE. Kadang-kadang gambar korang tak muncul bila preview. So SAVE je.
2. Sila copy dan paste ke dalam ruangan HTML/ Java Script
<form name=myform>Sebelum itu aku nak bagitahu benda ni dulu :
<input type="checkbox" name="mybox" value="satu" checked />cinta <br />
<input type="checkbox" name="mybox" value="dua" checked />kereta <br />
<input type="checkbox" name="mybox" value="tiga" checked />hamster <br />
<input type="checkbox" name="mybox" value="empat" disabled />malas <br />
<input type="checkbox" name="mybox" value="lima" checked />laptop <br />
<input type="checkbox" name="mybox" value="enam" disabled />hater <br />
</form>
# Satu sampai enam yang warna biru tu..jumlah berapa wish list korang. Kalau nak sampai seratus pun tak apa tulis je.
# Tulisan warna merah merupakan perkara/benda yang korang nak listkan.
# Tulisan warna pink adalah benda yang korang nak untuk list..macam target koranglah. Bila korang letak checked dia akan ada tanda "right"
# Tulisan warna oren benda yang korang taknak "rightkan"
# Kalau korang nak tambah lagi bolehlah copy tanda ini dan letak kat bawahnya ye sebelum </form> bahagian last..
3. Lepas dah edit semua di atas. Bolehlah di SAVE.
2. Copy code di bawah ke dalam Html/Java Script
<script type='text/javascript'>3. Kalau korang nak tukar warna sparklingcursor cuma replace code biru itu. Aku guna pink colour. Kalau korang suka tak payah la ubah apa-apa..tempek je.
</script>
<script type='text/javascript'>
// <![CDATA[
var colour="#FF00E1";
var sparkles=100;
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i<sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(1, 5);
var rdow=createDiv(5, 1);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="3px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="3px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";
star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c<sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]<shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}
}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*3;
if (tinyy[i]<shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {
tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height+"px";
div.style.width=width+"px";
div.style.overflow="hidden";
div.style.backgroundColor=colour;
return (div);
}
// ]]>
</script>
4. Lepas itu bolehlah di SAVE. Korang cuba tengok dan gerakkan cursor korang pasti ada hujan versi salji turun.. ok daaa..
2. Copy code di bawah dan paste ke dalam Html/Java Script
<style type="text/css">3. Sebelum SAVE tukarlah benda-benda ini dulu ye.
/* Circle Text Styles */
#outerCircleText {
font-style: normal;
font-weight: normal;
font-family: 'verdana';
color: #FF0080;
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
</style>
<script type="text/javascript">
;(function(){
var msg = "CURSOR SANGAT CANTIK";
var size = 24;
var circleY = 0.75; var circleX = 2;
var letter_spacing = 5;
var diameter = 10;
var rotation = 0.4;
var speed = 0.2;
if (!window.addEventListener && !window.attachEvent || !document.createElement) return;
msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,
mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},
makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},
drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},
init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},
ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};
o.id = 'outerCircleText'; o.style.fontSize = size + 'px';
if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};
})();
</script>
Verdana untuk jenis font.
#FF0080 untuk warna tulisan yang aku buatkan ni warna pink.
CURSOR SANGAT CANTIK gantikan dengan perkataan korang ye.
4. Lepas itu save SAVE dan tengok hasil yang terjadi.
2. Cari code di bawah, nak mudah cuma tekan Ctrl F dan paste code di bawah di dalam kotak find ( panjang lebar ni, faham? )
]]></b:skin>3. Dah jumpakan? Korang copy dan paste code di bawah sebelum/di atas code yang korang cari tadi.
a:hover {font-size: 22px;4. 22px tu adalah besar font ketika di hover atau di sentuh. Kalau nak besar atau kecil korang ubah la.
font-weight: bold;text-decoration: none;}
5. Preview dan sentuh mana-mana link..menjadi? Sila SAVE.
2. Cari code ini, nak mudah tekan ctrl F je dan pastekan code di bawah dalam kotak find..
/* Header3. Lepas jumpa code di atas, copy code di bawah dan paste di atas atau sebelum code yang dicari tadi.
/*------ IMAGE ANIMATION------*/img {filter:alpha(opacity=100);-webkit-transition-duration:.5s;} img:hover {filter: alpha(opacity=60); opacity: .6; -webkit-box-shadow: 0px 0px 10px #000000; -moz-box-shadow: 0px 0px 10px #000000; -webkit-border-top-right-radius:10; -webkit-border-top-left-radius:10; -webkit-border-bottom-right-radius:10; -webkit-border-bottom-left-radius:10;}img:hover {filter: alpha(opacity=60); opacity: .60; border: 1px solid#000000; border-radius: 30px; -moz-border-radius: 30px;}-moz-opacity:1.0;opacity:1.0;}img:hover {filter:alpha(opacity=80);-moz-opacity:0.80;opacity:.80;}u {text-decoration:underline;border-bottom: 2px solid #F781BE;padding: 0px;}4. Kalau nak ubah warna boleh tukar code #000000 kepada warna kesukaan anda.
5. Silalah SAVE dan tengok hasil tangan anda!
Right to Left Marquee
<marquee>TEXT</marquee>
Left to Right Marquee
<marquee direction="right">TEXT</marquee>
Alternate Marquee
<marquee behavior="alternate">TEXT</marquee>
Up Marquee
<marquee direction="up">TEXT</marquee>
Down Marquee
<marquee direction="down">TEXT</marquee>
Up/Down Alternate Marquee
<marquee direction="up" behavior="alternate">TEXT</marquee>
Zig Zagging Marquee
<marquee behavior="alternate" direction="up" width="80%"><marquee direction="right">TEXT</marquee></marquee>
Alternating Zig Zagging Marquee
<marquee behavior="alternate" direction="up" width="80%"><marquee direction="right" behavior="alternate">TEXT</marquee></marquee>
>>Highlight Text<<
<marquee behavior="alternate" width="10%">>></marquee>TEXT<marquee behavior="alternate" width="10%"><<</marquee>
>>Oppside Highlight Text <<
<marquee behavior="alternate" width="10%">>></marquee>TEXT<marquee behavior="alternate" width="10%"><<</marquee>
COLOUR TEXT
<font color="#FFFFFF"><marquee direction="left" style="background:#EF0B0B">TEXT</marquee></font>* code #FFFFFF untuk font, #EF0B0B untuk background
BORDER WITH TEXT
<marquee style="border:#EF0B0B 2px SOLID">TEXT</marquee>*code #EF0B0B untuk border, 2px = tebal border, SOLID boleh tukar DOTTED atau DASHED
Hiding Marquee
<marquee behavior="alternate"><marquee width="150">TEXT</marquee></marquee>
Wave Marquee
<marquee behavior=alternate direction=up scrollamount=2 scrolldelay=65 height=80 style="Text-align;filter:wave(add=0,phase=1, freq=1,strength=15,color=.FFFFFF)"><center>TEXT1<br>TEXT2</center></marquee>Uhh penat main coding.. Ok selamat mencuba! Nanti komen ye.. ok daaa..
2. Cari code ini, nak mudah tekan Ctrl F, masukkan code dalam kotak find dan enter!
</head>3. Copy code dibawah dan paste selepas/di bawah code yang dicari tadi.
<script type='text/javascript'>4. Gantikan, Terima Kasih, sila datang lagi dengan ayat korang.
// goodbye alert
function goodbye(){
alert(' Terima Kasih, sila datang lagi ');
}
parent.window.onunload=goodbye;
</script>
5. Save. buka blog korang dan close..ada tak ucapan itu sebelum close? try lah..semoga berjaya!
2. Copy code di bawah dan paste ke dalam Html/Java Script
<script>
//Here you can add your own picture for snow. Just change the url
var snowsrc="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3vsNNspfjJ6lgj93IcLvNV0QXoYWwJ8f397PSzdlrz0q1wkbOoKmzX1zQqu78-nIR8OzQl9ogwFXJtzbQsKwft9JFw7LuaZEPf-hS7xaC4GJVKiipDUrVCDJ-WOsY2d2KJUUjl_5DDzI/s1600/whiteshowNF.png"
//how many snowflakes there will be (currently 12)
var no =40;
//How fast will the snow disappear (0 is never)
var hidesnowtime = 0;
//The height the snow will reach before it disappears ("windowheight" or "pageheight")
var snowdistance = "pageheight";
///////////////////////////////End of Settings///////////////////////////////////
var ie4up = (document.all) ? 1 : 0;
var ns6up = (document.getElementById&&!document.all) ? 1 : 0;
function iecompattest()
{
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
var dx, xp, yp;
var am, stx, sty;
var i, doc_width = 800, doc_height = 600;
if (ns6up)
{
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
else
if (ie4up)
{
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
for (i = 0; i < no; ++ i)
{
dx[i] = 0;
xp[i] = Math.random()*(doc_width-50);
yp[i] = Math.random()*doc_height;
am[i] = Math.random()*20;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
if (ie4up||ns6up)
{
if (i == 0)
{
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://rftactical.darkbb.com/index.htm\"><img src='"+snowsrc+"' border=\"0\"><\/a><\/div>");
}
else
{
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"><\/div>");
}
}
}
function snowIE_NS6()
{
doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")? iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;
for (i = 0; i < no; ++ i)
{
yp[i] += sty[i];
if (yp[i] > doc_height-50)
{
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
}
dx[i] += stx[i];
document.getElementById("dot"+i).style.top=yp[i]+"px";
document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px";
}
snowtimer=setTimeout("snowIE_NS6()", 10);
}
function hidesnow()
{
if (window.snowtimer) clearTimeout(snowtimer)
for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"
}
if (ie4up||ns6up)
{
snowIE_NS6();
if (hidesnowtime>0)
setTimeout("hidesnow()", hidesnowtime*1000)
}
</script>
3. Warna yang aku merahkan tu, warna snow ball. Kalau korang nak tukar boleh pilih warna di bawah. ( yang sedia ada tu warna putih )
Blue Snow Ball
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFcKuzyyY44TZoLwENwYm1a57_zQTYwfTxLISrC0uhgq4jQ9iUKSyZORuVoMtfTlGAY-sHpPhumZ5oIMnyi0JnBrhFXRvgk119ljDl5O0Ifhomn6SqmbBtqkhqqdCR9fswGsaqCJe1Ej4/s1600/bluesnowNF.png
Pink Snow Ball
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtKfKWeRj18n02S3M29r1f_wPKAMaCwvYWkFpuvdFWYgzSlB3Mf_vvy2zL-wGHmDH-e53XqIbndWu316MCIYyFBcBWYqPivMrWeF4vDzWqn9sNISBoxLmaCUpIhFJ6Cv9UFAornijAJvQ/s1600/redshowNF.pngBlack Snow Ball
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFAixd7QqXJwTAmE3ZvSCfs07SRXWxK1Fw-5ZDwXYSCeQvXa3BqOFhlk6Fnp-8yMl0F6h0JDFhvkpvJTS0Qwr-ImsBAuUQhE7sQhXFvt9HzyIyvMoC5XHpovxGhtFQIwIDAl5lbHVlZSo/s1600/blacksnowNF.png
4. Save. dan tengok blog korang sejuk ke tak ?? muahaha.
#nak colour pelik-pelik sila create sendiri yerr.. k baiiii
2. Copy code di bawah dan paste ke dalam Html/Java Script
Pink Fireworks
<script type="text/javascript" src="https://sites.google.com/site/jeritanblog/javascript/a_pink.js"></script>Blue Fireworks
<script type="text/javascript" src="https://sites.google.com/site/jeritanblog/javascript/a_blue.js"></script>3. Save dan tengok hasilnya.
Æ æ ❖
{｡^◕‿◕^｡} (◕^^◕) ✖✗✘♒
♬✄ ✂✆✉✦✧♱ ♰♂♀☿❤❥ ❦❧
™®©♡♦ ♢♔♕♚♛★ ☆✮ ✯☄☾☽
☼☀☁☂☃☻ ☺☹ ☮۞۩ εїз☎☏¢
☚☛☜☝☞☟✍
✌☢☣☠☮☯ ♠♤♣♧♥ ♨๑❀✿ ψ☪☭
♪ ♩♫℘ℑ ℜℵ♏ηα ʊϟღツ回 ₪™ ©®¿¡½⅓
⅔¼¾⅛⅜⅝⅞℅
№⇨❝❞ ◠◡╭╮╯╰ ★☆⊙¤㊣
★☆♀◆◇↑↓→ ←↘↙♀ ♂┇┅﹉﹊
﹍﹎╭╮╰╯ *^_^* ^*^ ^-^
^_^ ^︵^∵∴‖ ︱︳︴﹏
﹋﹌♂♀ ♥♡☜☞☎ ☏⊙◎☺☻ ►◄
▧▨ ♨◐◑↔↕ ▪▫☼♦▀ ▄█▌▐ ░▒▬♦◊
◦☼♠♣▣ ▤▥▦▩ ぃ◘◙◈♫ ♬♪♩♭♪ の☆→あ ￡❤
｡◕‿◕｡✎✟ஐ ≈๑۩ ۩.. ..۩۩๑ ๑۩۞۩๑ ✲
❈➹ ~.~◕ ‿-｡☀☂☁ 【】┱┲❣ ✚✪✣ ✤✥
✦❉ ❥❦❧❃ ❂❁❀✄☪ ☣☢☠☭♈
✓✔✕ ✖㊚㊛ *.:｡ ✿*ﾟ‘ﾟ･ ⊙¤㊣★☆
♀◆◇回□〓
→←↘↙ ♀♂┇┅﹉ ﹊﹍﹎ ╭╮╰╯ *^_^*
^*^ ^-^ ^_^ ^︵^∵ ∴‖ ︱︳ ︴﹏﹋﹌
♂♀♥♡☜ ☞☎☏⊙ ◎☺☻
►◄ ▧▨♨◐◑ ↔↕ ▪▫ ☼♦
▌▐░▒▬ ♦◊◦☼ ♠♣▣▤▥ ▦▩ぃ◘◙ ◈
♫♬♪ ♩♭♪の☆ →あ￡❤｡ ◕‿◕｡ ✎✟ஐ≈
๑۩۩.. ..۩۩๑๑۩۞ ۩
๑✲❈ ➹ ~.~◕‿-｡ ☀☂☁【】
┱┲❣✚ ✪✣✤✥ ✦❉❥❦
❧❃❂❁❀ ✄☪☣☢☠ ☭♈ ✓
✔✕✖㊚ ㊛ *.:｡✿*ﾟ ‘ﾟ･ ◊♥▫■๑»«¶
ஐ©† εïз♪ღ♣ ♠•± °•ิ.•ஐஇ *×○▫
♂•♀◊©¤ ▲↔™®☎ε їз♨ ☏
☆★ ▽△▲ ∵∴∷ ＃♂♀♥♠♣
♧♤♧ ♡♬♪ ♭♫♪ﻬஐღ ↔↕↘••● ¤╬﹌
▽☜♥☞ ♬✞♥♕☯☭☠☃ ─ ━
▰ ▱◆ ◇ ◈ ◉ ◊ ○ ◌ ◍ ◎ ● ◐ ◑ ◒ ◓ ◔
◕ ◖ ◗ ◘ ◙ ◚ ◛ ◜ ◝ ◞ ◟ ◠ ◡ ◢ ◣
◤ ◥ ◦ ◧ ◨ ◩ ◪ ◫ ◬ ◭ ◮ ◯ ◰ ◱ ◲ ◳ ◴ ◵ ◶ ◷
◸ ◹ ◺ ◻ ◼ ◽ ◾ ◿ ☀ ☁ ☂ ☃ ☄ ★ ☆ ☇ ☈
☊ ☋ ☌ ☍ ☎ ☏ ☐ ☑ ☒ ☓ ☔ ☕ ☖ ☗ ☘ ☙
☟ ☠ ☡ ☢ ☣ ☤ ☥ ☦ ☧ ☨ ☩ ☪ ☫ ☬ ☭ ☮ ☯
☰ ☱ ☲ ☳ ☴ ☵ ☶ ☷ ☸ ☹ ☺ ☻ ☼ ☽ ☾
☿ ♀ ♁ ♂ ♃ ♄ ♅ ♇ ♔ ♕ ♖ ♗
♘ ♙ ♚ ♛ ♜ ♝ ♞ ♟ ♠ ♡ ♢ ♣
♤ ♥ ♦ ♧ ♨ ♰ ♱ ´ ῾ ‖ ‗ ‘ ’ ‚ ‛ “ ” „ ‟ † ‡ • ‣
․ ‥ … ‧ ‰ ‱ ′ ″ ‴ ‵ ‶ ‷ ‸ ‹ ›
※ ‼ ‽ ‾ ‿ ⁀ ⁁ ⁂ ⁃ ⁄ ⁅ ⁆ ⁊ ⁋ ⁌ ⁍ ⁎ ⁏ ⁐ ⁑ ⁒ ⁓ ⁔
∕ ∖ ∗ ∘ ∙ √ ∛ ∜ ∝ ∞ ∟ ∠ ∡ ∢ ∣ ∤ ∥ ∦ ∧ ∨ ∩ ∪
∴ ∵ ∶ ∷ ∸ ∹ ∺ ∻ ∼ ∽ ∾ ∿ ≀ ≁ ≪ ≫
≬ ≭ ≮ ≯ ≰ ≱ ≲ ≳ ≴ ≵ ≶ ≷ ≸ ≹ ≺ ≻ ≼ ≽ ≾ ≿ ⊀
⊁ ⊂ ⊃ ⊄ ⊅ ⊆ ⊇ ⊈ ⊉ ⊊ ⊋ ⊌ ⊍ ⊎ ⊏ ⊐ ⊑ ⊒ ⊓ ⊔ ⊕ ⊖ ⊗ ⊘ ⊙
⊚ ⊛ ⊜ ⊝ ⊞ ⊟ ⊠ ⊡ ⊬ ⊭ ⊮ ⊯ ⊰ ⊱ ⊲ ⊳ ⊴ ⊵ ⊶ ⊷ ⊸ ⊹ ⊺ ⊻
⊼ ⊽ ⊾ ⊿ ⋀ ⋁ ⋂ ⋃ ⋄ ⋅ ⋆ ⋇
⋈ ⋉ ⋊ ⋋ ⋌ ⋍ ⋎ ⋏ ⋐ ⋑ ⋒ ⋓ ⋔ ⋕
⋖ ⋗ ⋘ ⋙ ⋚ ⋛ ⋜ ⋝ ⋞ ⋟ ⋠ ⋡ ⋢ ⋣ ⋤ ⋥ ⋦ ⋧ ⋨ ⋩ ⋪ ⋫ ⋬
◿ ☀ ☁ ☂ ☃ ☄ ★ ☆ ☇
☊ ☋ ☌ ☍ ☎ ☏ ☐ ☑ ☒ ☓ ☔ ☕ ☖ ☗
☘ ☙ ☟ ☠ ☡ ☢ ☣ ☤ ☥ ☦ ☧ ☨ ☩ ☪ ☫ ☬
☭ ☮ ☯ ☰ ☱ ☲ ☳ ☴ ☵ ☶ ☷ ☸ ☹ ☺ ☻ ☼
☽ ☾ ☿ ♀ ♁ ♂ ♃ ♄ ♅ ♇
♎ ♏ ♐ ♑ ♒ ♓ ♔ ♕ ♖ ♗ ♘ ♙
♚ ♛ ♜ ♝ ♞ ♟ ♠ ♡ ♢ ♣ ♤ ♥ ♦ ♧ ♨ ♰ ♱ ☫
{｡^◕‿◕^｡} (◕^^◕) ✖✗✘♒
♬✄ ✂✆✉✦✧♱ ♰♂♀☿❤❥ ❦❧
™®©♡♦ ♢♔♕♚♛★ ☆✮ ✯☄☾☽
☼☀☁☂☃☻ ☺☹ ☮۞۩ εїз☎☏¢
☚☛☜☝☞☟✍
✌☢☣☠☮☯ ♠♤♣♧♥ ♨๑❀✿ ψ☪☭
♪ ♩♫℘ℑ ℜℵ♏ηα ʊϟღツ回 ₪™ ©®¿¡½⅓
⅔¼¾⅛⅜⅝⅞℅
№⇨❝❞ ◠◡╭╮╯╰ ★☆⊙¤㊣
★☆♀◆◇↑↓→ ←↘↙♀ ♂┇┅﹉﹊
﹍﹎╭╮╰╯ *^_^* ^*^ ^-^
^_^ ^︵^∵∴‖ ︱︳︴﹏
﹋﹌♂♀ ♥♡☜☞☎ ☏⊙◎☺☻ ►◄
▧▨ ♨◐◑↔↕ ▪▫☼♦▀ ▄█▌▐ ░▒▬♦◊
◦☼♠♣▣ ▤▥▦▩ ぃ◘◙◈♫ ♬♪♩♭♪ の☆→あ ￡❤
｡◕‿◕｡✎✟ஐ ≈๑۩ ۩.. ..۩۩๑ ๑۩۞۩๑ ✲
❈➹ ~.~◕ ‿-｡☀☂☁ 【】┱┲❣ ✚✪✣ ✤✥
✦❉ ❥❦❧❃ ❂❁❀✄☪ ☣☢☠☭♈
✓✔✕ ✖㊚㊛ *.:｡ ✿*ﾟ‘ﾟ･ ⊙¤㊣★☆
♀◆◇回□〓
→←↘↙ ♀♂┇┅﹉ ﹊﹍﹎ ╭╮╰╯ *^_^*
^*^ ^-^ ^_^ ^︵^∵ ∴‖ ︱︳ ︴﹏﹋﹌
♂♀♥♡☜ ☞☎☏⊙ ◎☺☻
►◄ ▧▨♨◐◑ ↔↕ ▪▫ ☼♦
▌▐░▒▬ ♦◊◦☼ ♠♣▣▤▥ ▦▩ぃ◘◙ ◈
♫♬♪ ♩♭♪の☆ →あ￡❤｡ ◕‿◕｡ ✎✟ஐ≈
๑۩۩.. ..۩۩๑๑۩۞ ۩
๑✲❈ ➹ ~.~◕‿-｡ ☀☂☁【】
┱┲❣✚ ✪✣✤✥ ✦❉❥❦
❧❃❂❁❀ ✄☪☣☢☠ ☭♈ ✓
✔✕✖㊚ ㊛ *.:｡✿*ﾟ ‘ﾟ･ ◊♥▫■๑»«¶
ஐ©† εïз♪ღ♣ ♠•± °•ิ.•ஐஇ *×○▫
♂•♀◊©¤ ▲↔™®☎ε їз♨ ☏
☆★ ▽△▲ ∵∴∷ ＃♂♀♥♠♣
♧♤♧ ♡♬♪ ♭♫♪ﻬஐღ ↔↕↘••● ¤╬﹌
▽☜♥☞ ♬✞♥♕☯☭☠☃ ─ ━
▰ ▱◆ ◇ ◈ ◉ ◊ ○ ◌ ◍ ◎ ● ◐ ◑ ◒ ◓ ◔
◕ ◖ ◗ ◘ ◙ ◚ ◛ ◜ ◝ ◞ ◟ ◠ ◡ ◢ ◣
◤ ◥ ◦ ◧ ◨ ◩ ◪ ◫ ◬ ◭ ◮ ◯ ◰ ◱ ◲ ◳ ◴ ◵ ◶ ◷
◸ ◹ ◺ ◻ ◼ ◽ ◾ ◿ ☀ ☁ ☂ ☃ ☄ ★ ☆ ☇ ☈
☊ ☋ ☌ ☍ ☎ ☏ ☐ ☑ ☒ ☓ ☔ ☕ ☖ ☗ ☘ ☙
☟ ☠ ☡ ☢ ☣ ☤ ☥ ☦ ☧ ☨ ☩ ☪ ☫ ☬ ☭ ☮ ☯
☰ ☱ ☲ ☳ ☴ ☵ ☶ ☷ ☸ ☹ ☺ ☻ ☼ ☽ ☾
☿ ♀ ♁ ♂ ♃ ♄ ♅ ♇ ♔ ♕ ♖ ♗
♘ ♙ ♚ ♛ ♜ ♝ ♞ ♟ ♠ ♡ ♢ ♣
♤ ♥ ♦ ♧ ♨ ♰ ♱ ´ ῾ ‖ ‗ ‘ ’ ‚ ‛ “ ” „ ‟ † ‡ • ‣
․ ‥ … ‧ ‰ ‱ ′ ″ ‴ ‵ ‶ ‷ ‸ ‹ ›
※ ‼ ‽ ‾ ‿ ⁀ ⁁ ⁂ ⁃ ⁄ ⁅ ⁆ ⁊ ⁋ ⁌ ⁍ ⁎ ⁏ ⁐ ⁑ ⁒ ⁓ ⁔
∕ ∖ ∗ ∘ ∙ √ ∛ ∜ ∝ ∞ ∟ ∠ ∡ ∢ ∣ ∤ ∥ ∦ ∧ ∨ ∩ ∪
∴ ∵ ∶ ∷ ∸ ∹ ∺ ∻ ∼ ∽ ∾ ∿ ≀ ≁ ≪ ≫
≬ ≭ ≮ ≯ ≰ ≱ ≲ ≳ ≴ ≵ ≶ ≷ ≸ ≹ ≺ ≻ ≼ ≽ ≾ ≿ ⊀
⊁ ⊂ ⊃ ⊄ ⊅ ⊆ ⊇ ⊈ ⊉ ⊊ ⊋ ⊌ ⊍ ⊎ ⊏ ⊐ ⊑ ⊒ ⊓ ⊔ ⊕ ⊖ ⊗ ⊘ ⊙
⊚ ⊛ ⊜ ⊝ ⊞ ⊟ ⊠ ⊡ ⊬ ⊭ ⊮ ⊯ ⊰ ⊱ ⊲ ⊳ ⊴ ⊵ ⊶ ⊷ ⊸ ⊹ ⊺ ⊻
⊼ ⊽ ⊾ ⊿ ⋀ ⋁ ⋂ ⋃ ⋄ ⋅ ⋆ ⋇
⋈ ⋉ ⋊ ⋋ ⋌ ⋍ ⋎ ⋏ ⋐ ⋑ ⋒ ⋓ ⋔ ⋕
⋖ ⋗ ⋘ ⋙ ⋚ ⋛ ⋜ ⋝ ⋞ ⋟ ⋠ ⋡ ⋢ ⋣ ⋤ ⋥ ⋦ ⋧ ⋨ ⋩ ⋪ ⋫ ⋬
◿ ☀ ☁ ☂ ☃ ☄ ★ ☆ ☇
☊ ☋ ☌ ☍ ☎ ☏ ☐ ☑ ☒ ☓ ☔ ☕ ☖ ☗
☘ ☙ ☟ ☠ ☡ ☢ ☣ ☤ ☥ ☦ ☧ ☨ ☩ ☪ ☫ ☬
☭ ☮ ☯ ☰ ☱ ☲ ☳ ☴ ☵ ☶ ☷ ☸ ☹ ☺ ☻ ☼
☽ ☾ ☿ ♀ ♁ ♂ ♃ ♄ ♅ ♇
♎ ♏ ♐ ♑ ♒ ♓ ♔ ♕ ♖ ♗ ♘ ♙
♚ ♛ ♜ ♝ ♞ ♟ ♠ ♡ ♢ ♣ ♤ ♥ ♦ ♧ ♨ ♰ ♱ ☫
Cara 1 :Khas untuk pengguna classic template seperti minima, denim dan sebagainya.
1. Sign in Blogspot > Design > Edit Html > Tick Expand Widget Templates
2. Cari code di bawah, Ctrl F dan paste dalam kotak find..enter!
<span class='post-comment-link'>3. Copy code di bawah dan paste di sebelah code yang dicari tadi..
<img src="UrLGambar"/>4. Akan kelihatan begini :
<span class='post-comment-link'><img src="UrLGambar"/>
5. Gantikan UrLGambar dengan url icon korang.
6. Preview dan Save
Cara 2 : Khas untuk template designer.
1. Sign in Blogspot > Design > Edit Html > Tick Expand Widget Templates
2. Cari code di bawah, Ctrl F dan paste dalam kotak find..enter!
3. Copy code di bawah dan paste di sebelah code yang dicari tadi..
<b:if cond='data:blog.pageType != "item"'>
<img src='UrLGambar' style='border:0px'/>4. Akan kelihatan begini :
<b:if cond='data:blog.pageType != "item"'><img src='UrLGambar' style='border:0px'/>
5. Gantikan UrLGambar dengan url icon korang.
6. Preview dan Save
UrL Sampul surat comel untuk korang :
http://dl4.glitter-graphics.net/pub/536/536374qelg9xv2hk.gif
http://dl9.glitter-graphics.net/pub/1595/1595619gdh6a7eo9y.gif
http://dl4.glitter-graphics.net/pub/1785/1785614pvjcji9m7t.gif
http://dl9.glitter-graphics.net/pub/2799/2799269bc9bkpnzi4.gif
http://dl7.glitter-graphics.net/pub/2799/2799267uw7lnlzf5w.gif
http://dl10.glitter-graphics.net/pub/2799/2799270h3d7halhsb.gif
http://dl8.glitter-graphics.net/pub/2799/2799268dm8yvks69y.gif
http://dl6.glitter-graphics.net/pub/2177/2177526ewqeuqudn4.gif
Pilih je mana yang suka, kalau nak icon sendiri pastikan comel macam ni jugak ye..
k baiii :))
2. Copy code di bawah dan paste ke dalam Html/Java Script
Code untuk gambar korang :
<center><a href="URLGAMBAR" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="URLGAMBAR" /></a></center>
3. Letak URLGAMBAR korang, pastikan dua-dua sama url nya. Dan letakkan pula di bawahnya coding code icon comel.
4. Pastikan korang ubah saiz gambar korang lebar(width) 200 dan tinggi (height) 150 agar lebih sesuai dengan saiz sidebar korang. Boleh guna PHOTOSCAPE.
Code icon comel :
<center><img src="URL ICON"/>Tajuk</center>4. Tukar URL ICON dan Tajuk korang.
<center><img src="URL ICON"/>Tajuk</center>
<center><img src="URL ICON"/>Tajuk</center>
<center><img src="URL ICON"/>Tajuk</center>
5. Save jer.. :)
Url Icon boleh ambil kat sini kalau malas nak cari.
http://dl4.glitter-graphics.net/pub/1009/1009254cq7evun01h.gif
http://dl6.glitter-graphics.net/pub/440/440576q8wrax7se2.gif
http://dl6.glitter-graphics.net/pub/437/437716tvik3339uq.gif
http://dl10.glitter-graphics.net/pub/1009/1009300rsetro2tmi.gif
http://dl9.glitter-graphics.net/pub/438/438969azkmwb42oa.gif
http://dl3.glitter-graphics.net/pub/898/898423u7ylo25wtf.png
http://dl9.glitter-graphics.net/pub/1328/1328329h5cmi3di50.gif
http://dl9.glitter-graphics.net/pub/718/718449s271pnji46.gif
k baii selamat mencuba :)
2. Cari code di bawah , Ctrl F dan paste dalam kotak find..enter!
Untuk tajuk entry
.post h3 {kalau tak jumpa code di atas, cari ini :
h3.post-title {masih tak jumpa cari ini :
.post-title {masih tak jumpa, tak jadi?
h3.post-title, .comments h4 {
Tak jumpa jugak aku tak tahu, penat aku testing kat semua template ni. So kalau ada code post dan dekat situ ada ada code title-post jugak ( lebih kurang ), korang copy dan paste je code ini di bawah code yang dicari tadi.
text-align: center;Preview, kalau menjadi SAVE jer..
Untuk Tajuk Sidebar
1. Cari code di bawah , Ctrl F dan paste dalam kotak find..enter!
h2 {masih tak jumpa? atau dah jumpa tapi tak menjadi. Cari ini :
.sidebar h2 {
kalau tak jumpa juga, carilah code yang seakan-akan h2 {
Copy code di bawah dan paste di bawah code yang dicari tadi.
text-align:center;2. Preview, kalau menjadi SAVE jer..
1. Sign in Blogger > Design > Edit HTML
/* Content
korang akan jumpa macam ini :
/* Content
----------------------------------------------- */3. Letakkan code ini di bawah code yang korang cari tadi, * ini code header senget bila di sentuh
#header:hover{
-webkit-transition-duration: 2s;
-moz-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
Contoh macam ni :
/* Content
----------------------------------------------- */
#header:hover{
-webkit-transition-duration: 2s;
-moz-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
4. Faham? preview, if ok sila save dan lihat hasilnya.
TAPI KALAU KORANG TAK JUMPA CODE DI ATAS, BOLEH CARI CODE INI :
*kalau dah jumpa jangan buat cara nih, kang gila pula template korang.padan muka.
/* Header
korang jumpa macam nih : Tempek code merah di bawah code tersebut. Faham?
/* Header
----------------------------------------------- */
#header:hover{
-webkit-transition-duration: 2s;
-moz-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
Memandangkan banyak jenis gerakan header, so aku senaraikan code nya.
Coding Header Bergerak ke kiri atau kanan
padding-left: 140px;
-webkit-transition-duration: 1s; }
left boleh tukar right
Coding Header Bergerak Rotote
-webkit-transition-duration: 1s;Coding Header Bergerak ke atas dan ke bawah
-moz-transform: rotate(6deg);
-webkit-transform: rotate(6deg);
}
padding-bottom: 100px;
-webkit-transition-duration: 1s;
}
5. Preview dan menjadi save sahaja. Okey?
Kalau kedua-dua code tu tak ada dalam template korang tandanya this tutorial not suitable for you olls.
2. Cari code ini, nak mudah tekan Ctrl F, masukkan code dalam kotak find dan enter!
<span class='post-comment-link'>
3. Copy dan pastekan code di bawah, di bawah/selepas code yang korang cari tadi :
<span class='post-comment-link'>4. Ubahlah URL IMAGE ANDA dengan url icon yang korang suka.
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.allowComments'>
<center><a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' ><img class='post-comment-link' src='URL IMAGE ANDA'/>
</a></center>
</b:if>
</b:if>
</span>
5. Preview, menjadi?? silalah SAVE kalau dah puas hati.
Contoh icon, kalau suka silalah ambil.
http://dl5.glitter-graphics.net/pub/1341/1341925bxnjqwck4h.png
http://dl5.glitter-graphics.net/pub/539/539915xiryx12ekb.gif
http://dl8.glitter-graphics.net/pub/1023/1023808rprqnnmxis.png
http://dl3.glitter-graphics.net/pub/184/184983h1kkvipup7.jpg
http://dl10.glitter-graphics.net/pub/2584/2584570bo3zda4vy9.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMF6JYLlb4_4BS5b1U6SRycGSZ20CwdXf7SjFUwCCzFZvFFk_N7kYSZogrQUS9R-Px8Iej-TnOZYxtWoEHKy8VHvq5fwpu67qCxAbOQL0NJMwgmlkuIcAuNK118tcgYBlp8dCQSqN1lX9C/s1600/commentback.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDBOBG2EMWEd8PChvMqNukqutBhAO6WOCEDFqQsEadROJa1L23zeMnJ4hVQwkPT-YDGTsGHi0HpipWNT8V4HyLFm9SeeZantzOp6lQ9plqD2iKs5lNHPg8tP1rJ3N_tWU2qOwDl5pafDrw/s1600/commentback2.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgByS4JtM2ml3kCDy4quwCAk0rCI55DaN82v_7Jgz5QTPUMt8f-4lui9HM2SIONyJ565T0KvLk8SeMxFTH4bp9IxiSWgcqU0BnYyLkHkw8q10BoToUra5c7JEuo3QN3bvrIQclhm22VL6kd/s1600/commentback3.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg083p7sjBBziBcm63_kRXDioYVd4bHN4NSCT8ImsSmg1cKT46ita6yjfn87-OeAoQPDKjxxqfe2FvCxjvdw4abbIU_L18phudT5e5qnpxjqeB_k7fY6IccAynsSytjNSs_P1KWFuIP6c-E/s1600/cikfarahkomen.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhHuEQK8F5hiZOpTp7sHvZMq53u56jx0wjZxdVDQIM3Coz-hDRIAeRRVcxzF-BAiwp2fdFhSPhrHilFy1uwQUfiZNJ2211RnDLEkDuC0thZETcS1F1k2hWr2jc2mqsCwEvy3dC35wgqadb/s1600/cikfarahkomen3.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3tKAlgeHnyX3ANYOnQj_B3JaZ386btcZWzCeQqfVwVway72x3n5Kd8T3pn1TIPWlv5VjqUdc3p6A8pTHht_ECGvn2pum_6L7A4Wln88maogeKEYGCy9Djsf2wGJ6h_s_kBePgRyR6ldL_/s1600/cikfarahkomen5.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiP1wgYuM9QbaJSxPxiwX9WzcEGmJ7gOzXvmdNP-eZme8tHS78vUxVDDKryF-pSmS6fv0A3TKs-FuggI6Jb6fNw9cdq75n96T674qXwJ9WCGoTrl5rhyphenhyphen6FT-TTb-mjJjqSHE_NgDxiWgGs3/s1600/cikfarahkomen6.gif
