Tips for Bloggers...!: July 2012

Tutorial 44: Moving Image (Contest + GA )

macam mana nak buat Banner Contest yang bergerak

Oke .bolehh ! boleh ! saya boleh tolong ajar kan ?

Tapi , macam pening ciket cara dia .

1. Log in > Dashboard > Design > Add Gadget > Html/JavaScript

2. Copy and paste code di bawah ini , di ruangan html tadi tu .

<center><img style="visibility: hidden; width: 0px; height: 0px;" src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.11NXC/bT*xJmx*PTEyOTE4OTA3ODU3NjEmcHQ9MTI5MTg5MDgwNDcwOCZwPTc2MTcxJmQ9TWFycXVlZSUyMEdlbmVyYXRvciZnPTE=.gif" border="0" height="0" width="0" /><marquee style="background-color: rgb(255, 221, 255); color: rgb(0, 0, 0); font-family: verdana; font-size: 9pt; width: 170px; height: 68px;" direction="left" behavior="scroll" scrollamount="10"><center><img style="width: 64px; height: 67px;" src="URL BANNER CONTEST 1" /><img style="width:64px; height: 67px;" src="URL BANNER CONTEST 2" /><img style="width: 64px; height:67px;" src="URL BANNER CONTEST 3" /></center></marquee></center>

3. Kalau nak letak banyak2 banner , boleh repeat je cara Lyssa tu , dengan masuk kan code macam ni , di bawah nyer . (sebelum </center></marquee></center> )

<img style="width: 64px; height: 67px;" src="URL BANNER CONTEST 4" />

4. Sudah siap . SAVE :) And Lihat hasilnya yea ! ^^

* Yang saya letak warna BIRU tu , boleh ubah ikot yang anda suka , tapi size tuh , dah oke. nampak kecik n comel je ..hehe . :* (pastikan semua nye sama yea ! ) [ klau 64px ; 67px] semua kena guna saiz yang sama , untuk mengelakkan kecatatan di ruangan itu.

=Try lah cara ini , :)=

Tutorial 43: Falling Love Object

Oke , now saya ajarkan macam mana nak buat falling love :)

1. Dashboard > Design > Add Gadget > Html/JavaScript

2. Copy and Paste code di bawah di ruangan Html itu..

<marquee behavior=scroll direction=down scrollamount=3 scrolldelay=48 height=631 style='position:absolute; left:85%; top:5px; width:15; height:631px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=2 scrolldelay=22 height=655 style='position:absolute; left:9%; top:171px; width:15; height:655px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=49 height=659 style='position:absolute; left:80%; top:61px; width:15; height:659px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=5 scrolldelay=47 height=629 style='position:absolute; left:34%; top:61px; width:15; height:629px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=13 height=584 style='position:absolute; left:12%; top:126px; width:15; height:584px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=6 height=689 style='position:absolute; left:48%; top:171px; width:15; height:689px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=4 scrolldelay=19 height=666 style='position:absolute; left:23%; top:139px; width:15; height:666px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=4 scrolldelay=9 height=619 style='position:absolute; left:40%; top:90px; width:15; height:619px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=4 scrolldelay=16 height=592 style='position:absolute; left:52%; top:180px; width:15; height:592px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=23 height=695 style='position:absolute; left:10%; top:1px; width:15; height:695px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=4 scrolldelay=50 height=532 style='position:absolute; left:66%; top:1px; width:15; height:532px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=27 height=662 style='position:absolute; left:8%; top:7px; width:15; height:662px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=3 scrolldelay=42 height=649 style='position:absolute; left:33%; top:173px; width:15; height:649px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=3 scrolldelay=43 height=555 style='position:absolute; left:92%; top:197px; width:15; height:555px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=35 height=568 style='position:absolute; left:87%; top:185px; width:15; height:568px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=4 scrolldelay=14 height=659 style='position:absolute; left:89%; top:46px; width:15; height:659px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=6 height=685 style='position:absolute; left:29%; top:0px; width:15; height:685px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=2 scrolldelay=30 height=619 style='position:absolute; left:29%; top:108px; width:15; height:619px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=2 scrolldelay=45 height=530 style='position:absolute; left:38%; top:45px; width:15; height:530px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=5 scrolldelay=38 height=572 style='position:absolute; left:73%; top:129px; width:15; height:572px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif border=0></marquee>

3. Object di atas , adalah untuk jatuh kan object LOVE PINK .

(Banyak lagi Icon Comel kat SINI !)

4. **Penting !! Add gadget di BAWAH header :)

5. Dah siap . SAVE ;)

Tutorial 42: Sticky Post

Oke , now , saya ajarkan cara nak buat sticky post

1. Korang tulis macam biasa kat post korang tuh . Dah siap tulis . Publish Post .

2. Then , korang pergi kat edit post tadi ..( Buat macam ni)

1 . Klik Post Option.

2. Tick dekat Scheduled at

3. Type tarih yang korang nak post korang sampai bila

4. Masa korang nak post korang sampai bila

5. Da siap . Publish Post :)

=Selamat Mencuba Yea!=

( Jadi tak ? Bagitawu yer XD )

Tutorial 41 : Automatic Recent Post

Hii , korang mesti ada yang nak tahu kan , macam mana nak buat automatic recent post

So, korang nak tahu tak ? meh cini nak ajarkan :)

1. Log in > Dashboard > Design > Add Gadget > Html/JavaScript

2. Copy And Paste code di bawah di ruangan Html/JavaScript ok?

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">

</style>
<script language='javascript'>

imgr = new Array();
imgr[0] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[1] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[2] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[3] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[4] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 70;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://URL BLOG.blogspot.com/";
limitspy=4
intervalspy=4000
</script>

<div id="spylist">
<script src='https://sites.google.com/site/unwanted86/javascript/animatedrecentpost.js' type='text/javascript'></script>
</div>

*Yang warna MERAH tu ,korang letakkan URL BLOG korang ok ?

3. Da siap . Save :)

=Selamat Mencuba!=

Tutorial 40: Cara Mengelakkan Post Menjadi Dua ( Double)

macam mana nak buangkan post di blog kita yang ada dua kali .. Bila post jer.. dalam SATU PAGE blog tuh , ada dua Entry yang sama !

Pada sesiapa yang blog dia pernah jadi apa yang saya katakan ni ..

Maybe diorang paham lah kot ...

Kalau nak buang DOUBLE POST tu , boleh ikot tutorial di bawahh ye! :)

1. Log in > Design > Edit HTML

2. Tekan Ctrl F Dengan serentak , cari kod ini :

<b:widget id='Blog2' locked='true' title='Blog Posts' type='Blog'/>

Bila dah cari akan keluar macam ini lah :

3. Korang highlight yang saya tunjukkan Warna biru di atas ni haa ..

Then , kornag delete lah ... Tapi , pastikan atas Blog2 ada Blog 1 ..

**Nanti , kalau pakai delete kanggg.. tetiba hilang semua entry pulakk kangg. haha...

4. Ok , dah delete kan ? Sekarang , cuba PREVIEW ! jangan SAVE lagi . nanti , takut tak menjadi lak ..Bila dah PREVIEW , Jadi... apalagi , SAVE cepat !! :) hehe...

Selamat Mencuba yea!! ^_^

Tutorial 39: Template And Background Yang Cute

nak ajar korang macam mana nak buat n cari background yang comel2!

Oke ,tanpa membuang masa , saya teruskan lah dengan tuto Lyssa ni k ?

Sape nak ikot , cepatan ! nanty , tertinggal ketapi lak! hik3!

1. Log in > Dashboard > Design > Template Designer

2. Lepas tuh , akan keluar macam ini ! Kalau tak jelas, klik gambar di bawah :)

3. Pilih design template yang korang suka ok . Then , Apply To Blog.

4. Dashboard > Design >Add Gadget > Html/JavaScript

5. Copy And Paste Code Background (CSS Code) anda di ruangan Htlm/JavaScript

* Anda boleh dapatkan background yang comel2 kat SINI ok !

6. Da siap . SAVE . And lihat hasillnya ! :)

p/s : Pada sesiapa yang sudah mencuba , and menjadi , gitaw kat saya ok! :) wink*

Ok ! Perhatian jugak kepada sesiapa yang menghadapi masalah sebegini :

DOUBLE BACKGROUND . (Atas color lain , kat bawah ada background)
Boleh lah KLIK SINI CEPAT ye ~ :)

=SELAMAT MENCUBA=

Tutorial 38: Border di Luar Blog

Heloww !

Salam Readers :)

hokie

Now ,saya nak buat SATU tutorial border di luar blog ;)

Bila ada border ,nampak lah kekemasan at blog anda tu ;)

1. Dashboard > Design > Edit Html

2. Korang cari kod ini yea .(Tekan ctrl+F untuk memudahkan pencarian)

.content-inner {

3. Copy and paste kan code ini di bawah code yang anda cari tadi k?

border: 3px solid #000000;

BIRU : kalau nak tukar tebal border tuh
MERAH : kalau nak tukar jenis dye macam . [ dashed | dotted | solid ] . Pilih salah satu .
HIJAU : kalau nak tukar color border tuh .

4. Save dan Lihat hasilnya oke ;)

Oke ! Selamat Mencuba yeaXD

Tutorial 37: Create Read More

Salam korang ~

Today ,saya nak teach korang macam mana nak create Read More ok ?:)

Bagi sesiapa yang teringin sangat nak tahu kan ?

saya ada ini untuk teach korang !

Oke :))

1. Buat entry korang macam biasa . Lepas satu perenggan , korang click pada button insert jump break di bawah perenggan tersebut. Lihat contoh di bawah ok?

Before

After

2. Then , korang type lah entry korang macam biasa , then publish ! Pastu , lihat hasilnya ok?

*Kalau korang preview , tak akan jadi taw! so , korang kenalah publish untuk lihat hasilnya :)

Selamat Mencuba!!

Tutorial 36: Floating Button

Hey Hey !

oke ,now! saya nak teach korang , macam mana nak buat floating button !

Apa itu floating button ? Tengok kat bawah ni :)

Floating button ini , ada dekat sebelah ~~KIRI~~ blog Lyssa k?

1. Log in > Dashboard > Design > Add Gadget > Html/Java Script

2. Copy code dibawah ni dan paste di ruang HTML/Javascript

<style type='text/css'>
a.linkopacity img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;}

a.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0; }
</style>

<div style='display:scroll; position:fixed; top:140px; left:-12px;'>

<a class='linkopacity' href='http://www.facebook.com/LyssaDollixious' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='facebook'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/232.png" /></a><br />

<a class='linkopacity' href='http://twitter.com/LyssaDolly' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='twitter'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/432.png" /></a><br />

<a class='linkopacity' href='http://lyssadollixiouse.blogspot.com/' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='feed'><img border="0" src="http://img.photobucket.com/albums/v486/mafiatrg/blogger_64x64.png" /></a><br />

</div>

3. Yuhuu ! Belum Siap lagi tuh! Then , kan yang tulisan warna PINK tu , korang tukarkan lah dgn link korang k?

* Yang warna MERAH = boleh tukarkan mengikut kesesuaian blog . Left boleh tukar menjadi Right !
*Bagi yang warna BIRU pula , if korang nak kekalkan pun tak pe , kalau nak , just tukar kan je link itu ;)

Tutorial 35: Letak Kesan Salji Pada Blog

Salam Semua .

Pada sesiapa yang mahu kan blog anda penuh dengan salji yang berterbangan ,

saya akan try ajar , and ikot cara Lyssa ini ok?

(Tapi , Salji ini Warna Putih dengan Hitam je taw?) huhu=)

1. Dashboard > Design > Add Gadget > Html/Java Script

2. Copy salah satu kod berikut kemudian paste dalam ruangan html/javascript

Kod untuk salji putih (sesuai untuk background hitam)

<script type="text/javascript" src="http://www.yourjavascript.com/14104214083/snow-white.js"></script>

Kod untuk salji hitam (sesuai untuk background putih)

<script type="text/javascript" src="http://www.yourjavascript.com/03441140321/snow-black.js"></script>

3. Save dan lihat hasilknya yea! :)

Tutorial 34: Hilang Navigation Bar

Now ,saya nak ajar kat korang , macammana nak hilangkan navigation bar ok ;)

Tapi , korang tahu ke , apa yang dimaksudkan dengan navigation bar ???

Ohh,, tak tahu ye , cuba korang tengok dekat atas header korang .

Ahaa . yang itulah navigation bar ! wee ;)

Oke . oke. cepat ikot cara Lyssa! Senang je ni :)

1. Log in > Dashboard > Design > Edit Html

2. Copy and paste code ini :

#navbar-iframe {
display: none !important;
}

3. Contohnya seperti berikut :

-----------------------------------------------
Blogger Template Style
Name: Son of Moto (Mean Green Blogging Machine variation)
Designer: Jeffrey Zeldman
URL: www.zeldman.com
Date: 01 Dec 2010
Updated by: Blogger Team
----------------------------------------------- */

#navbar-iframe {
display: none !important;
}

/* Variable definitions
====================

4. Sudah siap ? Save and lihat hasilnya :)

Tutorial 33: Menukar Home , Older + Newer Post kepada Icon Yang Comel

Nak tahu macam mana nak Tukarkan Home, Older + Newer Post kepada Icon Comel?

Oke ! saya boleh teach korunk skunk jgk .! hehe~

FOKUS taww ?

1. Log in > Dashboard > Design > Edit Html

2. Kemudian tick pada Expand Widget Templates .

3. Then , tekan Ctrl + F and cari perkataan :

<data:newerPageTitle/>

4. Tukarkan kod diatas ni dengan kod ni :

<img src="http://i947.photobucket.com/albums/ad318/hannacrazee/Decorated%20images/go5.png"/>

* Warna merah tu , korang boleh tukar kan dengan korang punya URL Gambar ok :) Itu saya kasi contoh je ^^

5. Then , Tekan Ctrl + F lagi sekali dan cari perkataan :

<data:olderPageTitle/>

6. Gantikan kod di atas dengan :

<img src='http://i561.photobucket.com/albums/ss52/angelicxmelody/Web%20materials/go5.png'/>

* Warna merah tu , korang boleh tukar kan dengan korang punya URL Gambar ok :) Itu Lyssa kasi contoh je ^^

7. Last sekali , untuk buttom home pulak , korang cari :

expr:href='data:blog.homepageUrl'><data:homeMsg/>

8. Gantikan kod yang berwarna merah tu dengan kod di bawah :

<img src='http://i561.photobucket.com/albums/ss52/angelicxmelody/Web%20materials/home1.png
'/>

Warna merah tu , korang boleh tukar kan dengan korang punya URL Gambar ok :) Itu saya kasi contoh je ^^

9. If sudah siap , korang try preview dulu taw. kot2 lah tak jadi ke , susah pulak kang .! HAHA!
If dah belek and menjadi , terus je SAVE :)

Tutorial 32: Ubah Warna Highlight

Heyy korunk .!

Oke, now pulak , saya nak teach korunk , cam ner nak ubah warna highlight.!

Macam at bawah niyh ;)

Oke , ikut step Lyssa yaw ^^

1. Log in > Dashboard > Design > Edit Html

2. Then , korunk cari kod ini : (Nak cari tekan Ctrl+F)

a:link {

3. Copy code kat bawah ni , and paste kan sebelum code yang anda cari tadi tu ok :)

::-moz-selection {
background:#000000;
color:#FFFFFF;
}

::selection {
background:#000000;
color:#FFFFFF;
}

* Ini kegunaan Mozilla Firefox dan Google Chrome saja !
* Yang warna merah di atas , korang boleh tukar kan dgn warna kesukaan korang ok?
Nak cari warna , klik SINI. :)

Sudah siap ? Save ok ?! Dan Lihat hasilnya :))

SELAMAT MENCUBA :)

Tutorial 31: Letak Copyright

Assalamualaikum :)

Tutorial lagi ^_^

Ehh, tahu ker , macam mana nak letak copyright tuh?Yg macam kat bawah ni ler :*

Haa , mudah saja ! Ikot step saya ney ^_^

Log in > Dashboard > Design > Edit Html
Cari kod ini .( Nak cari tekan Ctrl + F)

</body>

3. Then , paste kod kat bawah ni kat bahagian atas kod yang korang cari tadi ok?

<script type='text/javascript'>
    window.setTimeout(function() {
        document.body.className = document.body.className.replace('loading', '');
      }, 10);
</script>

<center>TULIS AYAT COPYRIGHT KORANG KAT SINI</center>

4. Before tuh ,preview dulu , jadi or tak .?
5. If dah jadi , SAVE terus ok :)

Tutorial 30: Button Show-Hide Spoiler

Salam~

Tutorial ni , agak menarik jugak lah ! And agak unik !

Korunk try lah k.?

But b4 tuh , saya nak tnya korang !

1. Log in > Dashboard > Add Gadget > Html/Java Script

2. Copy dan paste code di bawah pada JavaScript :

<div><div style="margin: 5px;">
<div style="margin-bottom: 2px;" class="bigfont"><input style="margin: 0px; padding: 0px; width: 95px; " value="Klik Sini" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Klik Sini'; }" type="button"/>
</div>
<div style="border: 0px inset ; margin: 0px; padding: 6px;" class="alt2">
<div style="display: none;">

Masukkan Code JavaScript/Gambar/Text Di sini

</div></div></div></div>

* Pada code warna MERAH , tukar kan dengan perkataan korunk !(fungsi sebelum spoiler di buka)

* Pada code warna HIJAU , tukar kan dengan perkataan korunk !(fungsi selepas spoiler di buka)

* Pada code berwarna BIRU korang letak code JavaScript,gambar atau text yang korang nak.

3. Save .! Lihat hasilnya :)

Tutorial 29: Background Berbeza Pada Sesebuah Entry

background dalam post , kebiasaannya telah ditetapkan dalam setting blogger. Tapi , ada SATU cara yang boleh digunakan untuk menjadikan background yang berbeza untuk entri yang dikehendaki sahaja.

1. Log in > Dashboard > New Post Anda :)

2. Pastikan semasa kod ini di paste, new post anda dalam keadaan 'edit html' BUKAN 'compose'

-> Ini untuk mengelakkan code warna dicopy sekali.:)

<div style="background:url(Link gambar disini) no-repeat;">
Taip segala entri untuk blog anda disini.
</div>

* Letakkan link gambar pada tulisan biru

* Jika anda menggunakan gambar bersaiz kecil, sila buang no-repeat.

* Taip apa sahaja entri anda seperti biasa dalam kawasan merah.

Atau kalau hendak lebih mudah, buat apa sahaja entri, tetapi ending mesti ada </div>
*Sudah siap, publish n lihat hasilnya oke? :)

Tutorial 28: Flash Blockquote

Hii ! now pulak ,saya nak ajar , macam mana nk buat Flash Blockquote ?

Sebelum tuh , korang try buat yang ini dulu.. Baru buat Flash ok ? :)

KLIK SINI DULU !!

Oke , ikot step saya ok ?:)

1. Dashboard > Design > Edit Html > Tick Eexpand Widget Templates

2. Tekan CTRL+F and cari code ni :

.post blockquote{

3. Lepas dah jumpa , paste code ni dekat BAWAH ' kod yang korang cari tadi k?

background:url(URL background

); padding:5px;

Border:2px dashed #00000;

colour:#FFFFFF}

blockquote:hover {

background: url(URL background

) repeat right bottom ;

border:2px dashed #000000;

-moz-border-radius-topleft: 10px;

-moz-border-radius-bottomright: 10px;

}

*Yang Lyssa warnakan MERAH tuh , korang boleh cari code kat SINI

4. Siap . Save :)

=Selamat Mencuba=

(Dah jadi ,bgtawu ok?)

Tutorial 27: Buat Dropdown Menu

Oke , sekarang , saya nak share ngn korunk , macam mana nak buad dropdown menu.

Pada sesiapa yang tak tahu , apa itu DROPDOWN MENU.? Lihat gambar di bawah ;)

Oke , skunk ,korunk ikut step yang Lyssa buat kat bawah ni :)

1. Login > dashboard > page element > add a gadget > HTML/javascript

2. Copy code kat bawah ni , ke dalam ruangan html/javascript.

<select onChange="document.location.href=this.options[this.selectedIndex].value;">
<option selected>Tajuk</option>
<option value="Link 1">Text 1</option>
<option value="Link 2">Text 2</option>
</select>

Link 1 : Masukkan link untuk dibuka
Text 1 : Masukkan perkataan/ayat untuk link

3. Jika anda hendak masukkan lebih banyak menu, cuma copy paste

<option value="Link 2">Text 2</option> dan letakkan sebelum </select>

4. Da siap? :) save hasil kerja anda ! :)

Selamat Mencuba , yea :)

Tutorial 26: Letak Background Gambar Pada Blockquote

Pada sesiapa yang nak tahu cara nak letak Background Gambar Pada Blockquote ,

Mari sini , saya ajar kan :)

1. Login > Dashboard > Design > Edit HTML

2. Dengan menggunakan fungsi Find (ctrl + F), cari kod berikut :

.post blockquote {

3. Kemudian di bawah kod tersebut, letakkan kod ini.

background-image:url(url gambar);

* Url gambar , korunk boleh amik di sini :) Photobucket!
* Korunk carilah background yang korunk suka kat situ ok? (search je ape2! :)

4. Siap . Save :)

p/s : Pada sesiapa yang tidak tahu cara penggunaan blackquote . Mari sini , Lyssa teach korunk !

1. First , korang HIGHLIGHT ayat yang korunk nak buad blackquote tu .
2. Then , korang click yang no 2 yang Lyssa tunjukkan at atas ,
3. Lepas publish , korang akan dapat hasil nya!

Selamat Mencuba :)