Princess eyla: Tutorial

Tutorial : Make Facebook Fanpage

6:37:00 PTG

assalamualaikum

1. Mula2 pergi sign in --> Facebook
2. Lepas tu pergi ke --> Buat Halaman

3. Pilih yang mana korang nak buat. Lepas tu click . Kalau blog selalunye pakai yang eyla tandakan tu.
4.pastu ade keluar kotak cam ni

5.tulis nama yang korang nak n tekan mulakan

6.nnti dye keluar cam bawah ni

7.tulis la ape2 yg patut n tekan simpan maklumat.

8.pastu tukar gmbr korang nak.

9.langkaui

10.langkaui lagi

11.done ..

*Kalau nak tengok fanpage korang balik . Pergi kat tepi yang setting tu. Tengok contoh bawah ni

*Dan kalau nak edit fanpage , pergi click edit page. Pilih mana2 yg nk edit balik tu.

like fanpage eyla - Eyla Own's Blog

Tutorial

Tutorial : List With Icon Hover

5:30:00 PTG

assalamualaikum

tutorial list with icon hover

live preview

1.Copy code di bawah ni

<style>
a.chan {
background:url(URL ICON);
background-repeat:no-repeat;
background-size:12px;
padding-left:19px;
color:#666;
display:inline-block;
font: 12px arial;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
width:280px;
line-height:18px;
}
a.chan:hover{
background:url(URL ICON);
background-repeat:no-repeat;
background-size:12px;
color: #000;
}
</style>
<a class="chan" href="LINK HERE">Tutorial</a>
<a class="chan" href="LINK HERE">Tutorial</a>
<a class="chan" href="LINK HERE">Tutorial</a>
<a class="chan" href="LINK HERE">Tutorial</a>
<a class="chan" href="LINK HERE">Tutorial</a>
<a class="chan" href="LINK HERE">Tutorial</a>

2.Paste dekat mana-mana korang nak
3.Preview & Save

oren : url icon
merah : link
biru : tajuk

Tutorial

Tutorial : Put Exchange Link Box

5:19:00 PTG

assalamualaikum

hari ni eyla rajin nak buat tutorial untuk korang.eyla nak buat Tutorial : Put Exchange Link Box .

live preview

<center>

<b>NAME</b> :

<input type="text" size="11" value="YOUR EXC NAME"

style="width:180px;font:11px trebuchet ms;color:#666;

border:1px solid #eee;margin-right:6px;background-color:#ffffff;padding:2px;

padding-left:4px;" onclick="this.focus()" onfocus="this.select()">

<br>

<b>URL</b> :

<input type="text" size="11" value="http://.blogspot.com/"

style="width:180px;font:11px trebuchet ms;color:#666;

border:1px solid #eee;background-color:#ffffff;padding:2px;

padding-left:4px;" onclick="this.focus()" onfocus="this.select()">

</center>

merah : exchange name

biru : link blog korang

Tutorial

Tutorial Youtube Player

4:26:00 PTG

Annyeonghaseyoo !

LIVE PREVIEW

For Blogskin

1.Dashboard > Template > Edit HTML

2.Press Crtl +F dan cari code <head>

3.Copy code di bawah ni

<div style=" position:absolute; top:0px; left:30px;">
<img src="LINK MUSIC BOX" /></div>
<div style=" position:absolute; top:60px; left:50px;"><center>
<object width="140" height="25">
<param name="movie" value="YOUTUBE DIRECT LINK autoplay=1&&color1=0xffffff&color2=0xffffffamp;hl=en_US&autoplay=1" />
<param name="allowFullScreen" value="true" />
<param name="allowscriptaccess" value="always" />
<embed src="YOUTUBE DIRECT LINK autoplay=1&&color1=0xffffff&color2=0xffffffamp;hl=en_US&autoplay=1"
type="application/x-shockwave-flash" width="140" height="25"
allowscriptaccess="always" allowfullscreen="true">
</embed></object></center></div>

4.Kemudian paste di bawah code <head> tadi

LINK MUSIC BOX - Tukar kepada link border box

YOUTUBE DIRECT LINK ni , korang ambil code lagu kat YouTube . Caranya ikut step k :

*Copy code step-3 tu dan paste kat YOUTUBE DIRECT LINK

5.Preview & save.

For Design

6.Design > Add gadget > Html / Javascript

7.Copy and paste code no-3 tadi. ctrl+C untuk copy.

Yang LINK MUSIC BOX tu Korang boleh ambil kat bawah ni .

http://2.bp.blogspot.com/-71NODkSsjGE/

UAGpdjBK1YI/AAAAAAAAA90/LishnYd9tAQ/

s1600/green.png

http://2.bp.blogspot.com/-8VZlsTBl-QE/UAGpe0IVutI/AAAAAAAAA98/Q9qOMfpMats/s1600/grey.png

http://4.bp.blogspot.com/-hfJU_cNGJ9Y/UAGpggPUMLI/

AAAAAAAAA-E/aqxEq_QHBRg/s1600/pink.png

http://3.bp.blogspot.com/-zTga0hqIb3U/UAGpkAxI7SI/

AAAAAAAAA-M/__3aADDYO1g/s1600/puple.png

http://3.bp.blogspot.com/-oZhhswzJPcM/UAGplLL9GqI/

AAAAAAAAA-U/86j717WRT8A/s1600/pyple2.png

credit : fatin halid

Tutorial

<center><style type="text/css"> .slide { width: 250px; padding: 5px; background: ;} .slide2 { padding:3px; display:block; height:13px; width:240px; background:#fff; -webkit-transition-duration:.8s; -moz-transition-duration:.8s; overflow:hidden;} .slide2:hover { height: 150px; } nav1{ font-family:consolas; padding-top:1px; font-size:12px; color:#000; text-align:center; text-transform :uppercase; background: pink; letter-spacing:2px; height:25px; padding-left:6px; display:block; -moz-transition: 0.5s; -webkit-transition: 0.5s;} </style> <div class="slide"><div class="slide2"><nav1>Tajuk Pertama</nav1> <div style="height:150px; overflow:auto;margin-top:3px;"> ISI UNTUK TAJUK PERTAMA </div></div></div> <div class="slide"><div class="slide2"><nav1>Tajuk Kedua</nav1> <div style="height:150px; overflow:auto;margin-top:3px;"> ISI UNTUK TAJUK KEDUA </div></div></div> <div class="slide"><div class="slide2"><nav1>Tajuk Ketiga</nav1> <div style="height:150px; overflow:auto;margin-top:3px;"> ISI UNTUK TAJUK KETIGA </div></div></div></center>

1.Copy code yang eyla beri diatas dekat http://htmledit.squarefree.com/ untuk memudahkan korang edit 2.Dah siap edit? Paste code yang telah siap korang edit dekat HTML/Javascript *Dashboard > Layout > Add a Gadget > HTML/Javascript 3.Save
Note Merah - tukar code warna korang Ungu - letak tajuk/title dia Biru - letak isi yang korang nak letak {contoh:code shoutbox, banner giveaway dll}
Credit : nabilamedan

Tutorial

Hover - Over Banner Giveaway

10:08:00 PTG

LIVE PREVIEW

1.Blogger Dashboard > Layout > Add a Gadget > HTML/Javascript 2.Paste code bawah ni dekat HTML/Javascript

3.Kalau dah okay semuanya, save
Amaran!
Yang warna merah tu korang boleh tukar ikut suka korang
Yang warna ungu tu , height dan width gambar harap korang takpayah tukar sebab kalau korang tukar nanti kedudukan dia jadi lain.
Kalau rasa-rasa kedudukan dia agak tak betul sikit korang boleh adjust code warna oren tu.
Letak 4 gambar/banner sahaja , kalau kurang/tambah banner.. kedudukan dia akan berubah nanti
Senang kata , korang just ambil code yang eyla bagi dan tukar yang warna merah je..
credit : nabilamedan