Isnin, 29 Ogos 2011

Tutorial edit template blogskin (Part 1)

Hai dan Assalammualaikum.

Atas permintaan ramai #ceh, jadi saya nak ajar korang perkara asas macam mana nak edit blogskin neh.Kalau korang faham code kat template blogskins tuh,korang boleh edit sendiri sebab code kat blogskin tu lebih kurang je macam template blogger.Tutorial ni baru part 1.Ada masa terluang,saya sambung buat part kedua pulak deh.

1)Tutorial revert old templates kepada classic template

Note:Sebelum korang paste code template blogskins tuh kat edit html, korang kena revert dulu template tu kepada classic template.Macam mana nak revert tu?Moh le nak ajar ne :3 (P/S : Dinasihatkan supaye backup dulu template lama korang,takut-2 tak jadi ke hape ke)

1.Dashbord>Design>Edit HTML
2.Click Revert to Classic Template
3.Lepastu,buang semua code dekat edit html tu dan paste code template blogskins pilihan korang.Sesiapa tak tahu lagi macam mana nak amek code blogskins tu,tengok gambar bawah ni.

(click blogger main)
4.Save template!

2)Macam mana nak tukar title blog template blogskins

(contoh title blog)
1.Dashbord>Template

2.Ctrl f dan search <title>

3.Delete ayat kat tengah tu seperti yang korang lihat dekat tajuk blog korang dan gantikan dengan ayat korang sendiri.

4.Save template

3)Letak background sendiri kat template blogskins

1.Dashbord>Template

2.Ctrl f dan search body {
Dan korang akan nampak code tu seakan-akan macam ni :
background-image:url(Url background);
Link background lama tu tukar dan ganti background korang sendiri.Nak ambik bawah ni pun takpe :p

http://3.bp.blogspot.com/-fXkCx_RMg6g/TlsRGTh2GnI/AAAAAAAACkI/EK3E0wyAm6Y/s1600/pinkk.gif

3.Save template.

4)Bagaimana nak letak header dekat blog(template blogskin)

1.Dashbord>Template
2.Search code <head>
3.Copy dan paste code ni diatas <head>
<center><img src="URL HEADER ANDA"></center>
4.Save template

5)Add comment kat blog -credit to Qay-

Tutorial ni untuk sesiapa yang takda butang comment kat blog.Siapa yang ada tu tak payah nak bising-bisinglah -.- .Keyh,jum try cepat!

1.Dashbord>Template
2.Ctrl f dan search :
</Blogger>
3.Copy dan paste code neh diatas </Blogger>

<BlogItemCommentsEnabled><aclass="comments"href="https://www.blogger.com/comment.g?blogID=YOUR BLOG ID&postID=<$BlogItemNumber$>&isPopup=true"onclick="window.open('https://www.blogger.com/comment.g?blogID=YOUR BLOG ID&postID=<$BlogItemNumber$>&isPopup=true','bloggerPopup','toolbar=0,scrollbars=1,location=0,statusbar=1,menubar=0,resizable=1,width=400,height=450');returnfalse;"><$BlogItemCommentCount$>comment(s)</a></BlogItemCommentsEnabled>



4.Preview dan save template

6)Letak icon sebelah comment utk template blogskins

1.Dashbord>Template
2.Ctrl F dan search ayat comment korang.For example macam saya punye comment(s) .
3.Copy dan paste code neh disebelah ayat korang tuh.
<img src="URL ICON ANDA"/>
  • Merah : Boleh digantikan dengan icon yang korang mahu :)
4.Save template


7)Title post boleh click atau letak link dekat title post utk template blogskins

1.Dashbord>Template
2.Ctrl f dan search :
<$BlogItemTitle$>
3.Delete code <$BlogItemTitle$> dan gantikan dengan yang bawah neh.

<span class="PostTitle">
<a href="<$BlogItemPermalinkURL$>">
<$BlogItemTitle$></a></span>
4.Preview dan save template

Okey,setakat ini dahulu.Lain kali pulak untuk part 2.Dah penat ni wok.Comment and like.Bye

34 ulasan:

  1. cik anis,thanks share tuto..

    BalasPadam
  2. @Ed Faris
    samasama encik Faris :)

    BalasPadam
  3. waa, rjin buat tuto! mesti rmai yg ske tuto nih.. gud2 ^^

    BalasPadam
  4. @Miss Xyz=)
    hehe,terima kasih.selamat hari raya <3

    BalasPadam
  5. waaaa~ terbeliak mata! banyak anis kena ajarkan. huhu sorri. thanks tau! t aki cube try tes jadi ke x ek.

    btw, camat hari raya anis! ^^

    BalasPadam
  6. huaaaaaaaaa... btw, thanks sesangat untuk tuto nih..

    tp..... kusyi akn usaha nk edit coding tuh! huhu~

    SALAM AIDILFITRI~

    BalasPadam
  7. @Aki
    okey,samasama aki.Good luck tau!senang je nak edit ne,ada masa anis buat part 2 punye.

    BalasPadam
  8. @ kusyi
    menjerit terharu ke tu?hihi,samasama :)selamat hari raya juga :D

    BalasPadam
  9. @ Edriana Feehily
    most welcome! ;D

    BalasPadam
  10. Anis..sy download dh blogskin..tpi kecik...knp eak?

    BalasPadam
  11. tuto yg berguna , terima kasih anis ;))

    BalasPadam
  12. terima kasih untuk tuto ni,, :D

    BalasPadam
  13. nak try tuto ni..hope berjaya la..tenkiuuuu so much anis :)

    BalasPadam
  14. Thankss for the tuto . Dah test mmng best gila lahh . Btw , buat lagi banyak-2 okayy :)

    BalasPadam
  15. wauu , thanks anis bagi tutor ni <3

    BalasPadam
  16. Assalamualaikum , awak . Tutorial blogskin awak yg num 7) Title post boleh click atau letak link tu saya cuba buat dan preview . Boleh berfungsi tpi font title post saya jadi keciklah . Macam mane yerk nak buat ? Jenis font sekali berubah . Harap awak boleh ajarkan .

    BalasPadam
  17. sayang kenape comment akak tak boleh nak click ?

    BalasPadam
  18. Kalau header dier jadi kecik.Nak buat macam mana?

    BalasPadam
  19. pinjam tuto nk letak kt blog ye . nnti saya akan credits kn ania . jngn risau :D

    BalasPadam
  20. Sayangg , sis ambik tutorial nie boleh ? Dah credit nama awak :)

    BalasPadam
  21. Yang "post a comment" utk blogskins tu kan..Post ID tu nak ambik dari mane ?

    BalasPadam
  22. assalamualaikum nak tanya kalau mcm blog saya dia punya comment blog tu kalau tekan dia tak keluar ,, mcm mane ea niee link blog saya http://hiqaelfairline.blogspot.com

    BalasPadam