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 comments:

  1. @Ed Faris
    samasama encik Faris :)

    ReplyDelete
  2. waa, rjin buat tuto! mesti rmai yg ske tuto nih.. gud2 ^^

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

    ReplyDelete
  4. 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! ^^

    ReplyDelete
  5. huaaaaaaaaa... btw, thanks sesangat untuk tuto nih..

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

    SALAM AIDILFITRI~

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

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

    ReplyDelete
  8. @ Edriana Feehily
    most welcome! ;D

    ReplyDelete
  9. Anis..sy download dh blogskin..tpi kecik...knp eak?

    ReplyDelete
  10. tuto yg berguna , terima kasih anis ;))

    ReplyDelete
  11. terima kasih untuk tuto ni,, :D

    ReplyDelete
  12. nak try tuto ni..hope berjaya la..tenkiuuuu so much anis :)

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

    ReplyDelete
  14. yeaahhh, thanks anis (:

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

    ReplyDelete
  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 .

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

    ReplyDelete
  18. Thx for the tuto :)

    ReplyDelete
  19. Kalau header dier jadi kecik.Nak buat macam mana?

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

    ReplyDelete
  21. Sayangg , sis ambik tutorial nie boleh ? Dah credit nama awak :)

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

    ReplyDelete
  23. 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

    ReplyDelete