ACS - Tuto Edition :): September 2011

Tuto Highlight Text :)

Okay , highlight text tuh apea ? Macam ney , kalau korang ade nak copy pape kea kan , nanti text yang korang copy tuh ade highlightnyea ? :)

Faham ? Tak faham heh ? HAHA
Okay , just follow tuto ney then tengok resultnyea :D

Search word ney kat Edit HTML :

a:link {

Then copy code bawah ney :

::-moz-selection {
background:#FFFFFF;
color:#000000;
text-shadow: 2px 2px 3px #81BEF7;
}
::selection {
background:#FFFFFF;
color:#000000;
text-shadow: 2px 2px 3px #81BEF7;
}

Code tuh korang pastekan atas code a:link { tadi :)

Senang kan ? Dah jadik , sila SAVE ! :)

Thanks for the view :)

Blockquote Warna Warni XD

Okay , nak try ?

Find this word :

.post blockquote {

Then , copy code bawah ney atas code .post blockquote { tadi .

background: url(URL BACKGROUND KORANGS);
border-left: 3px solid #FFFFFF;
border-right: 2px dashed #FFFFFF;
border-bottom: 2px dashed #FFFFFF;
border-top: 2px dashed #FFFFFF;
padding: 9px;
-moz-border-radius-bottomright: 20px;
border-top-right-radius: 10px;
border-bottom-right-radius: 20px;
}

Faham tak ? Okaylah , tengok bawah ney :

.post blockquote {
background: url(URL BACKGROUND KORANGS);
border-left: 3px solid #FFFFFF;
border-right: 2px dashed #FFFFFF;
border-bottom: 2px dashed #FFFFFF;
border-top: 2px dashed #FFFFFF;
padding: 9px;
-moz-border-radius-bottomright: 20px;
border-top-right-radius: 10px;
border-bottom-right-radius: 20px;
}

Faham kan ? :)

Okay , dah jadik sila SAVE :)

Petunjuk :

Merah : Tukar ekod suke korang :)

Thanks for the view :)

Scrollbar Comel :)

Okay ! Nak scrollbar macam saya ?

Search code ney :

/* Header

Dah jumpea ? Then , copy pulak code kat bawah ney :

::-webkit-scrollbar {
height:12px;
width: 12px;
background: #fa95c8;
}
::-webkit-scrollbar-thumb {
background-colour #fa95c8;
-moz-border-radius: 10px;
border-radius: 10px;
}

Dah copy ? Okay , pastuh paste atas code /* Header !
Okay , Preview dulu ! Jadik ? SAVE :)

Merah : Bole tukar colour yang you all nak okay :)

Thanks for the view :)

Tuto Auto-Open Links :)

Okay , kalau pakai code ney ,
orang yang tekan link kat blog you automatik akan open new tab laa ! :)

Copy then paste code ney kat HTML Jvascript :)

<script type="text/javascript" language="javascript">
var arr = document.getElementsByTagName("a"); //get all links in the page
for(var i = 0; i < arr.length; i++)
{
if(arr[i].href.indexOf("Your URL") < 0 //not links that are 'inside' blog
&& arr[i].href.indexOf("javascript:") < 0) //not javascript links
arr[i].target = "_blank";
}
</script>

Thanks for the view :)

Tuto masukkan gamba kat HTML javascript ! :)

Okay , tuto ney simple gila lah .
Takpayah nak gune Add Photo kat Page Element tuh .

<img src="LINK GAMBAR ANDA" height="192" width="200" /><center>

Biru : Link gamba korangs :)
Merah : Tukar laa ekod suke korangs ! :)

Thanks for the view :)

Tuto Sidebar macam saya :)

Okay , kalau you all gune template denim , mesti takdea kotak untuk post title kan ?
Ini caranyea :)

Search these word in Edit HTML :

.post-title {.

.sidebar h2 {

Okay , ini code you all copy BAWAH code code yang you all dah search tadi :)

margin: 1.7em 0 .6em;padding: 3px 4px;background: ;border-right:3px solid #fa95c8;border-left:3px solid #fa95c8;border-bottom:1px dashed #999999;border-top: 1px dashed #999999;padding: 5px;font-family:Verdana;}

Review :

.post-title {. margin: 1.7em 0 .6em;padding: 3px 4px;background: ;border-right:3px solid #fa95c8;border-left:3px solid #fa95c8;border-bottom:1px dashed #999999;border-top: 1px dashed #999999;padding: 5px;font-family:Verdana;}

DAN ini ,

.sidebar h2 {
margin: 1.7em 0 .6em;
padding: 3px 4px;
background: ;
border-right:3px solid #fa95c8;
border-left:3px solid #fa95c8;
border-bottom:1px dashed #999999;
border-top: 1px dashed #999999;
padding: 5px;
font-family:Verdana;
}

Thanks for the view :)

Tuto Image Animation Hover :)

Hey !
Okay semua ><
Mau ajar macam mane nak buad Image Animation Hover pulok ><

Search code ney kat Edit HTML :

/* Header

Then ?
Copy code ney :

/*------ IMAGE ANIMATION------*/img {filter:alpha(opacity=100);-moz-opacity:1.0;opacity:1.0;}img:hover {filter:alpha(opacity=80);-moz-opacity:0.80;opacity:.80;}

Pastuh ?
Paste kat atas code /* Header tadi .

Review :

/*------ IMAGE ANIMATION------*/img {filter:alpha(opacity=100);-moz-opacity:1.0;opacity:1.0;}img:hover {filter:alpha(opacity=80);-moz-opacity:0.80;opacity:.80;}

/* Header----------------------------------------------- */

Senang jea kan ? :)

Thanks for the view :)

Tuto Float Shoutbox :)

Ohh , tuto Float Shoutmix ! Okay , panjang sket tuto ney . Ekod tau , ekod tau :)
Copy jaa code ini :

<style type="text/css">#gb{position:fixed;top:100px; <---- jarak dari atas z-index:+1000;}* html #gb{position:relative;}
.gbtab{height:230px;width:120px;float:left;cursor:pointer;background:url('URL ICON ANDA') no-repeat;}.gbcontent{float:left;border:2px solid #FFFFFF;background:#000000;padding:5px;}</style>
<script type="text/javascript">function showHideGB(){var gb = document.getElementById("gb");var w = gb.offsetWidth;gb.opened ? moveGB(0, 50-w) : moveGB(60-w, 0);gb.opened = !gb.opened;}function moveGB(x0, xf){var gb = document.getElementById("gb");var dx = Math.abs(x0-xf) > 10 ? 5 : 1;var dir = xf>x0 ? 1 : -1;var x = x0 + dx * dir;gb.style.right = x.toString() + "px";if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}}</script><div id="gb"><div class="gbtab" onclick="showHideGB()"> </div><div class="gbcontent">
 <div class="clear"> </div>

<iframe title="" src="http://www5.shoutmix.com/?izzahfarhani" width="100%" height="400" frameborder="0" scrolling="auto"><a href="http://www5.shoutmix.com/?izzahfarhani">View shoutbox</a></iframe><br /><a href="http://www.shoutmix.com" title="Get your own free shoutbox chat widget at ShoutMix!">ShoutMix chat widget</a><br />

<div style="text-align:right"><a href="javascript:showHideGB()">[close]</a></div></div></div><script type="text/javascript">var gb = document.getElementById("gb");gb.style.right = (120-gb.offsetWidth).toString() + "px";</script>

Okay , ini contoh shoutmix Hani tau . You all jangan copy semua yang colour Biru ney . Buad shoutmix dulu kat sini <linklink>
Pastuh , copy code shoutmix you all then ganti kat code Biru ney okay ?

Jadik ? Kalau tak jadik inform okay :)

Thanks for the view :)

Tuto button Follow dan Dashboard ala ala Tumblr :)

Hey you , Hani nak tunjuk cam mana nak buad tuto button Follow dengan Dashboard ala ala Tumblr tuh :)

Pergi kat Design > Page Element > HTML Javascript

Then copy jea code kat bawah ney ehh .
Pastuh paste ! :)
*Takpayahlaa tukar tukar code tuh . Takod rosak pulak kan ? :)

<div style="position: fixed; top: 5px; right: 90px;"><a class="linkopacity" href="http://www.blogger.com/follow-blog.g?blogID=9110062210511945748" target="_blank" rel="nofollow" title="Follow :)" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img src="http://assets.tumblr.com/images/iframe_follow_alpha.png?6" border="0" /></a>
<div style="position: fixed; top: 5px; right: 2px;"><a class="linkopacity" href="http://draft.blogger.com/home" target="_blank" rel="nofollow" title="Dashboard :)" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img src="http://assets.tumblr.com/images/iframe_dashboard_alpha.png?6" border="0" /></a></div></div>

Senang kan ?

Thanks for the view :)

Tuto Top Button :)

Hai awak ! Sekarang mau buad tuto TOP BUTTON :)

Okay , ini tuto memang senang gila .

Copy code kat bawah ney :

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Naek Atas :)"><img src="URL ICON ANDA" /></a>

Okay ? Da copy ? Boleh laa paste kat HTML/Javascript ! :)

Merah : Korang tukar laa ayat ape korang nak :)
Biru : Korang letak URL korang yea :)

Thanks for the view :)

Tuto Wishlist :)

Wishlist Wishlist ! XD
Okay , pergi kat HTML Javasvcript ><
Copy code dibawah dan paste ! Senang kan ? XD

<center><form name=myform><input type="checkbox" name="mybox" value="WISH" checked />WISH<br /><input type="checkbox" name="mybox" value="WISH" checked/>WISH<br /><input type="checkbox" name="mybox" value="WISH" disabled />WISH<br /></form></center>

Colour ney : Kotak yang ditanda
Colour ney : Kotak yang tidak ditanda

Thanks for the view :)

Tuto Background Post Body

Okay , ini tuto dapat permintaan ramai kodd ? HAHA
Baeklaa , start ini yea .
Pergi kat Edit HTML , then carik code ney :

#content-wrapper {

#main-wrapper {

#sidebar-wrapper {

Jumpe daa ? Good !
Okay ,
Copy pulak code ini :

background-image: url(URL ANDA);

You all paste kan code tuh kat setiap code yang dicari tadi . Tak faham ? Okay , macam ney :

#content-wrapper {background-image: url(URL ANDA);

then ,

#main-wrapper {background-image: url(URL ANDA);

then ,

#sidebar-wrapper {background-image: url(URL ANDA);

SIAP !

Ini pulak contoh code background okay ?

http://2.bp.blogspot.com/-w55aEa7ZrtU/TaCfgxaYFgI/AAAAAAAABX0/x7CcO9PfDAM/s0/11111111111111111111111111111111111.png

Thanks for the view :)

Tuto Fieldet :)

Tuto Fieldset :)

<fieldset style="width:212px;"><legend> <img src="(URL ICON)"/>TAJUK</legend><center><br />TULIS APA APA YOU ALL NAK :)</center></fieldset>

Thanks for the view :)

Tuto Status Updates

Hari ney :
Tuto Status Updates !
Okay , tuto ney ditanyea oleh Miss Najwa

<center style="text-align: right;"><span class="Apple-style-span" style="color: #99004c; font-family: Verdana, 'Times New Roman', serif;"><b>UPDATES</b></span></center><div style="Background-image:url(URL BACKGROUND KORANG); repeat; padding -moz-border-radius: 35px 35px 35px 35px;
-webkit-border-radius: 35px 35px 35px 35px;: 5px; border:1px solid #000000;"><center><marquee>STATUS KORANG</marquee></center></div>

Semua yang colour Merah tuh korang boleh tukar okay ? :)

Thanks for the view :)

Tuto Highlight Text :)

Blockquote Warna Warni XD

Scrollbar Comel :)

Tuto Auto-Open Links :)

Tuto masukkan gamba kat HTML javascript ! :)

Tuto Sidebar macam saya :)

Tuto Image Animation Hover :)

Tuto Float Shoutbox :)

Tuto button Follow dan Dashboard ala ala Tumblr :)

Tuto Top Button :)

Tuto Wishlist :)

Tuto Background Post Body

Tuto Fieldet :)

Tuto Status Updates

Attention !

LALALA :)

Tutorials :)

Followers