Tuesday, August 9, 2011

Tutorial 89 : Gambar di Footer Blog.

Footer aku, jangan cil0k sebab copyright!



Assalamualaikum..
Sorry sebab terlepas pandang untuk buat tutorial ni.
Banyak ooo permintaan tutorial yang tak tertunai. Jadi sabar. Simple mimple boleh didahulukan, yang berat-berat kena datang mood. Sebenarnya sebelum aku create tutorial, aku akan testing tutorial itu terlebih dahulu dalam blog testing aku. Kalau menjadi aku akan buat. Tapi kalau tak menjadi aku tak buat dan kena eksperimen lagi. Take a time jugak ye darling semua. Mana boleh tulis tutorial tanpa testing macam melepaskan batuk di tangga je kan.. Kalau serius nak buat tutorial kenala ada komitmen, bukan nak kejar traffic semata-mata. Aku buat tutorial untuk share ilmu. Ingat tu pada sesiapa yang saja-saja buat tutorial.

Ada 2 cara nak letak gambar di footer blog. Korang pilih mana yang sesuai dengan jiwa korang.



CARA 1 : Meletakkan Gambar di Footer ( Add Gadget )

1. Sign in blogger > Design > Page Elements

2. Click Add a Gadget iaitu pada bahagian bawah sekali, seperti gambar di bawah


3. Korang kena pilih Picture, seperti gambar di bawah:


4. Browse gambar yang korang berkenan untuk letak di footer.



#kalau nak gambar tu fix dan sekata jangan lupa tick shrink to fit

5. Save dan tengoklah hasilnya.





CARA 2: Meletakkan Gambar di Footer ( Coding )

Cara ini maybe sukar sikit berbanding dengan cara di atas kerana perlu coding dan main code html. Jadi jom cuba! ( minima, denim template is ok tapi template designer aku tak cuba )

1. Sign in blogger > Design > Edit HTML >

2. Cari code ini :

#footer {
3. Korang akan jumpa code macam ni (kalau tak sama, lebih kurang macam gini ):

#footer {
  width:900px;
  clear:both;
  margin:0 auto;
  padding-top:15px;
  line-height: 1.6em;
  text-transform:uppercase;
  letter-spacing:.1em;
  text-align: center;
}
Tengok gambar untuk lebih faham

Replace/Gantikan dengan code ini :

#footer {
width:900px;
height:300px;
background-image:url(url GAMBAR);background-position: bottom center;
clear:both;
margin:0 auto;
padding-top:0px;
line-height: 1.6em;
text-transform:uppercase;
letter-spacing:-1px;
text-align: center;
}
4. Tukar :

width: 900 kena ikut width/lebar yang sedia ada dalam blog korang ( tak payah ubah, maksudnya kalau width korang 800 still tulis 800 juga. Ikut blog masing2 )
height:300 kena ikut panjang gambar korang. Pastikan korang tahu berapa saiz height korang. Kalau tak cacatlah template korang.
Tukar juga url GAMBAR dengan url gambar korang. Nak senang create photobucket dan ambil direct link.


5. Preview dan SAVE kalau menjadi.


p/s : Apa lagi tekan la nuffnang aku tanpa henti! hahaha..ok like je kalau suka.

18 comments:

  1. huhu tq kak farah akhir nye wat jgak
    nty adk nk cube

    ReplyDelete
  2. wah! jadi jugak akhirnya.. kalau letak footer guna code tu mmg susah tp klw upload sng. thansk for the tuto! :)

    ReplyDelete
  3. hemm x leh la kak farah
    sbb saye guna design temp kot

    ReplyDelete
  4. kak! mcm mne nak.....wt mcm akak pnyer...yg kt about me...yg ade icon comel tuh....faham ta?

    hope fhm... :)

    ReplyDelete
  5. @nysa 0h nysa

    tgk sini dear

    http://bicarafarah.blogspot.com/2011/08/tutorial-93-cute-profile.html

    ReplyDelete
  6. kak saya pnya x leh transparent kn...

    ReplyDelete
  7. macam mana nak letak logo untuk payment? macam nak letak logo maybank, cimb semelah utk payment methods..tapi nak letak dekat kiri blog...yg kat tepi2 tu

    ReplyDelete
  8. Boleh tak akak sendiri yang tolong buatkan untuk naja :) naja tak faham la..

    ReplyDelete
  9. akak,,nie soalan penting lg rumit..camne nak decorate blog jd cantik mcm akak punya?siap ada riben n gambar kartun apa cmua! mmg cantik sgt tp x taw cara nak bt..hrp akak dpt bantu ekk..? :)

    ReplyDelete
  10. Terima kasih kakak..sye akn ikut.follow la blog sye

    http://amirasyafiqah98.blogspot.com/

    ReplyDelete
  11. thanks akak menjadi guna cara 1

    ReplyDelete
  12. Akak.... Saya dah buat tapi saya remove balik sebab saya salah tekan gambar. Pastu saya tengok die tak padam pun. Tolong, macam mana nak buat ni? Huhu. Saya guna add gadget, tak guna HTML code :)
    Ni blog saya: http://nnakhairudin.blogspot.com
    Tolong ye...

    ReplyDelete
  13. wah bagus banget karyanya, ak masih belajar dan masih kayak gini

    ReplyDelete

-Assalamualaikum, sila tinggalkan komen anda.
-Kalau suka tekan LIKE.
-Insyaallah komen anda akan dilayan :)

Terima kasih lepak sini, nanti datang lagi yer..
Sayang Korang...





Related Posts Plugin for WordPress, Blogger...
 
Copyright © 2016 Blog Cik Nurfarah. All Rights Reserved. Designed by Blog Cik Nurfarah.