Oke, Montela dengan berbesar hati ingin berkongsi tentang Tab Berwarna.

Tak paham? Tengok gambar kat bawah nih.


Bagai nak juling mata adjust Coding nih.
Jangan lupa Credit kat Montela tau kalau korang re-Tutor. :)

Senang nya nih. Jom belajar jom!


1. Dashboard > Design > Add New Gadget > HTML / Java Script

2. Copy dan Paste kod kat bawah nih dalam HTML / Java Script tadi.
<center><span class="Apple-style-span" style="font-family: verdana, tahoma, sans-serif; font-size: medium; "><span id="nav" style="font-size: 13px; font-family: Arial; background-image: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(252, 183, 201); color: rgb(255, 255, 255); text-align: center; text-transform: uppercase; text-shadow: 1px 1px 2px #000000; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; height: 21px; cursor: pointer; "><a href="http://waneyredzastories.blogspot.com/" style="color: rgb(255, 255, 255); text-decoration: none; -webkit-transition-duration: 0.5s; ">HOME</a></span> <span id="nav" style="font-size: 13px; font-family: Arial; background-image: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(252, 183, 201); color: rgb(255, 255, 255); text-align: center; text-transform: uppercase; text-shadow: 1px 1px 2px #000000; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; height: 21px; cursor: pointer; "><a href="http://waneyredzastories.blogspot.com/" style="color: rgb(255, 255, 255); text-decoration: none; -webkit-transition-duration: 0.5s; ">TUTORIAL</a></span> <span id="nav" style="font-size: 13px; font-family: Arial; background-image: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: rgb(252, 183, 201); text-align: center; text-transform: uppercase; text-shadow: 1px 1px 2px #000000; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; height: 21px; cursor: pointer; "><a href="http://waneyredzastories.blogspot.com/" style="color: rgb(255, 255, 255); text-decoration: none; -webkit-transition-duration: 0.5s; ">SEGMEN</a></span></span></center>

3. Yang Merah Merah tuh uols tukar tau.

4. Oke, done! Save, dan Preview jadi ke tak. Oke :)




Montela pernah ajar Disable Right Click kan?
Oke, yang tuh takde Alert.
Now, Montela nak ajar yang ada Alert punya.
Means, kalau orang Right Click, akan keluar macam kat bawah nih.





1. Dashboard > Design > Add New Gadget > HTML / Java Script

2. Copy dan Paste kod kat bawah nih dalam HTML / Java Script tadi.
<style>body {cursor:crosshair} </style>


<script language=javascript>
<!--
//edit by unwanted


var message="Ayat Uols";
///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}
function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}
document.oncontextmenu=new Function("alert(message);return false")
// -->
</script>
3. Ayat Uols tuh uols create lah ayat sendiri oke.

Selamat Mencuba :)



Montela nak ajar cara nak tukar warna Highlight di Blog uols. 

Tak paham? Oke, meh kite tengok meh.


Oke, nih Montela cilok blog ade Montela. Klik pada gambar, boleh direct pergi blog dia. 
Promot sikit :)

Sekarang uols cuba Highlight mana-mana word dalam blog Montela. 
Akan jadi macam nih kan?


Senang je caranya :)
Jom belajar.

1. Dashboard > Design > Edit HTML > Tick Expand Widget

2. Cari kod di bawah menggunakan Ctrl F
a:link {

3. Dah jumpa? Oke then uols Copy dan Paste kod ini di ATAS kod tadi.
:-moz-selection {
background:#000000;
color:#FFFFFF;
}
::selection {
background:#000000;
color:#FFFFFF;

4. Oke, siap dah! Jangan lupa SAVE oke!

Selamat Mencuba :)



Montela pernah ajar Disable Right Click kan?
Oke, now kite belajar macam mana nak Disable Highlight pulak.
Means orang tak boleh highlight apa pun dari blog kita :)

1. Dashboard > Design > Add New Gadget > HTML / Java Script

2. Copy dan Paste kod kat bawah nih dalam HTML / Java Script tadi.

<script type="text/javascript">
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> 

Oke, done! Save, dan uols try la oke!

Oke, Tutorial kali nih buat mereka mereka yang tak mahu orang Copy apa-apa dari blog mereka.
Bila orang nak Copy menggunakan Right Click, dengan adanya Disable Right Click tanpa alert ni, apa-apa yang orang nak copy tu tak dapat di Copy sama sekali.

Senang je. Jom try!

1. Dashboard > Design > Add New Gadget > HTML / Java Script

2. Copy dan Paste kod kat bawah nih dalam HTML / Java Script tadi.
<script language=JavaScript>
<!--

//Disable right click script III- By Renigade ([email protected])
//For full source code, visit http://www.dauspozi.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>

Oke, done! Save, dan uols try la oke!  



Now, acane nak letak icon comel lote sebelah Blog Archieve uols.

Macam nih haa.. Yang gambo Itik Gembo gembo tuh :)


1. Dashboard > Design > Edit HTML > Tick Expand Widget

2. Now, cari kod kat bawah nih. Oke, sila guna Ctrl F untuk memudahkan uols.
<li><a expr:href='data:i.url'><data:i.title/></a></li>

3. Masukkan kod ini ke dalam link dekat atas tuh.
<img src='URL Icon'/>

4. Macam nih kalau uols tak paham.
<li><img src='URL Icon'/><a expr:href='data:i.url'><data:i.title/></a></li>

5. Preview dulu baru SAVE oke. 

Nota Kaki :
Nak Icon Comel Lote? Jom cari kat Sini.

Selamat Mencuba.




Nak tahu tak cara nak buat Scroll Box untuk Blog Archieve?

Macam dalam gambar nih.


1. Dashboard > Design > Edit HTML > Tick Expand Widget

2. Dengan menggunakan fungsi Ctrl F, cari kod ini :
<div id='ArchiveList'>

3. Dah jumpa? Then, uols cari kod kat bawah nih sebelum kod atas nih.
<div class='widget-content'>

4. Now, delete kod tersebut dan gantikan dengan kod ini:
<div class='widget-content' style='overflow:auto; height:200px'>

Oke, yang 200px nih boleh adjust ikut kesesuaian blog uols :)

Selamat Mencuba.






Tak nak buang masa.
Ayuh kita belajar macam mana nak letak Jumlah Post dan Komen di dalam blog macam gambar dekat bawah nih.


1. Dashboard > Design > Add New Gadget > HTML / Java Script

2. Copy dan Paste kod kat bawah nih dalam HTML / Java Script tadi.
<center><script style="text/javascript">function totalPosts(json) {
document.write('Total Posts: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
function totalComments(json) {
document.write('Total Comments: <b>' + json.feed.openSearch$totalResults.$t + '</b><br>');
}
</script>
<script src=" /feeds/posts/default?alt=json-in-script&callback=totalPosts"></script>
<script src=" /feeds/comments/default?alt=json-in-script&callback=totalComments"></script></center>
Oke, done! Save, dan tengok hasilnya.