Jul 11, 2010

Modify Template Blog dgn Template Designer


Blogger Template Designer adalah adalah satu fungsi baru diperkenalkan untuk anda mengurus rekabentuk blog sendiri. Kita boleh memilih satu dari pelbagai template yang disediakan, memilih imej, warna-warna dan struktur kolom yang sesuai dengan kehendak sendiri.

1. Log masuk ke dalam Blogger melalui Blogger in Draft.

2. Dalam papan pemuka Blogger pilih Design bagi blog yang akan dipinda:


3. Dalam muka berikutnya bawah Design klik Template Designer:



muka panel kawalan Blogger Template Designer

4. Bahagian Templates dalam muka panel kawalan Blogger Template Designer. Jika template yang digunakan sekarang boleh dibaca oleh Blogger ianya akan ditunjukkan dalam Live on Blog dan di bahagian bawahnya. Jika tidak boleh dibaca bahagian ini akan dibiarkan kosong:



4.1 Ada enam (6) plihan template yang disediakan dalam bahgaian ini, sila klik untuk pilih satu yang disukai:

  • Simple
  • Picture Window
  • Aewsome Inc
  • Watermark
  • Ethreal
  • Travel

4.2 Kemudian setiap satu pilihan template yang dibuat dibawahnya ada sub pilihan untuk template yang sama seperti dalam contoh di atas. Klik pilih satu:

4.3 Selepas selesai pilih klik APPLY TO BLOG

4.4 Klik View Blog untuk melihat contoh template.

5. Pilihan bahagian Background adalah ruangan untuk memilih warna latar belakang atau memilih antara imej yang disediakan bagi template blog:


5.1 Klik Background Image untuk memilih imej latarbelakang blog dari pelbagai pilihan yang disediakan. Dalam tetingkap Select Background Image yang dibuka klik setiap satu ketegori sebelah kiri untuk milihat contoh imej yang dipamirkan. Kemudian pilih satu yang disukai. Klik DONE selepas buat pilihan:


5.2 Warna latar belakang blog boleh dipinda di bawah pilihan Main color theme atau dalam pilihan Suggested color themes.

5.3 Selepas pilihan dan pindaan warna latar belakang blog dibuat klik APPLY TO BLOG.

5.4 Klik Use default background and colors untuk batalkan semua pilihan yang telah dibuat untuk kembali kepada set asal.

5.5 KlikView Blog untuk melihat pindaan yang telah dibuat.

6. Bahgaian Layout. Ada tiga (3) sub-pilihan di bawah Layout iaitu pilihan Body Layout, pilihan Footer Layour dan pilihan Adjust Width:

6.1 Body Layout:


6.1.1 klik salah satu Layout dari pilihan yang disediakan untuk struktur Header, Body Post dan Sidebar.

6.1.2 selepas pilih satu klik APPLY TO BLOG.

6.1.3 klik View Blog untuk lihat contoh blog.

6.2 Footer layout pilih satu footer layout dalam pilihan yang diberi:


6.2.1 klik salah satu Footer Layout dari tiga pilihan yang disediakan.

6.2.2 selepas pilih satu klik APPLY TO BLOG.

6.2.3 klik View Blog untuk lihat contoh blog.

6.3 Adjust width:


6.3.1 alihkan arrow ukuran untuk menentukan ukuran bagi sidebar kiri, body post dan sidebar kanan blog.

6.3.2 selepas pilih ukuran klik APPLY TO BLOG.

6.3.3 klik Reset widths to template default untuk batalkan pindaan dan pilihan yang dibuat untuk kembali ke set asal sebelumnya.

6.3.4 klik View Blog untuk lihat contoh blog.

7. Advance. sub-pilihan di bawah Advance adalah:

  • Page Text
  • Backgrounds
  • Links
  • Blog Title
  • Tabs Text
  • Tabs background
  • Date Header
  • Post
  • Post Footer
  • Gadgets
  • Footer
  • Footer Links
  • Add CSS

7.1 Page Text:


7.1.1 pilih jenis tulisan dalam ruangan font;

7.1.2 di bawahnya pilih saiz tulisan ("B" untuk tulisan bold, "I" untuk tulisan italic;

7.1.3 pilih warna tulisan dalam ruangan Text Color, atau pilih dari dalam palet warna Colors from this template atau pilih dalam Suggested colors;

7.1.4 lepas selesai pilihan klik APPLY TO BLOG;

7.1.5 klik Clear advanced changes to page text untuk batalkan semua pilihan dan kembali ke set asal sebelumnya;

7.1.6 klik View Blog untuk pratonton;

7.2 Backgrounds:


7.2.1 Outer Background untuk pilih warna latar dibelakang Header, Body Post dan Sidebar. Boleh juga pilih warna dari dalam Colors from this template atau dalam Suggested colors;

7.2.2 Header Background untuk pilih warna latar bagi header blog. Boleh juga pilih warna dari dari dalam Colors from this template atau dalam Suggested colors;

7.2.3 Post Background untuk pilih warna latar bagi body post blog. Boleh juga pilih warna dari dari dalam Colors from this template atau dalam Suggested colors;

7.2.4 selepas pilih warna klik APPLY TO BLOG;

7.2.5 klik Clear advanced changes to background untuk batalkan semua pilihan dan kembali ke set asal sebelumnya;

7.2.6 klik View Blog untuk lihat contoh blog;

7.3 Links:


7.3.1 Link Color untuk pilih warna tulisan dalam semua pautan atau capaian yang terdapat dalam blog. Boleh juga pilih warna tulisan dari dalam Colors from this template atau dalam Suggested colors;

7.3.2 Visited Color untuk pilih warna tulisan bagi pautan atau capaian yang telah diklik dan telah dilawati. Boleh juga pilih warna dari dari dalam Colors from this template atau dalam Suggested colors;

7.3.3 Hover Color untuk pilih warna tulisan bagi pautan atau capaian yang diletak mouse cursur diatasnya. Bila mouse cursor diletak diatas pautan warnanya bertukar mengikut warana yang dipilih dalam bahgian ini. Boleh juga pilih warna dari dari dalam Colors from this template atau dalam Suggested colors;

7.3.4 selepas pilih warna klik APPLY TO BLOG;

7.3.5 klik Clear advanced changes to background untuk batalkan semua pilihan dan kembali ke set asal sebelumnya;

7.3.6 klik View Blog untuk lihat contoh blog;

7.4 Blog Title:


7.4.1 pilih jenis tulisan tajuk blog dalam ruangan font;

7.4.2 di bawahnya pilih saiz tulisan tajuk blog ("B" untuk tulisan bold, "I" untuk tulisan italic;

7.4.3 pilih warna tulisan tajuk blog dalam ruangan Text Color, atau pilih dari dalam palet warna Colors from this template atau pilih dalam Suggested colors;

7.4.4 lepas selesai pilihan klik APPLY TO BLOG;

7.4.5 klik Clear advanced changes to blog title untuk batalkan semua pilihan dan kembali ke set asal sebelumnya;

7.4.6 klik View Blog untuk pratonton;

7.5 Tabs Text:


7.5.1 pilih jenis tulisan untuk tab dalam ruangan font;

7.5.2 di bawahnya pilih saiz tulisan ("B" untuk tulisan bold, "I" untuk tulisan italic;

7.5.3 pilih warna tulisan tab dalam ruangan Text Color, atau pilih dari dalam palet warna Colors from this template atau pilih dalam Suggested colors;

7.5.4 pilih warna tulisan tab (tab yang diklik untuk dipilih) dalam ruangan Selected Color, atau pilih dari dalam palet warna Colors from this template atau pilih dalam Suggested colors;

7.5.5 selepas pilih klik APPLY TO BLOG;

7.5.6 klik Clear advanced changes to tabs text untuk batalkan semua pilihan yang telah dibuat dan kembali ke pilihan set asal;

7.5.7 klik View Blog untuk pratonton;

7.6 Tabs background:


7.6.1 Background Color untuk pilih warna tulisan latarbelakang tab;

7.6.2 Selected Color untuk pilih warna latarbelakang tab ketika diklik untuk dipilih;

7.6.3 Separator Color untuk pilih warna latarbelakang garis pemisah (separator) tab;

7.6.4 selepas pilih warna klik APPLY TO BLOG;

7.6.5 klik Clear advanced changes to tabs background untuk batalkan semua pilihan dan kembali ke set asal sebelumnya;

7.6.6 klik View Blog untuk lihat contoh blog;

7.7 Date Header:


7.7.1 pilih jenis tulisan untuk tarikh pos (date header) dalam ruangan Font;

7.7.2 di bawahnya pilih saiz tulisan untuk tarikh pos ("B" untuk tulisan bold, "I" untuk tulisan italic;

7.7.3 pilih warna tulisan tarikh pos dalam ruangan Text color atau pilih dari dalam palet warna Colors from this template atau dalam palet warna Suggested colors;

7.7.4 selepas pilih klik APPLY TO BLOG;

7.7.5 klik Clear advanced changes to date header untuk batalkan pilihan yang telah dibuat dan kembali ke set asal sebelumnya;

7.7.6 klik View Blog untuk pratonton;

7.8 Post:


7.8.1 Title Font pilih jenis tulisan tajuk pos blog;

7.8.2 di bawahnya pilih saiz tulisan pos blog ("B" untuk tulisan bold, "I" untuk tulisan italic);

7.8.3 Footer Text Color untuk pilih warna tulisan bagi post footer. Boleh pilih warna tulisan dari dalam Colors from this template atau dalam Suggested colors;

7.8.4 Border color untuk pilih warna border pos blog. Boleh juga pilih dari dalam Colors from this template atau dalam Suggested colors;

7.8.5 selepas pilih klik APPLY TO BLOG;

7.8.6 klik Clear advanced changes to post untuk batalkan pilihan yang telah dibuat dan kembali ke set asal sebelumnya;

7.8.7 klik View Blog untuk pratonton;

7.9 Post Footer:


7.9.1 pilih warna tulisan untuk post footer dalam ruangan Text color atau pilih dari dalam Colors from this template atau dalam Suggested colors;

7.9.2 selepas pilih warna klik APPLY TO BLOG;

7.9.3 klik Clear advanced changes to post footer untuk batalkan pilihan yang telah dibuat dan kembali ke set asal sebelumnya;

7.9.4 klik View Blog untuk pratonton;

7.10 Gadgets:


7.10.1 pilih jenis tulisan untuk tajuk gadget dalam ruangan Font;

7.10.2 di bawahnya pilih saiz tulisan tajuk gadget ("B" untuk tulisan bold, "I" untuk tulisan italic);

7.10.3 pilih warna tulisan tajuk gadget dalam ruangan Title color atau pilih dari dalam Colors from this template atau dalam Suggested colors;

7.10.4 pilih warna alternate tajuk gadget dalam ruangan Alternate color atau pilih dari dalam Colors from this template atau dalam Suggested colors;

7.10.5 selepas pilih klik APPLY TO BLOG;

7.10.6 klik Clear advanced changes to gadgets untuk batalkan pilihan yang telah dibuat dan kembali ke set asal sebelumnya;

7.10.7 klik View Blog untuk pratonton;

7.11 Footer:


7.11.1 taip kod hexadecimal warna atau pilih warna tulisan untuk footer blog dalam ruangan Text color atau pilih warna dari dalam Colors from this template atau dalam palet warna Suggested colors;

7.11.2 taip kod hexadecimal warna atau pilih warna lain tajuk gadget untuk footer blog dalam ruangan Gadget Title color atau pilih dari dalam palet warna Colors from this template atau dalam palet warna Suggested colors;

7.11.3 selepas pilih klik APPLY TO BLOG;

7.11.4 klik Clear advanced changes to footer untuk batalkan pilihan yang telah dibuat dan kembali ke set asal sebelumnya;

7.11.5 klik View Blog untuk pratonton;

7.12 Footer Links:


7.12.1 taip kod hexadecimal warna atau pilih warna tulisan pautan footer blog dalam ruangan Link color atau pilih dari dalam palet warna Colors from this template atau dalam palet warna Suggested colors;

7.12.2 taip kod hexadecimal warna atau pilih warna pautan footer yang telah diklik dan dilawati dalam ruangan Visited color atau pilih dari dalam palet warna Colors from this template atau dalam palet warna Suggested colors;

7.12.3 Hover bermaksud warna pada pautan footer blog bila mouse cursor diletak diatas pautan. Taip kod hexadecimal warna atau pilih warna hover dalam ruangan Hover color atau pilih dari dalam palet warna Colors from this template atau dalam palet warna Suggested colors;

7.12.4 selepas pilih klik APPLY TO BLOG;

7.12.5 klik Clear advanced changes to footer links untuk batalkan pilihan yang telah dibuat dan kembali ke set asal sebelumnya;

7.12.6 klik View Blog untuk pratonton;

7.13 Add CSS:


7.13.1 pilihan ini adalah untuk mereka yang tahu menulis kod CSS atau HTML sendiri dalam ruangan yang disediakan.


Sekian, selamat mencuba dan selamat berjaya.

Sebarang pautan balik dari blog anda adalah sangat-sangat dihargai. URL http://calipso-tutorialblogger.blogspot.com/.

Salam hormat dari

0 comments:

Post a Comment