Belog Cik Permata_Dehearty: April 2012

Kotak Kod Banner Kat Sidebar or Exchange BAnner

Hye...Adesss...panas tol ptg neh...

Cuaca skrg mmg xmenentu ek...

kekadang hujan lbat..kekadang pnas gler...

Apepun...itulah kekuasan Allah...

Ok..pns2 pun..Cik Permata ttp nk wat tutor arini...

Sape2 yg nak wat kotak banner..leh la try tutor neh..

nnti leh la kita exchange rmai2 yer...huhuhuhh...

Contoh cam kat bwah yer pde sape2 yg xpham ape yg cik permata tuliskan neh...

Simple aje care die....

Ikut satu-satu yer.....

Log in > Dashboard > Design > Add Gadget > Html/JavaScript
Copy code kat bawah ni , and paste di ruangan html/javascript tadi tuh ok :

<center>
<img style="width: 167px; height: 157px;" src="URL BANNER KORANG" />
<center>*AYAT KORANG*</center>
<textarea cols="13" rows="3" style="text-align: center;"><a href="LINK URL BLOG KORANG/"><img src="URL BANNER KORANG" /></a></textarea></center>

Warna Pink : Korang boleh ubah size yang korang suka
:34:

Warna Merah : Url Banner Korang
:34:

Warna Kuning : Sukati korang nak letak ayat apa pun
:34:

Warna Biru : Link Blog Korang

Da siap . SAVE and lihat hasilnya. :-)

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Tajuk Blog Bergerak kat Menu Tab

Hye....Ade sape2 x yg berminat nk wat tajuk blog die menari2 kat tab menu???

Xpaham???

Cube tgok kt tab menu cik permata...

ayat ....bingkisan rindu...curahan Qaseh..Lakaran Kehidupan...duk menari2 ke kiri???Hah tu la bndenye yg cik permata nk wat malam neh...

xpaham lgi???

Tgok plak pde gmbor bwh yer..

klu xphm gk...korang wat jela tutor neh..pastu tgok hsilnye...Baru la pham agknye.....

Dashboard > Layout/design > Edit HTML. Tick pada kotak Expand Widget templates.

Cari kod kat bawah..Guna CTRL+F untuk mudahkan pencarian...

<head>

Da jumpe????Copy plak kod kat bawah yer.....

<script language='JavaScript'>
var txt=" Tajuk korang ";
var kelajuan=250;var segarkan=null;function bergerak() { document.title=txt;
txt=txt.substring(1,txt.length)+txt.charAt(0);
segarkan=setTimeout("bergerak()",kelajuan);}bergerak();
</script>

And paste kat atas kod <head>....yg korang cari tadi...

Note Cik Permata:
Tajuk korang korang pilih lah ye tajuk yang korang nak letak
250 kelajuan teks tu bergerak...makin kecil makin laju k

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Tutorial double underline

Salam..jom wat underline berdouble...

cam cik permata punye belog..

kan cantek ble ade double line cam tuh..

baru la org alert ckit ble kte nk bg point penting...

huhuhuhuh...

k..xnk ckp byak...truskan dgn tutor yer....

1. bukak blog > template > tick expanded widget > cari kod kat bawah nie .

/* Header

2. dah jumpa ? oke , kemudian copy kod nie dan letakkan DI ATAS kod yang korang cari tadi .

u {
text-decoration:underline;
border-bottom: 2px solid #000000;
padding: 0px;
}

3.Preview dulu , then save !

Da jadi??HAh...apelagi..klik donate byak2....hehhee..Jgn lupe komen eh..TQ...

Kredit SINI gak...

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Hover Blockquote (Cute Icon Muncul Bila Cursor Meyentuh)

hye...Selamat malam sume...

Sblum tido..Cik Permata nk wat tutor ckit...

Nak tambah eksesori pde kotak blockquote..

Ape tuh???Hah....

Bila cursor sentuh blockquote ,

akan keluar cute icon yang comey tomey...hehehee...

xpham???hah...wat dulu tutor neh....Tiapkali korang cuit kotak blockquote cik permata...

Baru la korang akan pham kan????

1. Log in > Dashboard > Design > Edit Html

2. Tekan Ctrl F serentak , dan cari :

.post blockquote {

3. Dah jumpa kan ? Korang Copy yang ini pulak :

blockquote:hover {
background-color: #FFC8F2;
-webkit-transition-duration: 3.5s;
background-image:url(URL GAMBAR KORANG);
background-position:bottom right;
background-repeat:no-repeat;
}

4. Paste di bahagian bawah kod yang korang carikan tu...Contohnye....

NOTE CIK PERMATA:

Warna Pink : Warna Background Selepas Cursor Menyentuh Blockquote

TEKAN SINI UTK KOD

URL GAMBAR KORANG : URL picture Yang Akan Muncul Selepas Cursor Menyentuh Blockquote.

TEKAN SINI UNTUK KOD

5.Preview eh..Klu xde msalah..save jela...

Kalu malas..leh amek je URL kat bawah eh....

http://dl8.glitter-graphics.net/pub/39/39368n1b2x3prdz.gif

http://dl9.glitter-graphics.net/pub/679/679789gs2dqrx3bd.gif

http://dl6.glitter-graphics.net/pub/584/584776qvkek99ty3.gif

http://dl9.glitter-graphics.net/pub/244/244519cj7iewvdtg.gif

http://dl4.glitter-graphics.net/pub/772/772194zn1mdfi11c.gif

Sumber: lyssa Faizureen

P/s: Dah Daftar CHURP_CHURP ke Belum???Klu Lum..KLIK SINI yer..Leh tambah wet sambil Berblog....

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Ayat Bawah Post Entry Berwarna

Selamat pagi n selamat bhujung minggu sume.....

Sihat x????

Pgi2 neh..cik permata nk ajr sume tutotial yg simple ajer....

Mane yg tau...leh la klik donate jer..hehehee..

yg xtau...kne wat tutor n klik donate skali...kekekee...

gurau je..tpulang kt sume la..xde pksaan pn...:P

So.Ni la Bnde yg cik permata ajarkan..Da paham????

Let's Start it!!

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

2. Tekan Ctrl F serentak , dan cari kod :

<data:post.body/>

3. Dah jumpa ? Copy kod ini :

<hr/><center><span style='color: #000000;'><b>Ayat korang di sini </b></span></center><hr/>

4. Then , pastekan di bahagian BAWAH kod yang korang carikan tadi tu :)

PURPLE --->>> Untuk colour bg ayat tuh..
MERAH ---->>> Tulis la pape ayt pn yg korang nk eh...

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Letak Copyright bergambar kat Blog

hye...kali neh tutorial yg pling simple jer....

Pade yg xtau nk wat copyright kt blog..arini cik permata nk ajr 2 care nk wat bnde alah neh...

Bese korang wat copyright....juz tulis aje kan ape yg korang nk???

yg neh cik permata nk ajr cm ner nk letak copyright bergambar...

baru la lbeh mnarik kan???hehehehe

Letak Copyright By Word

</body>

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>

Letak Copyright By Picture

CTRL+F dan cari code di bawah nie.

</body>

Copy code bawah nie lak, dan paste atas code yang korang cari tadi tue

<script type='text/javascript'>
window.setTimeout(function() {
document.body.className = document.body.className.replace('loading', '');
}, 10);
</script>
<center><img border='0' src='URL GAMBAR COPYRIGHT KORANG'/></center>

Lepas tue korang try Preview tengok, jadi tak?

Kalau tak error, sila SAVE!

BACA nie jgak...

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Cubaan Doodle Cik Permata

Salam sume...

hye..arini cik permata nk share dgn korang hasil tangan cik permata lukis doodle...

Actually cik permata bukannye sorang yg kreatif n pndi lukis2 pun...

Tpi dsbbkan tbe2 jer ade minat nk wat doodle...

Cik Permata trus google cari tutorial yg ajr lukis doodle pling simple...

Hasilnye...wah..agk berbangge la sbb ist time lukis...mjadi la gk...hehehehee...

hahahahaa..mesti korang gelak kan???

memang cik permata ngaku...doodle neh mmg la klakar...

tah pape eh....

Tpi sbb excited sgt n xpnh reti nk wat doodle...

tbe2 hasil pertame..mjadi....so bio lah org kate selok pun...

cik permata ttap puas ati....

hehehehehe.....

ok...ni jer entry untuk yg neh...

nnti ade mse..cik permata wat tutorial eh...

Tata...

Hah..KLIK sini yer...!!!!

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Jangan main2 dengan 20 sen...

Tersebut kisah ada seorang Imam yang telah dipanggil ke suatu tepat untuk menjadi Imam tetap di sebuah masjid. Telah menjadi kebiasaan Imam tersebut selalu menaiki bas untuk pergi ke masjid.

Pada suatu hari, selepas Imam tersebut membayar tambang dan duduk di dalam bas, dia tersedar yang pemandu bas tersebut telah memulangkan wang... baki yang lebih daripada yang sepatutnya sebanyak 20 sen.

Sepanjang perjalanan Imam tersebut memikirkan tentang wang 20 sen tersebut.

"Perlukah aku memulangkan 20 sen ni?" Imam tersebut bertanya kepada dirinya.

"Ah... syarikat bas ni dah kaya... setakat 20 sen ni.. nak beli tosei pun tak cukup," hati kecilnya berkata-kata.

Apabila tiba di hadapan masjid, Imam tersebut menekan loceng dan bas tersebut pun berhenti.

Ketika Imam tersebut ingin turun sahaja daripada bas, tiba-tiba seakan-akan dirinya secara automatik berhenti dan berpaling ke arah pemandu bas tersebut sambil memulangkan wang 20 sen tersebut.

"Tadi kamu beri saya wang baki terlebih 20 sen", kata Imam tersebut kepada pemandu bas tersebut.

"Owh... terima kasih! Kenapa awak pulangkan 20 sen ni.. kan sedikit je nilainya," pemandu bas tersebut berkata.

Imam tersebut menjawab, "Wang tersebut bukan milik saya, sebagai seorang muslim saya perlu berlaku jujur."

Pemandu bas tersebut tersenyum, dan berkata, "Sebenarnya saya sengaja memberi wang baki yang lebih sebanyak 20 sen ni, saya nak uji kejujuran kamu wahai Imam. Saya sudah berkali-kali berfikir untuk memeluk Islam."

Imam tersebut turun dari bas dan seluruh jasadnya menggigil dan kesejukan. Imam tersebut berdoa sambil menadah tangan, "Astaghfirullah!!! Ampunkan daku Ya Allah... Aku hampir-hampir menjual harga sebuah Iman dengan 20 sen!!!"

Ps/jgn la gadai iman kita dgn seberapa besar pun nilai wang.. kerna iman tak boleh di jual beli...

Sumber: Admin amRF (FB)

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Round Hover With Shadow

Arini nak wat tutor psal Round Hover With Shadow...Maknenye..klu cursor korng klik kat picture or link...die akan jadi bentuk oval...syiokk kan??so jom la rami2 wat....

1. Log in > Dashboard > Design > Edit Html > Tick Expand Widget Templates

2. Tekan F3 atau Ctrl+F search kod kat bawah ini :

/* Header

3. Dah jumpa ?Oke . paste kod ini pula kat ATAS kod yg korang cari tadi tu ok ?:)

/*------ IMAGE ANIMATION------*/
img {filter:alpha(opacity=100);
-webkit-transition-duration:.5s;} img:hover {filter: alpha(opacity=60); opacity: .6; -webkit-box-shadow: 0px 0px 20px #FF3366; -moz-box-shadow: 0px 0px 20px #FF3366; -webkit-border-top-right-radius:30; -webkit-border-top-left-radius:30; -webkit-border-bottom-right-radius:30; -webkit-border-bottom-left-radius:30;}img:hover {filter: alpha(opacity=60); opacity: .60; border: 1px solid#FF3366; border-radius: 50px; -moz-border-radius: 50px;}
-moz-opacity:1.0;
opacity:1.0;
}
img:hover {
filter:alpha(opacity=80);
-moz-opacity:0.80;
opacity:.80;
}
u {
text-decoration:underline;
border-bottom: 2px dotted #ff0080;
padding: 0px;
}

**Tukar kod colour pink mengikut color yang korang suka ok ? :)

4. Da siap . SAVE !

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Cara Guna Blockquote Pada Post

Arini nak ajar tutor pde sape2 yg xtau cm ner nk gune blockquote...

Klik Picture untuk lebih jelas

Buat pape jer post yg korang nak...
Tulis apa-apa sahaja yang berkaitan dengan blog korang or cik permata dehearty. Pastikan ada link ke blog cik permata dehearty erk...hehehehe....
Kemudian 'select' pada ayat yang korang nak letakkan blockquote.
Klik pada icon blockquote di Menu Post.
Publish!

So akan kluar la kotak blockquote yg korang nak tuh...

Klu nk cantekkan kotak tuh..bace ENTRY nie plak eh...

Ok..Da pham??Jgn lupe klik donate button eh....

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Border di Post Body

Salam...Jom wat tutorial neh...

Tutor untuk mereka yg nk ade border kat post body/kat kotak entry cam cik permata...

So...jom teruskan dgn tutorial....Ape2hal..korang back up dlu tau template korang...

Takut nnti xjdi..Menanges la plak...uhuhuhuh....

oh yer..For ur in4...Tutorial ini sesuai untuk classic template dan hanya sesetengah template

designer je yang boleh guna.

1. Sign in Blogspot > Design > Edit Html

2. Cari code di bawah, Ctrl F dan paste dalam kotak find..enter!

/* Posts

3. Di bawah code tadi, korang akan jumpa code seperti ini ( lain template, lain code ) korang

PADAM code je yang DIMERAHKAN.. Padam sehingga/sebelum code .post blockquote {.

kalau coding korang tak sama macam code .post blockquote { ni, korang padamkan

sebelum sampai perkataan blockquote sahaja. *asalkan ada perkataan blockquote pun tak apa..

/* Posts

----------------------------------------------- */

.date-header {

margin: 1.5em 0 0;
font-weight: normal;
color: $dateHeaderColor;
font-size: 100%;
}
.post {
margin: 0 0 1.5em;
padding-bottom: 1.5em;
}
.post-title {
margin: 0;
padding: 0;
font-size: 125%;
font-weight: bold;
line-height: 1.1em;
}
.post-title a, .post-title a:visited, .post-title strong {
text-decoration: none;
color: $textColor;
font-weight: bold;
}
.post div {
margin: 0 0 .75em;
line-height: 1.3em;
}
.post-footer {
margin: -.25em 0 0;
color: $textColor;
font-size: 87%;
}
.post-footer .span {
margin-$endSide: .3em;
}
.post img, table.tr-caption-container {
padding: 4px;
border: 1px solid $borderColor;
}
.tr-caption-container img {
border: none;
padding: 0;
}
.post blockquote {
margin: 1em 20px;
}
.post blockquote p {
margin: .75em 0;
}

4. Gantikan tulisan yang merah tu dengan code ini, bawah code

/* Posts
----------------------------------------------- */

.date-header {
margin: 1.5em 0 .5em;
text-align: right;
background: white;
color: #000000;
line-height: 1.0em;
font-size: 16px;
font-family: verdana;
}
.post {
margin: .4em 0 2.5em;
padding-bottom: 1.5em;
border: solid #000000 3px;
background: #ffffff;
}
.post-title {
margin-bottom: 1px;
margin-top: 4px;
font-size: 18px;
font-weight: 500;
font-family: times new roman;
line-height: 1.3em;
text-align: left;
color: #000000;
background :#FC5DB4;
padding: 0 3px 3px;
}
.post-body {
margin: 0 0 .75em;
line-height: 1.6em;
padding-left: 5px;
padding-right: 4px;
}
.post-title a, .post-title a:visited, .post-title strong {
text-decoration: none;
color: #000000;
font-weight: bold;
}
.post-footer {
margin: -.25em 0 0;
color: #000000;
background :#FC5DB4;
font-size: 100%;
}

kedudukan tulisan - right, left, center

jenis font - ikut suka koranglah.
font-size - saiz font
#FC5DB4 - warna background post title dan footer, cari SINI
#000000 - warna tulisan SINI
#ffffff - warna body entry background. SINI
border: solid #000000 3px; - solid boleh tukar kepada dotted, dashed, double. 3px - lebar,
#000000 warna border.

6. Kalau korang bosan dengan bentuk yg sedia ada,juz Klik laju2 kat BORDER..and letak kat

BAWAH code

border: solid #000000 3px;

7. Preview, kalau menjadi sila SAVE je.Ok??Selamat mcube!!!

p/s: TQ to Cik Farah untuk tutorial yg sgt menarik neh....

Tip Penjagaan RAmbut???Jom BACE!!!

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Bentuk-Bentuk Border

Bosan dgn Bentuk border berpetak jer???

Jom tukar selera korang dgn pelbgai bntuk border yg menarik...

Pilih jer sesuka ati and korang leh gunakan untuk border kt blockquote, sidebar tittle or untuk post body....

Bentuk-bentuk Border yg Awesome!!!!!

-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;

CARA NAK GUNE!!!..

1. Sign in Blogspot > Design > Edit Html
2. Cari code di bawah, Ctrl F dan paste dalam kotak find..enter!

Untuk Post Title : seacrh >> h3.post-title { (kalau tak de, carilah kod yg lebih kurang :)
Untuk Sidebar Title : search >> h2 { (kalau tak de, carilah kod yg lebih kurang :)

3.Paste kod BORDER di BAWAH kod yang perlu korang carikan tu yea! :)

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Scroll box pada bloglist

Jom Wat scroll box untuk blog list supaya nampak lagi kemas dan tersusun blog korang eh...

So nti xdela korang pnye bloglist pnjg berjela2 jer...hehehee...

Ape2hal pun..korang mesti dh ade widget untuk bloglist korang yer....

ok..jom start tutorial neh....

1. Sign in Blogspot > Design > Edit Html > Tick Expand Widget Templates

2. Then, korang kena cari tajuk blog list korang (bergantung pada tajuk blog list masing-masing).Sila CTRL+F yer untuk mudahkan pencarian..Contoh tajuk bloglist Cik Permata:

Gedung Ilmu

3. Kalau dah jumpa tajuk blog list korang, korang akan jumpa code di bawah berhampiran tajuk blog list korang.

<div class='widget-content'>

korang replace/tukarkan dengan code di bawah :

<div class='widget-content' style='overflow:auto; width:ancho; height:200px;'>

Tgok Pic kt bwah eh klu xpham....

4. Sekarang dah siap!..so preview, kalau menjadi silalah SAVE

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Cute Cursor kat blog

Jom ubah curser korang...

xbest la kan asek gune cursor bese jer...

Ape kate kite wat pbaharuan ckit..Nak x?hehehehe...

Let start it!!!!

Klik Layout > Add a Gadget >HTML/Javascript .
Copy code di bawah ini dan pastekan kedalamnya

<style>body {cursor:url(URL ICON), url(URL ICON), auto;} </style>

<a href="LINK BLOG KORANG" target=_blank><div style="height: 50px; width: 50px; position: absolute; top: 0px; left: 0px;"> </div></a>

Jom men Teka-Teki...

Colour Merah masukkan URL cursor korang eh...

Colour hijau plak..masukkan link/web blog korang

Kalu nk cursor free and mls nk cari..juz g kat SINI eh...

p/s: kalu sudi..sila la klik Button Donate eh..xpun Klik kat SINI jer..

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Pasang Donate Button bawah post

Salam..Tutorial lagi dari Wan HAzel...

Kali neh...Nk pasang Donate Button kt bwah post..Cth cam kt bwh post Cik Permata skrg..

Function die???

Try klik button kat bawah tu..klik Donate tu..dan tengok apa terjadi..Kalau korang nak gk wat cm tuh..Jom ikut tutor neh...

Pengguna Design/layout

Dashboard>Design/layout>Edit HTML

tick expand widget

Cari kod kat bwah neh gune CTRL+F dan enter..

<data:post.body/>

Copy dan pastekan kod kat BAWAH sekali tu betul betul di bawah kod yang Dicari tdi..

Bagi pengguna Blogskin/classic template

Dashboard>Template

Cari kod kat bwah gune CTRL+F untk mudahkan pcarian

</BlogItemBody>

Copy dan pastekan kod kat BAWAH sekali tu betul betul di bawah kod yang Dicari tadi..

Koding Untuk Button Donate

<a href='YOUR CHURP2/HEARTBEAT/SAYS/DLL LINK' target='_blank' title='Thanks You'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgucTNsLBfNnjrviFxcedGve9VhQN5MJR-c0A2xcQvE5K-Zw6WMxAiRxH2DdnUv_QxQ7HwF1VvivyiS621RaCc0TEiqTNqvtnA9SWzMf_zhnIkFHxmZvhwl8ONzIGmBVyNSQWz0PygL-oQ/s1600/1.png' width=''/></a>
<a href='http://wanhazel.blogspot.com/2012/02/tutorial-pasang-donate-button-bawah.html' target='_blank' title='Get This Button'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYjfNIU8whey1Jpme_yXZFt79LHxEs4cRZv3IE1P4xE4oBKGXoUhvkmLI4_qF9DdKeVJLT4HEliJr69E2kynCure-FBvkNy-WhGojWYMzRMUWnWwWuwPIjJffPFzxREsvYC1Yv2W7g420/s1600/2.png'/></a>

YOUR CHURP2/HEARTBEAT/SAYS/DLL LINK'>>>Letak link income korang

Bile ade iklan baru..kene la tukar LINK korang eh...

Preview dulu...kalau tak de error..Korang Save k..

Selamat mencuba!!!

p/s: kalu sudi..sila la klik Button Donate eh..xpun Klik kat SINI jer...

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Pasang button like dan send Facebook di setiap entri blog

Salam..nie tutorial dari Wan Hazel eh...

Cik Permata nk amek tutorial neh..supye sng nnti nk refer len kali if Cik Permata nk meng-edit blog agi..

Sape2 nk join..jom ikut tutor nie erk...

Pengguna Design/layout

Dashboard>Design/layout>Edit HTML

tick expand widget

Lepas tu cari lah koding nie..Nak sng tekan CTRL+F

<data:post.body/>

Bila dah jumpa koding tu..Copy dan pastekan kod kat bawah sekali tu betul betul di bawah kod yang korang cari tadi..

Bagi pengguna Blogskin/classic template

Dashboard>Template

Cari kod neh..CTRL+F je untk sng cari

</BlogItemBody>

Bila dah jumpa koding tu..Copy dan pastekan kod kat bawah sekali tu betul betul di bawah kod yang korang cari tadi..

Koding Send and like button FB

<b:if cond='data:blog.pageType != "static_page"'><div style='float:left;padding:5px 5px 5px 0;'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'></script><fb:like expr:href='data:post.url' font='' layout='standard' send='true' show_faces='false' width='450' colorscheme='light'></fb:like></div></b:if>

Preview dulu...kalau tak de error..Korang Save k

Selamat mencuba

p/s: kalu sudi..sila la klik Button Donate eh..xpun Klik kat SINI jer...

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Icon Comel di Blog Archive

Jom Wat tutorial neh plak eh.....

Nak ajar sume care cm ner nk wat cute icon sblah blog archive...

Sila lihat gambo dbwah...

Amacam???comey x???hehehehehe....

Jom teruskan dgn tutorial eh....

1. Sign in Blogspot > Design > Edit Html > Tick Expand Widget Templates

2. Cari code di bawah, Ctrl F sahaja dan paste code di bawah dalam kotak find then enter!

<a expr:href='data:i.url'><data:i.title/>

3. Padam/delete code yang korang cari tadi dan gantikan/replace dengan code di bawah :

<a expr:href='data:i.url'><img src="URL ICON"/><data:i.title/>

4. Gantikan URL ICON dengan icon comel kesukaan korang!

5. Dah siap, sila preview dan SAVE kalau tidak error. Good Luck!

p/s: kalu sudi..sila la klik Button Donate eh..xpun Klil kat SINI jer...

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Slide float Shoutbox with cute Frame and icon

Salam sume...

Kali neh..nk wat shuoutbox aka fibox yg ade slide comey cam cik permata punye...
Cantek kan???ni tutorial wa amek dari Wan Hazel.....

Dashboard>Add gadget>HTML

Copy kod kat bawah and paste kat DALAM kotak HTML eh....

<div style='display:scroll; position:fixed; top:10px; right:10px;'>
<a class='linkopacity' href='http://wanhazel.blogspot.com/2011/05/tutorial-slide-float-shoutbox-with-cute.html' imageanchor='1' rel='nofollow' style='margin-left: 1em; margin-right: 1em;' target='_blank' title='Get Slide Float Shoutbox'><img border="0" src="http://i1009.photobucket.com/albums/af215/wanhazel252909/iconlink.gif" /></a><br />
<a href="javascript:void(0);"onclick="showHideAT()"/><img class= width="140" height="140"src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9MxF_FNqqBiqqklecwZdPlySBMONPfX-OBMTu1pAnvYSkrSVg5ABGLMzWq-1fQXd6PPNr2kiKvvyLtjpjXi0tNCQS577h7WHNdFqgdNFSQqqNKR0BGsE-ue3iBo0DbARDwxFmp-2nF9x9/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/AVvXsEg65TSEGobpKPGVXyMNmYCoZEv_RqYSO0oaWb7DEElMcUR6dGuyM_83tpQgyEzxiqsd4rp2ZBMRtR-mygd8Yd654aX2NneZxNMB2r0jDGTzovRTIGikcRU9NDxCxMpdLebYDAFaRr0Ql2k/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/Fibox/Cbox 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>

Nak Ubah Frame untuk Slide Shoutbox korang kat sini eh..

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg65TSEGobpKPGVXyMNmYCoZEv_RqYSO0oaWb7DEElMcUR6dGuyM_83tpQgyEzxiqsd4rp2ZBMRtR-mygd8Yd654aX2NneZxNMB2r0jDGTzovRTIGikcRU9NDxCxMpdLebYDAFaRr0Ql2k/s1600/kak+yana+shout+frame+copy.png

Nak ubah Icon Slide Shout korang nie lak..Korang ubah kod nie..

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9MxF_FNqqBiqqklecwZdPlySBMONPfX-OBMTu1pAnvYSkrSVg5ABGLMzWq-1fQXd6PPNr2kiKvvyLtjpjXi0tNCQS577h7WHNdFqgdNFSQqqNKR0BGsE-ue3iBo0DbARDwxFmp-2nF9x9/s1600/icon+shout.png

Ok??Untuk Freebies Frame yang Len..Sila la Klik >>>>SINI

p/s: kalu sudi..sila la klik Button Donate eh..xpun Klil kat SINI jer...

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Centerkan header

♥Asslamualaimum & Salam sejahtera♥

Ade mslah x cm ner nk kasi korang pnye header duk kt tengah2???

klu ade...jom try tutorial nie plak erk....

Dashboard-design-edit HTML-tick expand widget

CTRL+F cari code

/* Content

dah jumpa? copy code kat bawah ni .

.Header img {margin-$startSide: auto; margin-$endSide: auto;}

paste ATAS code /* Content tadi .

p/s: kalu sudi..sila la klik Button Donate eh..xpun Klil kat SINI jer...

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Cantekkan Blockquote and Hover Blockquote

Salam sume yer......

Ari tuh...Cik Permata da ajar cara nak wat blockquote pade sape2 yg xde html kod kat edit html kan???ingat x???klu xingat...jom tekan laju2 kat >>>>>SINI

So..skarang neh.. nk ajar plk cre nak cantikkan blockquote yg ade background cantek......and jgk leh wat hover blockquote skali...

tau x hover tuh ape????ok...pde yg xtau..hover tuh..mknenye...ble cursor korng sentuh kt kotak blockquote...tbe2 jer background die jadi lain plak....

ok la...xnak cter pnjang2...jom truskan dgn tutorial...hehehhee.....

Pergi dashboard > design > edit html pastu seach code nie , nak senang tekan Ctrl + f

.post blockquote {

da jumpa ? copy code kat bawah then paste di bawah code yang korang jumpa tadi

background: url(URLBACKGROUND1);
border:1px solid #000000;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;

Then ini untuk hover nye pulak. bila cursor sentuh dia jadi rupa lain pulak.

kat bawah

.post blockquote {

>>>>selepas tanda }

.post blockquote:hover {border:
4px solid #000000;
background: url(URLBACKGROUND2) repeat;
-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg); }

*URLBACKGROUND gantikan url background yang korang suka. bole dapat kan di sini..

*Yang warna merah tu untuk korang punya border luar tu..pilih warna kat cnie

ok???leh la preview dlu....kmudian..klu xde masalah...trus jer save erk....:)

Kredit to...Ieyza Afieyna

p/s: kalu sudi..sila la klik Button Donate eh..xpun Klik kat SINI jer...

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Centerkan Post Title Dan Sidebar

Salam sume....

Haih...arini nak share agi psal tutorial nak center-kan post title..and sidebar

atau dlam bhase melayunye nak kasi kite pnye tajuk post bio cantek ajer kat tengah2 kotak...

1. Sign in Blogspot > Design > Edit Html

2. Cari code di bawah , Ctrl F dan paste dalam kotak find..enter!

Untuk tajuk entry

.post h3 {

kalau tak jumpa code di atas, cari ini :

h3.post-title {

masih tak jumpa cari ini :

.post-title {

masih tak jumpa, tak jadi?

h3.post-title, .comments h4 {

korang copy dan paste je code ini DIBAWAH code yang dicari tadi.

text-align: center;

Preview, kalau menjadi SAVE jer..

Untuk Tajuk Sidebar

1. Cari code di bawah , Ctrl F dan paste dalam kotak find..enter!

h2 {

masih tak jumpa? atau dah jumpa tapi tak menjadi. Cari ini :

.sidebar h2 {

kalau tak jumpa juga, carilah code yang seakan-akan h2 {

Copy code di bawah dan paste DIBAWAH code yang dicari tadi.

text-align:center;

2. Preview, kalau menjadi SAVE jer..

Kredit to---->>> Cik Farah

p/s: kalu sudi..sila la klik Button Donate eh..xpun Klil kat SINI jer...

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Cara Nak Wat Border Dekat Sidebar

Salam sume....

kali neh Cik Permata nak sambung tutorial Cara Nak Wat Border Dekat Sidebar..

Step 1

DASHBOARD > DESIGN>EDIT HTML>tick kotak EXPAND WIDGET TEMPLATES

Step 2

Cari code ini (ctrl+F)

.sidebar .widget{

Step 3

Copy code dibawah ini dan letak SELEPAS .sidebar .widget{

text-align: center;

background:#fff;

border:4px solid #FCDFFF;

margin:0 -5px 1.5em -5px;

padding:0px 7px 10px 7px

}

Kalau korang tak jumpa code .sidebar .widget{

korang copy code yang kat bawah ni

dan letak kan di

DASHBOARD > DESIGN>TEMPLATE DESIGNER >ADVANCED> ADD CSS

.sidebar .widget{

text-align: center;

background:#fff;

border:4px solid #FCDFFF;

margin:0 -5px 1.5em -5px;

padding:0px 7px 10px 7px

}

Step 4

Untuk ubah jenis border dekat sini

4px solid #FCDFFF;

Cik Permata dah senaraikan 9 jenis border yang korang boleh guna..

Korang try and error je laa ok..

solid

double

groove

dotted

dashed

inset

outset

ridge

hidden

*untuk tukar warna korang boleh refer kat >>>.HTML color code

Jadi selamat mencube yer sume!!!!!

Kredit to Kerana Manisnye Epal

p/s: kalu sudi..sila la klik Button Donate eh..xpun Klil kat SINI jer...

♥♥Suke Entry neh?Komen Byk2 Dan Klik Button Donate Yer!!♥♥

Pages

Jom Tukar2 Link

Baca Nie Jugak!!!!

Kotak Kod Banner Kat Sidebar or Exchange BAnner

Tajuk Blog Bergerak kat Menu Tab

Tutorial double underline

Hover Blockquote (Cute Icon Muncul Bila Cursor Meyentuh)

Ayat Bawah Post Entry Berwarna

Letak Copyright bergambar kat Blog

Cubaan Doodle Cik Permata

Jangan main2 dengan 20 sen...

Round Hover With Shadow

Cara Guna Blockquote Pada Post

Border di Post Body

Bentuk-Bentuk Border

Scroll box pada bloglist

Cute Cursor kat blog

Pasang Donate Button bawah post

Pasang button like dan send Facebook di setiap entri blog

Icon Comel di Blog Archive

Slide float Shoutbox with cute Frame and icon

Centerkan header

Cantekkan Blockquote and Hover Blockquote

Centerkan Post Title Dan Sidebar

Cara Nak Wat Border Dekat Sidebar

LinkWithin