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

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp4uZzo33pA5Ic060DVAQ3arEVGjzb2sYZ4CmMHTcxJze7WOCHAk0MmHDPC52isvskIVogKG3yWoaPFsE1GKE4tqrbdJzLsCLFdPl9E83FOtUdAaWD9o2LH0PoMqr730ag0UopsKX-R7s/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

Posted on Monday, 29 August 2011 by Anis Diyana

Label:

34 comments:

  1. Nur Hazwani29 August 2011 at 12:47

    Yay, thank you Anis ;D

    ReplyDelete
  2. Syah Zahari29 August 2011 at 12:49

    cik anis,thanks share tuto..

    ReplyDelete
  3. Anis Diyana29 August 2011 at 13:16

    @Nur Wani
    samasama :D

    ReplyDelete
  4. Anis Diyana29 August 2011 at 13:17

    @Ed Faris
    samasama encik Faris :)

    ReplyDelete
  5. Sya29 August 2011 at 14:47

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

    ReplyDelete
  6. Anis Diyana29 August 2011 at 15:41

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

    ReplyDelete
  7. 秋 ツ29 August 2011 at 16:45

    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
  8. kusyi29 August 2011 at 18:58

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

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

    SALAM AIDILFITRI~

    ReplyDelete
  9. Unknown29 August 2011 at 19:32

    Thanks for this !

    ReplyDelete
  10. Anis Diyana29 August 2011 at 21:26

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

    ReplyDelete
  11. Anis Diyana29 August 2011 at 21:27

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

    ReplyDelete
  12. Anis Diyana29 August 2011 at 21:27

    @ Edriana Feehily
    most welcome! ;D

    ReplyDelete
  13. 위니 앤(winnie anne)31 August 2011 at 00:14

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

    ReplyDelete
  14. asmiera emiena31 August 2011 at 23:17

    tuto yg berguna , terima kasih anis ;))

    ReplyDelete
  15. Tiara1 September 2011 at 00:46

    terima kasih untuk tuto ni,, :D

    ReplyDelete
  16. Khairina1 September 2011 at 15:03

    thank u for this tuto =)

    ReplyDelete
  17. Shaira Ismail8 September 2011 at 18:47

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

    ReplyDelete
  18. Anonymous15 September 2011 at 16:37

    faten guna :D

    ReplyDelete
  19. Shahirah Che Nuddin17 September 2011 at 10:23

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

    ReplyDelete
  20. Anonymous17 September 2011 at 20:18

    yeaahhh, thanks anis (:

    ReplyDelete
  21. nurradizan21 September 2011 at 15:00

    kenapa tak boleh copy?:(

    ReplyDelete
  22. HaidaHahan25 September 2011 at 09:43

    mcm best.. nk try :)

    ReplyDelete
  23. Nursalam Zainal27 September 2011 at 21:17

    wauu , thanks anis bagi tutor ni <3

    ReplyDelete
  24. Charisa Charlseak29 September 2011 at 01:59

    tq!berguna sangat!

    ReplyDelete
  25. Hanis Nizam3 October 2011 at 16:55

    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
  26. Zara ♥28 October 2011 at 01:46

    sayang kenape comment akak tak boleh nak click ?

    ReplyDelete
  27. Anonymous7 November 2011 at 07:38

    Thx for the tuto :)

    ReplyDelete
  28. Izazani8 November 2011 at 22:40

    Kalau header dier jadi kecik.Nak buat macam mana?

    ReplyDelete
  29. Nurul Husnina Izzati9 November 2011 at 00:39

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

    ReplyDelete
  30. anonymous1 December 2011 at 17:51

    err . knpa x leh nk click ?

    ReplyDelete
  31. Nur Syazana9 December 2011 at 12:57

    nak copy, CTRL+C :)

    ReplyDelete
  32. Elle Farahin20 December 2011 at 16:57

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

    ReplyDelete
  33. syasandeul23 December 2011 at 02:03

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

    ReplyDelete
  34. hoah15 February 2012 at 17:18

    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