Monday, June 18, 2012

: Tutorial Letak Cbox Dalam Blogskin


Bismillah , Assalamualaikum

ok , lewat petang tadi ada seorang cute blogger ni request cara macam mana nak letak cbox kat dalam blogskin, haa macam mana ek ?

jom belaja ^^

1) Log In > Dashboard > Template

2) Klik Ctrl+F dan cari kod cbox 

3) Copy dan paste kod cbox korang kat situ

    - biasanya owner kod template tu akan sediakan tempat untuk korang letak cbox ,

    - contoh :
       CBOX CODE HERE. MAX WIDTH=260px;
4) Dah siap , korang preview dulu , kalau takde error , save ok , siap !! ^^


kalau takde kod tu , jom kita buat cbox terapung , ok ^^

1) Log In > Dashboard > Template 

2) Tekan Ctrl+F dan search kod </head>

3) Copy dan pastekan kod bawah ni kat bawah kod </head>


<div style='display:scroll; position:fixed; top:10px; right:10px;'></a><br /><a href="javascript:void(0);"onclick="showHideAT()"/><img class= width="140" height="140"src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFwDTyNJcCnYGo-221d76oVrhBnu0hotz-IDUWijvZYpwJMYXux5yuGrgPfIWXfiW7GexkAIt1MIon8rOHdyitNtKg0VrRCI3aYn2J-61M6-MM8u30ge3sD4bUCRcs9MkpLJigdiX1XZ6L/s1600/icon+shout.png" alt="Shoutbox" title="Shoutbox" /></a>
</div>
<style type="text/css">#at{position:fixed;
top:0;;}* html #at{position:relative;}.attab{height:100px;width:30px;float:left;cursor:pointer;background:url();}
.atcontent{float:right;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_qBNgMiV70O8FEbU_-ebfoKYYwVN7VhU57lpUy-o02P5_HyH3y4ORD53KlgS7gyDcekrw7w20k-DeM3idwI7Ziy1-AoDU7WtrXPglwO0QkYsfnVSUiotXbtN2t6pgHoaEpRQRCWFKdh8/s1600/kak+yana+shout+frame+copy.png) no-repeat 0 0 transparent;width:800px;height:460px;center scroll ;
padding:56px 0 20px 5px;}</style><script type="text/javascript">function showHideAT(){var at = document.getElementById("at");var w = at.offsetWidth;at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);at.opened = !at.opened;}function moveAT(x0, xf){var at = document.getElementById("at");var dx = Math.abs(x0-xf) > 25 ? 35 : 1;var dir = xf>x0 ? 1 : -1;var x = x0 + dx * dir;at.style.top = x.toString() + "px";if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}}</script><div id="at"><div class="attab" onclick="showHideAT()"> </div><div class="atcontent"><div align="center"><div style="background:url() no-repeat;">
<br /><br /><br /><br /><br /><br />
Masukkan Shoutbox korang dengan lebar 270 dan tinggi 280
<center><div id="author"><a href="javascript:void(0);" onclick="showHideAT()"><input type="button" value="Close" class="close" /></a></div></center></div></div><script type="text/javascript">var at = document.getElementById("at");at.style.top = (-200-at.offsetWidth).toString() + "px";</script></div></div>

purple: gantikan dengan kod icon korang
hijau: gantikan dengan background shoutbox korang
bold: masukkan kod shoutbox korang

Freebies sikit , 

http://i777.photobucket.com/albums/yy57/bunnymeloney/c60.png


http://i777.photobucket.com/albums/yy57/bunnymeloney/c61.png

 
http://i777.photobucket.com/albums/yy57/bunnymeloney/c63.png
 
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikUqWGzLEHPRk82Qttvescu2rQydUuEE_KG_ZNKgqyziQb3OIHo8MR10nbNwoP6qeG-UK34kLGInsEHLq2bhxI2G3HZBYYsd8gmwNGDmKibQ02LdhV2l4zwQ6Qku0DGlQZjiuigNcW5Xo-/s1600/cb4.png
 
http://i356.photobucket.com/albums/oo3/babyemo1413/bihasart3.png


credit : Diya Sesame 



ok , jadi tak ? kalau tak jadi , tanya lah , nanti insyaAllah boleh tolong mana yang salah tu , ok , selamat mencuba !! ^^

Friday, June 15, 2012

: Tutorial Drop Down Menu (Automatic)

Bismillah , Assalamualaikum

ok , kali ini nak ajar korang macam mana nak buat drop down menu . drop down menu ni fungsi nya akan menyebabkan blog kita lebih kemas dan cantik ,

biasanya korang boleh letak 'about me' , 'tuto' , 'stuff' dan lain-lain , ikut suka hati ok ^^

tak paham ? ni contoh nya ,

[klik untuk lebih jelas]

drop down menu ni sangat simple ok , jom ber-tuto ok ^^

1) Log In > Dashboard > Design > Add A Gadget > Html JavaScript 

2) Copy kod bawah ni dan paste kat ruangan Html tadi 
<select style=”background-color:#ff99cc; width: 200px; font:8pt; border:1px solid #FFFFFF; color: #FFFFFF; font-family:trebuchet ms; font-size:10px;” name=”ArchiveMenu” onChange=”location.href=this.options[this.selectedIndex].value;”>
<option>TITLE HERE</option>
<option value=”URL HERE“>TITLE</option>
<option value=”URL HERE“>TITLE</option>
<option value=”URL HERE“>TITLE</option>
<option value=”URL HERE“>TITLE</option></select>
merah : lebar drop down 
hijau : ketebalan border
purple : warna border luar 
kuning : latar belakang 
oren : jenis tulisan 
biru : ketebalan tulisan 
purple pekat : tajuk utama yang korang nak orang nampak 
merah cair : link 'about me' , 'tuto' dan lain-lain
kelabu : tajuk link korang tadi 

3) Preview 

4) Takde error , save and you are done (:

selamat mencuba !! ^^

: Tutorial Facebook Like + Send Button

Bismillah , Assalamualaikum


ok , kali ini tuto nya tentang facebook like + send button , button ni lagi senang kalau ada daripada button fb yang satu-satu tu,

contoh seperti di bawah ini :

[klik untuk lebih jelas]

tapi,sebelum tu kalau ada button fb yang lain-lain,korang kena padam dulu ya,kalau tak,tak jadi,ok ^^

1) Dashboard > Design > Edit Html > Tick Expand Widget Template 

2) Tekan Ctrl+F,search kod ni 
<data:post.body/> 
3) Copy kod bawah ni dan paste kan BAWAH kod  <data:post.body/> tadi , kalau ada  kod lain , paste bawah kod tu k ^^ 
<!-- Facebook Like+Send button Start --><b:if cond='data:blog.pageType != &quot;static_page&quot;'><div style='float:left;padding:5px 5px 5px 0;'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/><fb:like colorscheme='light' expr:href='data:post.url' font='' layout='standard' send='true' show_faces='false' width='450'/></div></b:if><!-- Facebook Like+Send button End -->
4) Preview dulu , kalau takde error , Save Template

selamat mencuba !! ^^

: Tutorial Jenis Borders *newbie*


Bismillah , Assalamualaikum

haloo , kepada yang newbie , types of border ni boleh guna untuk post tittle , sidebar , blockquote and etc lah . tapi , yang pentimg , korang kena pandai try and error kod dia k .

so , jom tengok jenis-jenis nya ^^

 
-moz-border-radius-bottomright: 50px;
border-bottom-right-radius: 50px;        
-moz-border-radius-bottomright: 50px 25px;
border-bottom-right-radius: 50px 25px;   
 
-moz-border-radius-bottomright: 25px 50px;
border-bottom-right-radius: 25px 50px;            
 
-moz-border-radius: 1em 4em 1em 4em;
border-radius: 1em 4em 1em 4em;
 
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;

-moz-border-radius: 35px;
border-radius: 35px;

 Step 1 :

Dashboard > Design > Edit html > Tick expand widget template
Tekan Ctrl + F

Untuk kotak sidebar/ tajuk sidebar
*setiap template adalah berbeza
cari : h2 {
ataupun .sidebar .widget{
ataupun .sidebar h2 {


Untuk tajuk post
h3.post-title {
Untuk blockquote
.post blockquote {

Step 2 :

Copy dan paste kan coding jenis border yang korang pilih tu , letak selepas coding yang korang search tadi


Preview and kalau takde error , Save Template

selamat mencuba !! ^^

: Tutorial Change Your Highlight Copy

Bismillah , Assalamualaikum 

ok , kali ini nak ajar korang macam mana nak ubah highlight copy korang , paham tak ? 

contoh seperti di bawah ini : 

[kilik untuk lebih jelas]

1) Log In > Dashboard > Design > Edit Html

2) Tekan Ctrl+F/F3 , cari kod ini a:link {

3) Dah jumpa ? korang copy kod bawah ini dan paste kan ATAS kod a:link { tadi , 

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

purple : warna yang korang nak
hijau : warna shadow

4) Preview , takde error

5) Save , u are done !!

Selamat Mencuba ^^

kalau tak jadi , bagitahu ok , kalau jadi , komen lah , nanti saya boleh terjah blog korang ^^ 

: Tutorial Letak Salji Dalam Blog

Bismillah , Assalamualaikum


alright , kalau korang perasan , blog ni ada salji , maybe ada yang tak pasan kot , sebab salji tu warna putih , hehe . best letak salji sebab apa ? sebab rasa macam ala-ala winter sinata gitu , kih kih kih

so , jom buat ! ^^

1) Log in > Dashboard > Design >

2) Add A Gadget > Edit Html/JavaScript

3) Copy kod bawah ni dan paste kan kat ruangan Html tu tadi ok ^^

<script type="text/javascript" src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/snowstorm.js" />
<!-- now, we'll customize the snowStorm object -->
<script type="text/javascript">
snowStorm.snowColor = '#000000'; // blue-ish snow!?
snowStorm.flakesMaxActive = 999; // show more snow on screen at once
snowStorm.useTwinkleEffect = true; // let the snow flicker in and out of view
</script>

tapi , hanya warna putih je ya , sebab nanti tak lah nampak sesak sangat blog kita nanti orang tengok , ye tak ?

4) Preview , takde error

5) Save

siap !! selamat mencuba !! ^^

: Tutorial Ubah Kod Warna *newbie*

Bismillah , Assalamualaikum


ok , biasanya kita akan ubah warna-warna bila kita design blog kita bagi cantik lagi kan ? so , di bawah ni antara link-link untuk kita ambil dan tukar , ok ^^


Html Color Codes

Kod Warna Html 


just copy dan paste nya kat mana saja yang kita nak ok ^^  selamat mencuba !!

: Tutorial Change Your Underline


Bismillah , Assalamualaikum , 

hari ini , tuto seterusnya adalah macam mana nak bagi lawa underline bila kita tulis dalam entry , yang biasa warna hitam kan ? ni ajar tukar warna jadi lain , ok ? biar cantik sikit ^^ 

contoh seperti di bawah : 

[klik untuk lebih jelas]


1) Log in > Dashboard > Design > Edit Html > Tick Expand Widget 

2) Tekan Ctrl+F , cari kod u {  

    # kalau tak jumpa , cari kod /* Header , then copy dan paste kod u { atas kod /* Header

3)  Dah jumpa ? ok , then copy dan paste kod bawah ni , bawah kod u { tadi ,
     text-decoration: none;color: #000000;border-bottom:#eee 2px solid;}
hijau : warna garisan/underline
merah : ketebalan garisan/underline , boleh ubah , terpulang
biru : garisan/underline itu dalam nak dalam bentuk apa , terpulang


4) Preview , kalau takde error , tekan Save Template 

siap !! selamat mencuba ^^


Thursday, June 14, 2012

: Tutorial Buang Word Verification For Comments

Bismillah , assalamualaikum ,

sebelum tidur ni , nak ajar korang macam mana nak buang word verfication for comments tu , alah benda alah yang sebelum publish komen kita , dia suruh penuhkan kotak dulu dengan huruf dan nombor bagai tu , katanya nak buktikan yang kita ni bukan nya robot ,

umphh , leceh lah ada benda alah tu , so , jom buang dia ^^

1 ) Log In > Dashboard > Settings > Comments

2 ) Scroll ke bawah , sampai jumpa Show Word Verification For Comments ,

contoh seperti di bawah :

[klik untuk lebih jelas]

3 ) Korang tekan no 

4 ) Save setting , siap ! 

kemas dah komen blog korang semua , selamat mencuba ^^

: Tutorial Letak Image Sebelah Post Title Blogskin !



\\Bismillahirrahmanirrahim// Assalamualaikum

hari nie,saya nak ajar korang macam nak letak image sebelah post title blogskin

so, LET'S START !

1- Log In > Dashboard > Template

2- Tekan Ctrl+F dan search code  <BlogItemTitle><$BlogItemTitlegt;</BlogItemTitle>

3- Then,copy code bawah nie dan paste kan belah kiri  <BlogItemTitle><$BlogItemTitlegt;</BlogItemTitle>

     <img src="URL GAMBAR" />

4- Masukkan URL GAMBAR korang dan make sure jangan terlalu besar k.

Ini ada sikit freebies , pilih lah ^^

http://www.drikoti.net/Goodies/Favicons/Gifs/fv-new11.png

http://www.drikoti.net/Goodies/Favicons/Gifs/fv-new14.png

http://drikoti.net/Goodies/Favicons/Gifs/011.gif

http://drikoti.net/Goodies/Favicons/Gifs/045.gif

http://drikoti.net/Goodies/Favicons/Gifs/036.gif

http://drikoti.net/Goodies/Favicons/Gifs/05.gif

http://drikoti.net/Goodies/Favicons/Gifs/08.gif

http://drikoti.net/Goodies/Favicons/Gifs/030.gif

http://drikoti.net/Goodies/Favicons/Gifs/fv-new10.png

5- Pilih je and then save

6- Sebelum tu,preview dulu k

GOOD LUCK ^^

wassalam.....




: Tutorial Buang Navbar For Blogskin !



\\Bismillahirrahmanirrahim// haluuu kowng.....macam hari ni....tadi saya baru je habis tengok cerita BFF dan Runtuhnya Sebuah Dosa....fuhhh....memang terbaik la cerita tuu kan....siapa setuju,angkat kaki k...

alright,hari ini nak ajar tentang buang navbar untuk blogskin

so, LET'S START !

1- Log In > Dashboard > Template

2- Tekan Ctrl+F, cari code nie,
</title> 
3- Then,copy code bawah ni and paste kat bawah code </title> tadi
<style type="text/css"> #navbar-iframe { display: none; }
4- Preview dulu k

5- Da jadi , save .

Good Luck

wassalam..... 

: Tutorial Letak Button Like Fb di Blogskin !



\\Bismillahirrahmanirrahim// Assalamualaikum

nak ajar cara nak letak like button fb kat blogskin

so, LET'S START !

1- Log In > Dashboard > Template

2- Tekan Ctrl+F dan search code ini

  <$BlogItemBodyg$>

3- Da jumpa ? Biasa code tu ada sebelah code </blogger> atau code <br> , atau ada sebelah code </blogger><br> (ikut blogskin kamu) ok selepas tu copy code ini

 <iframe src="http://www.facebook.com/plugins/like.php?href=<$BlogItemPermalinkURLgt;" scrolling="no"   frameborder="0" style="height: 62px; width: 100%" allowTransparency="true"></iframe>
p/s :: 
# nak letak button like tu kat ATAS post, copy dan paste code ini SELEPAS code <$BlogItemBodyg$>
Contoh<$BlogItemBody$><iframe src="http://www.facebook.com/plugins/like.php?href=<$BlogItemPermalinkURLgt;" scrolling="no" frameborder="0" style="height: 62px; width: 100%" allowTransparency="true"></iframe></blogger><br>
# nk letak button like tu kat BAWAH post, copy n paste code ini SEBELUM code <$BlogItemBodyg$>
Contoh : <iframe src="http://www.facebook.com/plugins/like.php?href=<$BlogItemPermalinkURLgt;" scrolling="no" frameborder="0" style="height: 62px; width: 100%" allowTransparency="true"></iframe><$blogitembodygt;</blogger><br>
4- Preview dulu


5- Da jadi , save ^^V


SELAMAT MENCUBA ^^

tak paham,sila tanya

kalau jadi,komen sikit =)

wassalam....




: Tutorial Letak Header di Blogskin !



\\Bismillahirrahmanirrahim// Assalamualaikum

ada orang tanya macam mana nak letak header kat blogskin


so, LET'S TUTO !

1- Log In > Dashboard > Template

2- Then,tekan Ctrl + F dan search code <head>

3- Alrite,bila da jumpa,copy code yang kat bawah ni

<script type="text/javascript">
document.ondragstart = function () { return false; }; </script><link href='http://fonts.googleapis.com/css?family=Annie+Use+Your+Telescope' rel='stylesheet' type='text/css'><link href='http://fonts.googleapis.com/css?family=Short+Stack' rel='stylesheet' type='text/css'><center><img class="header" src="URL header " /></center>
4- Paste kan kat bawah code <head> tadi

5- Preview dulu

6- Save

   # URL header tu korang gantikan dengan url header yang korang buat tu

SELAMAT MENCUBA 
tak paham tanya tahu?

kalau jadi,komen sikit ea.... ^^

wassalam.....







: Tutorial Letak Gambar dlm Setiap Entry !



\\Bismillahirrahmanirrahim// Assalamualaikum

SALAM MAULIDUR RASUL YA KWN-KWN ^^V


alright,hari nie saya nak buat satu tutorial nie....direquest daripada adik aisyah --->

4 Feb 12, 05:09 PM
A3syah: bw here, tumpang tnya, akak. cmner nak ltak gmbar kat setiap post mcm akak niy.. ley ajar x?



so, LET's START !!

1- Log In > Dashboard > New Post

2- Pergi kat kotak insert image tuk masukkan gambar-gambar yang ada dalam pc kita

    # kotak insert image tuu ada kat sebelah kotak Link

[klik untuk imej lebih besar]

3- Kalau taknak guna cara tu,boleh guna cara copy paste je, lagi senang =)

4- Pergi kat SINI SINI untuk ambil gambar-gambar yang cantik-cantik
    # nak search kat google image pun boleh k =)

5- Tekan right click,nanti dia akan keluar satu senarai yang tak berapa nak panjang

6- Then, cari copy image and tekan kat situ

7- Paste kan kat new post korang tadi....

8- Pastu,adjust je la saiz dia ikut kesesuaian korang

9- Siap !

SELAMAT MENCUBA ^_^


tak paham tanya tahu?

wassalam....


: Tutorial Header Rotate 360 '

Be hard on yourself

\\Bismillahirrahmanirrahim// assalamualaikum kepada semua teman-teman blog sy...dan salam sejahtera kepada yang bukan....

alrite...hari ini sy mahu share dengan anda tutorial cara nak buat rotate header 360 '...sebenarnya,memang da tak mahu buat lagi tuto,hehe....sebab rasa dah banyak blog-blog yang lain yang buat tuto yang 'hebak' lagi 'de bomb'....tapi bila hanie tanya td,rasa macam sedih pula kalau menghampakan dia...:)

so,tuto ini untuk awk ya...yang lain-lain pun boleh try kalau nak buat ^^ 

  • Design > Edit Html > Tick Expand Widget Template
  • Search code ini : h1.title 
  • Then , copy code di bawah ini dan paste kan atas code h1.title { tadi 

#header:hover{
-webkit-transition-duration: 2s;
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
}

  •  Preview and Save :D 
tapi,tuto ini biasanya digunakan untuk jenis DENIM dan WASHED DENIM....BLOGSKIN sy tak pasti...tapi,cuba dulu ya...mana tahu jadi ke kan?? :D

selamat mencuba !! ^^ wassalam.



: Tutorial Make Your Own Clasic Template or Blogskin !



\\Bismillahirrahmanirrahim// Assalamualaikum

hari ini nak ajar macam mana nak buat template blogskin sendiri ,

Tuto nie saya dapat daripada adik kita, Nurin Asyada.... so,a big clap to her 

BUT 

INI HANYA ASAS YANG PERLU ADA DALAM BLOGSKIN , HARAP MAKLUM 

KALAU NAK IKUT TUTO INI , SILA ADJUST DI NOTEPAD DAN PREVIEW DULU 

TUTO NI BELUM JADI BLOGSKIN 100 %

HARAP MAKLUM

1) Bagi sesiapa yg belum ubah template denim, simple dll, korang kene pegi ke Dashboard >> Edit HTML >> Click Revert To Classic Template.


2) Nanti die akn jadi mcm kat bwh ni :


3) Korang right click, select all lpastuh delete semua code yg ada kat dlm kotak tuh. Jgn ada satu code langsung!

4) Copy code kat bwh ni dan pastekan di bahagian atas skali :
<html>
<head>
<link href='URL Gambar' rel='shortcut icon' type='image/gif'/>
<title>Title blog</title>
Ungu : Url Gmbr utk Favicon
Hijau : Tajuk blog korang

5) Copy code bwh ni and pastekan di BAWAH coding tadi :
<style type="text/css">
#navbar-iframe {display: none;}body {
background:url(URL Bckground);
font-family: verdana, tahoma, sans-serif;
font-size:11px;
background-attachment:fixed;
cursor: url(URL Cursor), auto;
}
a:link, a:visited {
color:#999999;
text-decoration:none;
cursor: url( URL Cursor), auto;
}
a:hover {
color: #dddddd;
border-bottom:1px solid #FFD0E5;
text-decoration:none;
cursor: url(URL Cursor), auto;
}
Biru : Code buang navbar^^
Coklat : URL background blog korang
Merah : URL cursor korang
Hijau : Warna link korang

6) Korang copy code bwh ni & pastekan dekat BAWAH code tadi :

.blog {background:#ffffff;color:#666666;font-size: 11px;padding:14px;width:600px;border-radius:10px;text-align:justify;}.sidebar {background: #ffffff;color: #666666;font-size: 11px;padding: 8px;width: 230px;border-radius: 10px;text-align: justify;}.first-title {color:#555555;font-size:14px;padding:3px;border-bottom:1px dashed #999999;text-align: right;}.second-title {color: #696969;font-style:italic;font-size:10px;margin-bottom:2em;}
7) Copy code kat bwh ni dan pastekan di BAWAH code yg tadi :
a.navi {
letter-spacing: 1px;
}
a.navi:hover {
color: #dddddd;
}
Ini adalah coding utk Navigation korang :) korang ubahlah ape2 yg patut ikut citarasa sendiri ^^
8) Korang copy & pastekan dekat BAWAH code tadi, korang continue je :
</style><body oncontextmenu='return false;'><br><center><img border="0" src="URL Header" /></center><table style="line-height: 17px;" width="800" border="0" align="center" cellspacing="5"><tbody><tr><td valign="top" style="width:600px; padding:10px; border-radius:10px; background:#ffffff; font-size:11px;"><div id="blog"><blogger><div class="first-title"><BlogItemTitle><$BlogItemTitlegt;</BlogItemTitle></div><div class="second-title"><BlogDateHeader><$BlogDateHeaderDategt;</BlogDateHeader> | <$BlogItemDateTimegt; | <a href="<$BlogItemCommentCreategt;"<$BlogItemCommentFormOnClickgt;><$BlogItemCommentCountgt; Notes</a></BlogItemCommentsEnabled></div><$blogitembodygt;</blogger><br><center><OlderPosts><a href=<$OlderPostsgt;>Older Post</a> </OlderPosts> <NewerPosts> | <a href=<$NewerPostsgt;>Newer Post</a></NewerPosts></center></div></div></td>
Biru : Code disable right click
Coklat : URL header blog korang 
Ungu : Width pages dgn sidebar

9) Code kat bwh ni ialah code sidebar korang ^^ Copy dan pastekan dekat BAWAH code tadi :
<td valign="top" width="230px"><div style='display:scroll; position:fixed;'><div class="sidebar"><div class="first-title">Your Title!</div><br><img src="URL Icon"> <a class="navi" onClick="document.getElementById('blog').innerHTML=document.getElementById('author').innerHTML">The Webmiss</a><br><img src="URL Icon"> <a class="navi" onClick="document.getElementById('blog').innerHTML=document.getElementById('links').innerHTML">Taggie & Linkies</a><br><img src="URL Icon"> <a class="navi" onClick="document.getElementById('blog').innerHTML=document.getElementById('post').innerHTML">Homepage</a><br></div><br></td>
10)  Copy code ni dan pastekan di bawah code </td> yg di-Birukan :)


<div id="author" style="display:none;"><div class="first-title">The Webmiss</div><br>Hello Stalker! My Name Is Nurin Asyada, I'm this template designer or owner. Write your biography here ^^V</div><div id="links" style="display:none;"><div class="first-title">The Buddyz</div><br><center><a href="blogger.com"/>Friends</a> | <a href="blogger.com"/>Friends</a> | <a href="blogger.com"/>Friends</a> | <a href="blogger.com"/>Friends</a> | <a href="blogger.com"/>Friends</a> | <a href="blogger.com"/>Friends</a></center><br><div class="first-title">Creditos</div><br>- Template By : <a href="blogger.com"/>Friends</a> <a href="blogger.com"/>Friends</a><br>- Background : <a href="blogger.com"/>Friends</a><br>- Icon : <a href="blogger.com"/>Friends</a></div><div id="post" style="display:none;"><blogger><div class="first-title"><BlogItemTitle><$BlogItemTitlegt;</BlogItemTitle></div><div class="second-title"><BlogDateHeader><$BlogDateHeaderDategt;</BlogDateHeader> | <$BlogItemDateTimegt; | <a href="<$BlogItemCommentCreategt;"<$BlogItemCommentFormOnClickgt;><$BlogItemCommentCountgt; comments</a></BlogItemCommentsEnabled></div><$blogitembodygt;</blogger><br><center><OlderPosts><a href=<$OlderPostsgt;>Older Post</a> </OlderPosts> <NewerPosts> | <a href=<$NewerPostsgt;>Newer Post</a></NewerPosts></center></div>

11) Copy code ni dan pastekan di bahagian bwh skali :
</table>
</body>
</head>
</html>
alright,done...da siap akhirnya.....#ho.ho.ho

korang kena sabar sikit tau dalam buat blogskin nie sebab dia rumit sikit...

so,pape pun gud luck to you all's semua yang nak buat blogskin sendiri

wassalam.....

: Tutorial Own Navigation Bar Blogskin !



\\Bismillahirrahmanirrahim// Assalamualaikum

hari ni nak ajar tentang navigation bar untuk blogskin

saya dapat tuto ni daripada Lysa

contoh

Let's Start !

1- Log In > Dashboard > Template
2- Tekan Ctrl+F dan search code <head>
3- Copy code nie dan paste balik kat bwh code <head> td
<div style="position: absolute; top:0px; right: 0px; width:100%; border-radius:2px; position:fixed; padding:3px; background:#FAAFBE; color:#000000; font-size:11px;">
 <script type="text/javascript">
document.ondragstart = function () { return false; }; </script>
 <script type='text/javascript'>
document.ondragstart = function () { return false; }; </script>
<div style="text-align: center;">
<b style="color: white;"></b>Ayat korang│<a href="http://www.blogger.com/follow-blog.g?blogID=BLOG ID KORANG" style="color: white;">Follow</a> │<a href="http://www.blogger.com/home" style="color: white;">Dashboard</a>│</div>
Notes: Warna background navigation tuh bole tukar kalau nak
Notes: Warna tulisan
Notes: Size tulisan
Notes: Ayat pembuka bicara korang. Cth " Welcome to my blog "
Notes: Your blog ID

4- Preview dulu
5- Save
already done !!

wassalam...





: Tutorial Pasang Background Cbox Di Blogskin !



\\Bismillahirrahmanirrahim// Assalamualaikum

hari ini nak ajar tentang pasang background cbox di blogskin

Let's Start !

1- Log In Blog > Dashboard > Template

2- Copy code ni and paste kat tempat yang korang patut letak code cbox korang k

<div style="border:3px solid #ffb8b8;"><div style="background: url(url image); repeat; padding: 3px;"><center><center><span style="font-size:11px!important;"><center>CODE CBOX</div></div>



3- Preview

4- Save 




#ffb8b8 : wrna border kowng
url(url image) : letak background kowng
CODE CBOX : letak code cbox o shoutmix o fibox kowng 
3px : ketebalan border kowng
kalau korang malas nak cari background tu,boleh pergi SINI


warna border tu pulak,kalau korang nak ubah,boleh pergi kat SINI 


GUD LUCK !!

tak paham tanya ea

wassalam.....