icon tepi post title

Annyeonghaseyo..

salam blogger

julia x nak banyak cakap

jom mulakan..

hari ni tutor senang je ..ok

1.log in-->dashboard-->design-->editHTML-->tick expand widget

2.seacrh kod dibawah ni:

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

3.apa yg perlu korang buat adalah,korang tambahkan kod kat bawah:

<img src="URL Gambar"/>

4.letak mana?letakkan kod tersebut macam ni:

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

5.yg julia highlightkan adalah kedudukan kod yg perlu ditambahkan>>>

6.url gambar tuh,korang masukkan url gambar kesukaan korang>>

  

Ambil kat sini>>>

border post title hover style 3

Annyeonghaseyo...

salam blogger

ok,hari ni julia nak ajar buat tutor

korang nampakkan tajuk kat atas tuh,ok..kalau dah faham

jom mulakan,kalau x tahu tengok gambar kat bawah ni:

sebelum

selepas

1.login-->dashboard-->design-->editHTML-->tick expand widget


2.seacrh kod kat bawah ni:
untuk..


simple template>>

h3.post-title, .comments h4 { 

atau 

h3.post-title {

or 

h3.post-title, h4 {

denim template>>

.post-title { 

minima template>> 

.post h3 {

4.copy kod kat bawah ni dan pastekan kat BAWAH kod korang cari tadi:

padding:2px;margin:1.5em 0 .75em;background: #FFFFFF;border-top: 3px dotted#000000;border-bottom: 3px dotted #000000;border-left: 3px solid #000000;border-right: 3px solid #000000;-moz-border-radius: 25px 10px / 10px 25px;border-radius: 25px 10px / 10px 25px;text-align:center;} .post-title:hover {padding:2px;margin:1.5em 0 .75em;-moz-border-radius: 1em 4em 1em 4em;border-radius: 1em 4em 1em 4em;text-align:center;background: #FFFFFF;border-left: 3px solid #000000;border-right: 3px solid #000000;background-image:url(URL ICON COMEY LOTE);background-position:bottom right;background-repeat:no-repeat;}

5.study>>


warna merah:kod warna background korang
warna kuning:ketebalan border korang
warna hijau :jenis border>dashed>solid>dotted
warna biru laut:kpod warna border korang
warna biru:kekalkan pon boleh
warna pink:url icon comel korang>>GLITTER GRAPHICS


6.da puas hati,very confident x de error atau x menjadi>SAVE!kalau nak selamat PREVIEW dulu>>


GOOD LUCK ^_^

border post title 2

Annyeong...

hari ni julia nak bagi tutor border jugak pasal post title

kalau korang dah faham..tutor hari ni ,ok..

yg belum,kita buat tutor ni..ni pasal post title jugak

jom mulakan...

1.log in-->dashboard-->design-->editHTML-->tick expand widget

2.seacrh kod kat bawah ni

untuk....

simple template

h3.post-title, .comments h4 { 

atau

h3.post-title {

atau 

h3.post-title, h4 {

denim template 

.post-title {

minima template 

.post h3 {

3.da jumpa,copy kod dibawah ni danpastekan kat BAWAH kod korang cari tadi..

 ada background

text-align:right;background-image:url(URL BACKGROUND);border-bottom: 2pxdashed #000000;margin:1em;font:normal 12px Century Gothic;color: #000000;}

x nak background 

text-align:right;border-bottom: 2px dashed #000000;margin:1em;font:normal 12pxCentury Gothic;color: #000000;}

4.petunjuk:

warna hijau:kedudukan post title korang,boleh adjust kedudukannya
warna biru:masukkan url gambar korang
warna kuning:ketebalan border,adjust sikit
warna pink:jenis border korang boleh tukar
warna merah:korang tukar saiz font,jenis font dan warna font
warna biru laut:kod warna border korang. 



5.sudah puas hati>lepas tu>SAVE

border post title 1

Annyeonghaseyo...

Yoo!

how are you there?hoho

oklah,julia nak bago korang tutor sebenarnya hari ini

nak tau ape die? 

hurmm..julia nak buat blog korang kemaslah..letak border pada post title korang

agar nampak neat..

jom mulakan..

1.log in-->dashboard-->design-->editHTML-->tick expand widget

2.search kod di bawah ni:

                                                       Simple template

h3.post-title, .comments h4 { 

                                                 kalau x jumpa,search yang ni:

 h3.post-title {

                                              kalau masih x jumpa,seacrh yang ni:

 h3.post-title, h4 {

denim template 

.post-title {

minima template 

.post h3 {

 3.copy kod dibawah ni dan pastekannya kat BAWAH kod yg korang cari tadi tuh:

margin: 10px;padding: 6px;font-size: 18px;font-color: #000000;text-align:right;background-image: url(URL BACKGROUND);border-top: 1px dashed #000000;border-bottom: 1px dashed #000000;border-right: 6px solid #000000;border-left: 6px solid #000000;text-shadow: 2px 1px 2px #FFFFFF;}

4.petunjuk:

warna coklat:korang adjust sikit size border korang
warna biru laut:adjust saiz font korang
warna kuning:warna font korang,ambil kod nya dekat HTML COLOR
warna purple:boleh tukar kedudukan post title sama ada >left>right>centre 
warna biru:masukkan url gambar korang
warna pink:jenis border korang
warna merah:kod warna border korang
warna hijau:shadow text color code.


5.da siap dan confident?>SAVE!!woohoo!

blockquote hover new

Annyeong...

annyeong haseyo

hari ni lagi julia nak teach tutor blockquote style baru

jenis hover punya,...

1.log in-->dashboard-->edithtml.


2.search kod ni:

.post blockquote {

3.copy kod ni dan pastekan kat BAWAH kod no.2 tadi:

.post blockquote {background:#FFC6C6;-webkit-transition-duration: 3s;padding: 12px;margin: 2px 2px;color: #ffffff;-webkit-border-radius: 10px;-moz-border-radius: 10px;}.post blockquote:hover {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcDdrXK-AJIA-mBCoK2K_Zj7NHAgGjb3ZZy9b88QEmImhgiQAa30tXDrUjjfZTb2mFHIrUn83gWI4FNO9C0QFbDA-sXCRGb7pC9GwOv8Bpvku94TwN12khZCveYcjLYnFjQVXffB6TW36v/s1600/pinkgrain.png);color: #000000;-webkit-transition: 3s;}

4.yang warna purple tuh,korang masukkan kod warna sebelum dihover
   
  yang warna merah tu,korang masukkan url gambar background setelah dihover


  URL background AMBIL DISINI

blockquote style 4

Annyeinghaseyo...

salam blogger

tutor hari ni ialah blockquote style 4

x tau,jomikut je step kat bawah ni

1.log in-->dashboard-->design-->editHTML

2.search kod ni:

.post blockquote {

3.copy kod kat bawah ni dan pastekan kat BAWAH kod tadi>>

background-image:url(URL IMAGE);JENIS BORDER (Kalau nak)border-left: 10px solid #ff708c;padding:5px;{

4. jom study:
warna biru:masukkan url image korang
warna kuning:kalau nak border tambahkan kat kurungan tuh,jenis border korang/kalau x nak buang je kod tuh
warna purple:tukar kedudukan border,ketebalan die dan kod warna border korang tuh
warna merah:jenis border korang


5.siap >SAVE

editing blockquote

Annyeong...

Salam buat semua

julia hari ni nak ajar korang 

the way of how to use blockquote

julia ade bagi banayk blockquote tapi

mesti ada dikalangnya x tahu cara menggunakanya

meh,julia ajarin!

1.log in-->dashboard-->design-->posting-->new post/edit post

2.korang tulis je apax2 yg nak diblockquotekan

3.kemudian ayat yg nak diblockquote tuh korang hihglightkan dulu>>>

4.kalau korang perasan!!nampak x kat atas box tulis korang tuh ade tulisan camni(")

ala-ala macam tulah,kalau x faham tengok kat bawah ni:

rotate blockquote

Annyeong....

Ayeee!

julia x nak banyak kata dan bicara

korang dah tahukan apa julia nak teach hari ni?

pasal blockquote rotate apabila kita halakan cursor

berkaitan dengan hover jugak!

1.log in-->dashboard-->design-->editHTML-->tick expand widget

2.search kod ni:cam biase:

.post blockquote {

3.korang copy kod dibawah ni dan pastekan kat BAWAH kod tadi dinombor 2

background: #FFFFFF;
border: 3px dotted #000000;
padding: 7px;
}

4.ok,dah pastekan,korang cari kod ni pulak,TAPI kalau x jumpa ,korang pastekan je kod kat bawah ni kat BAWAH kod dinombor 3:

.post blockquote.hover {

5.ok,sekarang,korang copy kod ni pulak dan pastekanya kat BAWAH kod tadi

background: url(URL BACKGROUND);
-webkit-border-radius: 36px 12px;-moz-border-radius: 36px / 12px;-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
}

jom study:
warna pink:masukkan kod warna korang
warna hijau:ketebalan border
warna kuning:jenis border:boleh tukar ikut citarasa korang

solid

dashed

dotted

warna merah:masukkan url image
warna purple:border die:boleh tukar
warna biru:kesengetan blockquote apabila dihover>>boleh adjust darjah die!!

**kalau x de masalah,atau error,boleh terus <<<SAVE>>>

blockquote style 3

Annyeong...

Annyoung haseyo!

hahah,korean lah kononnya!

oklah,hari ini julia nak teach korang blockquote style 3 pulak

jom ikut step dibawah ni:

1.log in-->dashboard-->design-->editHTML

2.search kod dibawah ni :

.post blockquote {

3.alright then,now you copy these code and pastekan kat BAWAH kod tadi:

background:url(URL BACKGROUND);
border-left: 4px solid #000000;
border-right: 4px solid #000000;
-webkit-transition-duration: 0.5s;
}
.post blockquote:hover {
background: url(URL BACKGROUND);
border-left: 4px solid #000000;
border-right: 4px solid #000000;
-webkit-border-radius: 36px 12px;
-moz-border-radius: 36px / 12px;
-webkit-transform: skew(-1.deg,-1.5deg);
-webkit-transition: 0.5s;
}

4.ok,boleh ikut,now mari sini julia bagi sign !!

warna merah:masukkan url image,sebelum dan selepas dihoverkan
warna biru:masukkan kod warna bagi border korang
bold text:boleh tukar jenis border:

solid

dashed

dotted


5.da puas segalanya,>SAVE!

blacquote style 2

Annyeonghaseyo...

Salam buat blogger

dan pengunjung blogger

julia hari ni teach korang buat blockquote lain..style kedua

korang nampak x,blockquotenya berubah

bila dihalakn cursor,macam sekarang yg

julia gunakan!

1.log in-->dashboard-->design-->editHTML-->tick expand widget

2.seacrh kod ni:

.post blockquote {

3.da jumpa?korang copy kod dibawah ni dan pastekan kat BAWAH kod yg korang cari tadi tuh..:

background-image: url(URL BACKGROUND);border:1px solid #000000;border-left:10pt double #000000;padding: 3px;border-bottom-left-radius: 10px;border-top-left-radius: 10px;}.post blockquote:hover {background-url(URL BACKGROUND);-webkit-transition-duration: 2.5s;background-image:url(URL ICON LIP-LAP);background-position:bottom right;background-repeat:no-repeat;border:1px dashed #000000;border-right:10pt double#000000;}

4.jom belajar dengan kak julia:
warna biru:masukkan url image korang
warna merah:masukkan kod warna bagi border korang
warna kuning:masukkan url icon lip-lap apabila cursor dihalakan(dihover)

CODE URL ICON LIP-LAP


5.kalau korang dah puas hati,boleh terus SAVE!
kalau takut error ,PREVIEW dulu

blockquote style 1

Annyeonghaseyo...

Assalamualiakum

oklah,julia x nak cerita panjang

julia hari ni nak ajar korang buat blockquote style 1

julia pon x tahu ape die,tapi die blockquote jugak,

jadi korang ikut step dibawah ni:

1.log in-->dashboard-->design-->editHTML-->tick expand widget

2.search kod ni:

.post blockquote {

3.bagi yg x nak ade background,kod dia disini:

background-image: #FFFFFF;
border-top: 2px dashed #000000;
border-left: 4px solid #000000;
border-right: 2px dashed #000000;
border-bottom: 2px dashed #000000;
margin:1em 20px;
}

4.kalau korang nak yg ade background,ni kodnya:

background-image: url(URL IMAGE);
border-top: 2px dashed #000000;
border-left: 4px solid #000000;
border-right: 2px dashed #000000;
border-bottom: 2px dashed #000000;
margin:1em 20px;
}

5.ok,korang copy kod mana-mana korang nak dan pastekanya kat BAWAH kod yg korang cari tadi.


6.mari belajar:

warna biru:adjust ketebalan border korang
warna hijau:jenis border
a.solid

b.dashed

c.dotted

warna pink:kod warna korang untuk background
warna merah:url image korang
warna kuning:kod warna korang untuk border blockquote korang.


7.kalau korang dah puas hati,korang PREVIEW dulu ,x de error,barulah SAVE


sudah selesai blockquote korang yg cantik!

blockquote lip lap

Annyeong...

Salam blogger buat semua

hari ini julia nak ajar tutor blockquote baru

blockquote ni baru punyer

jenis blockquote lip-lap

kalau nak tahu ape bende tuh,

maih ikut ste dibawah ni:

1.log in-->dashboard-->design-->editHTML-->tick expand widget

2.search kod dibawah ni:

.post blockquote {

3.okey,dah jumpa!korang oergi delete kod blockquote yg selama ni korang guna dengan kod yg baru ni:

background-color: #F2F2F2;border:1px solid #FA58F4;padding: 5px;}.post blockquote:hover {background-image:url(URL LIPLAP-LIPLAP);background-position:bottom right;background-repeat:no-repeat;}

4.kalau korang nak yg effect yg bergerak punyer,cume tambahkan kod ni:

-webkit-transition: 1s;}

5.nak letak mane?korang letakkan kat bawah :

background-repeat:no-repeat; .

6.jom belajar:

warna hijau:korang ubah ketebalan border
warna pink:korang tukar jenis border
contihnye:

a.dashed

b.dotted

c.solid

warna merah:korang tukar dengan kod warna korang
warna biru:masukkan (url lip-lap)

URL LIP-LAP


7.kalau dah puas hati>SAVE!

buat header

Annyeong...

tutor hari ini julia nak ajar ialah cara membuat header yang comel lote~

ikut citarasa korang~panjang tajuk julia...ok.ini direquest oleh adik Anis lagi;)

mula-mula sekali`korang kena jalani proses download mendownload dulu..

first korang download file lukis-melukis~

-->PHOTOSCAPE

lepas itu~download file ini~sebagai modified header korang yang korang create guna photoscape~

-->GIMP DOWNLOAD

CARA MENGGUNA PHOTOSCAPE>>

1.pilih yang dibulatkan "editor" saat membuka photoscape!

2.setelah masuk editor ,ikut step diatas..belajar dibawah:rujuk gamabr di atas

• step1-pilih menu dan pilih new photo ,tentukan saiz gambar yang korang nak!
• step2-pilih object pada menu bawah diatas dan pilih gambar "image"
• step3-pilih huruf "T" kalau nak tulis sesuatu pada gambar!kalau nak^_^
• step4-kalau dah confirm cantik,pilih save pada tab menu hujung itu..dan tuliskan tajuk gambar korang..

UNTUK LATIHAN GIMP DOWNLOAD~>>

1.first~masuk ke file GIMP ,then pilih file seperti diatas..

  pilih open untuk membuka image yang korang nak modified..

2.apabila korang buka open,ia akan kelaman seperti ini~pilih file dimana lokasi image korang.

3.a.setelah pilih gambar~,pilih pada kotak yang di bulatkan merah itu~pilih no 3 tu je tau(fuzzy select tools)

3.b.setelah itu pergi ke layer diatas..no.4,pilih transparency-->add alpha channel

3.c.setelah itu,terus pada gambar pilihan,dan tekan pada latar belakang gambar itu ,sejurus itu ,tekan DELETE(DEL) pada papan kekunci korang~setelah itu jadi seperti ini:

**Ia akan seperti ini~

kembali pada tadi:

3.d.setelah selesai,pilih file dan pilih save as>>tulis pada nama tajuk gambar korang ikut format dibawah:

• **contoh= namagambarkorang.png

4.yang di hitamkan itu penting kena tulis~seperti diatas!namagambarkorang~letak nama image korang..

5.setelah itu~YEAHH!!sudah siap!!da confirmkan nama image~tekan enter lepas tu boleh tutup file GIMP..