Ubah Tajuk Sidebar kepada Bentuk Imej

ditaip Zana Mn jam 1:04 PM




Tutorial di rekues oleh Nur Solehah. Dah ramai yang minta ajar sebenarnya, tapi asyik tak sempat nak buat. So, hari ni belajar bebaik ye ;)

Ouh ade yang tak faham lagi apa fokus kita hari ni? Ini dia. Macam mana nak jadikan Gambar 1 kepada Gambar 2. Tengok anak panah tu ye.



Gambar 1


Gambar 2

Mula-mula kenala tau saiz kelebaran sidebar blog kita berapa. Tak tau nak tengok saiz? Ini caranya.

Dashboard / Layout / Edit HTML

Cari kod ini (Ctrl + F)


#sidebar-wrapper {
width: 260px;

Baik, ini bermakna saiz sidebar blog Mommy Pinky ialah 260px
Maka buat la imej bersaiz 260px. Buat lebih kecik tak pe asalkan jangan lebih. Haa, time ni guna la kepakaran korang design ye. Tak kesah la buat guna photoshop ke photoscape ke. Mommy Pinky guna dua-dua sekali Photoshop CS5 & PhotoScape. Ngeh Ngeh.Ini hasil terbaru, baru je buat tadi. Simple jek, sebab suka simple. Padahal tak reti design ngaku je la (-.-)



Macam biasa la, bila dah siap design pegi la upload pic korang tu di photobucket ke, imageshack ke untuk ambil Url Image. Tak reti? Boleh rujuk SINI ye.

Baik, cara masukkan imej

Dashboard / Layout / Edit HTML / Download Full Template
(penting sebagai backup!)


Sila tick Expand Widget Templates

Sekarang kena cari kod Tajuk Sidebar kita. Sebagai contoh yang Mommy Pinky buat, untuk tajuk Frenzz. Tekan Ctrl + F dan taip Frenzz.

*sila taip dengan sama sebijik macam tajuk yang korang buat tu. Kalau huruf besar, kena buat huruf besar la ek. Kalau tak, memang tak jumpa. Kod yang korang akan jumpa adalah seperti berikut.

<b:widget id='HTML4' locked='false' title='Frenzz' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class="title"><data:title></data:title></h2>
</b:if>

Tukar kod ini,

<h2 class="title"><data:title></data:title></h2>

dengan kod imej ini,

<img border='0' src='http://img257.imageshack.us/img257/1/frenzz.png'/>

Hasil kod seperti dibawah

<b:widget id='HTML4' locked='false' title='Frenzz' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<img border='0' src='http://img257.imageshack.us/img257/1/frenzz.png'/>
</b:if>

ini Mommy Pinky punya. Jangan ambik, nanti mommy gigit. Nak mommy buatkan? Singgit seketul >__< !!

Ok siap. Klik Peview, dah ok, bolehla Save Template





Untuk follower widget mungkin akan ada problem. Next tutorial je ok ;)
UPDATE : untuk tajuk follower di SINI











Comments
46 Comments

46 komen:

Lia Edwin on 1:28 PM said...

nak cube..nak cube...mntak mnjadi..:)

❤ Baby Yats ❤ on 1:41 PM said...

bgus la...tp tak reti nak buat...hehe

Semarak Api on 1:54 PM said...

wahhh..bole try nih.tengs 4 d sharing :)

Semarak Api on 1:55 PM said...

eh2..nk tny lg.hehe.agk2 buat cmni effect x loading time blog kite?jd mkin slow x?tenkiu MP..

LyNn HaMzAh on 1:59 PM said...

mcm rumit jer...tp kalau cuba mesti jadi kan...

Mommy Pinky on 2:02 PM said...

@Semarak Api
eh eh mesti la effect. so kenela pandai2 jgn bt gmbar berat sgt .. hoho

echa on 2:13 PM said...

mau try la....tq ya :)

L@n@ a.k.a Mak Budak on 2:57 PM said...

good info .. nnt dah boring dgn blog boleh la buat .. tq dear..

Lia Edwin on 4:09 PM said...

sy berjaya mommy...tq2..

@juera on 4:28 PM said...

wa suka suka..TQ mommy cute =)

baincardin on 4:28 PM said...

Jom layan 'Part 2' plak. ^_^

suffer8zine on 5:35 PM said...

wow sis! nice la!

Terkini : Antara 10 Jam Tangan Termahal Di Dunia | Telefon Bimbit Paling Lasak Di Dunia | 10 Gunung Tertinggi Di Dunia.

sakina deen ツ on 5:44 PM said...

mommy mommy, nak try buat laa :) Hee

Mawar Merah on 10:07 PM said...

U r so terel Jana. Blh bukak kedai design ni.. (^^)

NanaCinvent on 2:27 PM said...

salam ,i cari kod tapi tak da la mommy ?
macm mana ni ?

NurSolehah on 7:03 PM said...

wah.. thanxs mommy... :)
sowi lmbt jejak cni.,,

AnAk dEneSor on 4:12 PM said...

mommy..hukhuk..cemua da jd kecuali follower la mommy..knpe ea?

AnAk dEneSor on 4:34 PM said...

takpe mommy..thanx..da jd da..mommy byk membantu caye..thanx cecangat..ngee

arein_niera on 5:50 AM said...

untuk tajuk lain plak nk buat camne?

arein_niera on 10:49 AM said...

umm,, yang lain dah mau.. follower jer tak bleh.. camne ni?

Athirah Najaa on 8:51 PM said...

Salam , mommy tak jadi lah ?! Mommy buat tu untuk chat . Mcm mana nak buat ?

Nurul Fatihah on 9:03 PM said...

hm,bleh tlong wt kan x.
x reti la
bab x thu nk wt cm ne

Mommy Pinky on 9:07 PM said...

sape2 nak mommy pinky buatkan boleh la tgglkan email & nama & url blog ye :D

Nurul Fatihah on 12:43 PM said...

http://fatihahthought.blogspot.com/
nurul fatihah

email 2 cm ne?

Nurul Fatihah on 3:27 PM said...

nrl_fatihah@yahoo.com.my
cm ne erk?

. on 5:10 PM said...

DAH BUAT TAPI BERKENAN YANG MOMMY LAGIK.. :)

ceK. aiza on 7:08 PM said...

thanx jadi ! :D

fAiRy PrInCesS on 9:41 PM said...

kalo amik gambar dari photobucket xleh ea? dah try banyk kali tadi tapi die x kuar image tapi die kuar url lak bile preview. hehehe

Mommy Pinky on 9:47 PM said...

@fAiRy PrInCesS
boleh je, asalkan ambil direct link :)

fAiRy PrInCesS on 10:09 PM said...

oo.. ok. jap. saye try 1 skali

MiSz IeyFa on 10:21 AM said...

m0mmy b0leh x t0lng wat kn??
saya wat x retilh..
hehe~
tp,sebl0m 2..
kena byr ke??

aS KeGiLaaN on 7:45 PM said...

mommy..cm mne niey?ta taw nk edit la mende uwh..errgghh...grm niey

Hanis Zakirah on 3:40 PM said...

Mommy,code x jumpe :'(

Nyna ana ♥ on 11:07 AM said...

saya tak jumpe yg (Ctrl + F)

Cik Miera on 8:28 PM said...

thanks mommy..suka tutorial ni..hihi

Hanis Zakirah on 11:36 AM said...

setengah jadi setengah error..hehe

Caten -- on 4:01 AM said...

LIKE this mommy :)

izzaty on 12:00 AM said...

akak , tak menjadi laa :( sdeyh . i've tried many times .

nysa arzmn on 11:08 PM said...

mommy!!! thanks....nysa punya da jadi..heheh...thank you so much mommy...

Nornabilla on 9:30 AM said...

aii...salam...um..sy dah try bnyak kali dah..npe x jd erq??boleh lg watkan???

jangjangkhun on 1:49 PM said...

arggh!!! trimas sesangat ! :)

Masis Sharwin on 9:08 AM said...

Mommy! sy punya tak boleh. tak jumpa code. hope mommy boleh tlg ey. ni email, masis.blossom@gmail.com
http://masisdiarytales.blogspot.com/

cik aida on 2:41 PM said...

thanks mommy...aida dah berjaya buat..

datang la melawat ke http://sesukaida.blogspot.com..

mommy x de banner ke??? egat nak curik nak letakk kat exchange banner

nurul syafika on 9:00 AM said...

mommyy...saya x berjaya lg la...
mommy tlg buatkan ..bole x?

sieta on 5:29 PM said...

mommy, kenape tak jadi ea. boley tolong buatkan tak. da bingung da ny. hihihii.
email-nurmassitabtabdrashid95@yahoo.com
url-http://littlefinggerstalk.blogspot.com/
name-masita.
tlg buatkan ea mommy :)

ad dah on 1:12 AM said...

macam best je...hahhahaha nak cube boleh kan....

:a :b :c :e :f :g :h :i :j :k :m :n

Post a Comment

 

Copyright © 2008-2017 By Zana Mn. All rights reserved | Sign in, MP Design