วิธีเปลี่ยน Templates ของ Blogger

หลังจากบทความแรกได้เสนอบทความขั้นตอนในการสร้างบล็อกไปแล้ว และได้ฝากให้คิดเป็นการบ้านแล้วว่าจุดประสงค์ของการทำบล็อกของคุณคืออะไร เพราะจุดประสงค์นี่แหละครับจะเป็นตัวกำหนดว่าเราจะเลือก แม่แบบ (หน้าตา และองค์ประกอบ) ของบล็อกอย่างไร 

ต่อไปเราจะมาดูวิธีการเลือก และการเปลี่ยน blogger Template กันครับ


รูปภาพ3


ขั้นที่ 1 ให้คุณไปเลือก blogger templates ได้ที่


http://btemplates.com
http://www.premiumbloggertemplates.com/
http://www.bloggertemplates4you.com/
http://www.deluxetemplates.net
http://simplexdesign.blogspot.com/
http://www.besttheme.net/
http://www.zoomtemplate.com/
http://www.allblogtools.com/
http://premiumbloggerthemes.com/
http://www.bloggertemplateplace.com
http://themecraft.net
http://bloggets.blogspot.com/
http://www.bietemplates.com/
http://www.bloggerthemes.net
http://www.bloggerstyles.com
http://www.anshuldudeja.com
http://www.bloggertemplatesfree.com
http://www.bloggertemplatesblog.com
http://www.templatesblock.com
http://blogtemplate4u.com/
http://www.mybloggerthemes.com/
http://www.dantearaujo.net/search/label/Free%20Template
http://www.chethstudios.net/search/label/blogger%20templates
http://blogger-templates.blogspot.com
http://freetemplates.blogspot.com
http://www.webtemplatesblog.com
http://www.ezwpthemes.com
http://www.freebloggertemplate.info
http://www.blogcrowds.com/resources/blogger-templates
http://www.zoomtemplate.com
http://www.templates-blogger.com
http://www.bloggerblogtemplates.com
http://bloggertemplateplace.com
http://www.templatesblogger.net
http://www.bietemplates.com
http://magazine-theme-collection.blogspot.com/


หรือจะใช้คำค้น “Template+blog” ใน google ก็ได้ครับ 

ผมเชื่อว่าขั้นตอนนี้คุณคงจะใช้เวลานานพอสมควรเลยล่ะครับ (ผมเองก็ใช้เวลาเป็นวันๆ ในการเลือก templates ทีเดียวครับ )


ขั้นที่ 2 เมื่อคุณได้ Template ที่ต้องการแล้ว ให้เริ่มเปลี่ยนดังนี้


image


2.1  ให้แตกไฟล์  ที่มีนามสกุล .xml ไว้ที่ๆ สะดวกเรียกใช้ได้ง่าย เช่น ในที่นี้ผมเลือกแม่แบบที่ต้องการแล้ว แตกไฟล์ awes-template.xml ไว้ที่ desktop




2.2 Log in ที่ blogger ไปที่แผงควบคุม >> รูปแบบ >> แก้ไข HTML >> คลิกปุ่ม เรียกดู  เพื่อที่จะอัปโหลดแม่แบบขึ้นมา  


image

2.3 เรียกไฟล์ .XML ที่เตรียมไว้ตามขั้นตอนในรูปครับ

image

image

2.4 อัปโหลดแม่แบบขึ้นไปแทนที่แม่แบบเดิม โดยระหว่างการแทนที่ อาจมีการถามถึงการลบ/เก็บ Widget ของแม่แบบเดิม ซึ่งถ้าต้องการเก็บของเก่าเอาไว้ก็เลือก เก็บ Widget ก็จะทำให้ Widget ของแม่แบบเดิม ไม่ถูกลบขณะเปลี่ยน  Templates
image
2.5 จากนั้นลองแสดงตัวอย่างดู ซึ่งถ้าพอใจกับแม่แบบแล้วก็ให้ทำการบันทึก ก็จบขั้นตอนการเปลี่ยนแม่แบบแล้วครับ  และถ้าหากคุณต้องการเปลี่ยนแม่แบบอีกก็สามารถเปลี่ยนได้แบบไม่จำกัดครั้ง
 image
นี่คือผลงาน หลังจากเปลี่ยนแม่แบบครับในบทความนี้ครับ

ก่อนเปลี่ยน Template

image


หลังเปลี่ยน Template

image
บทความต่อไปผมจะนำเสนอวิธีเขียนบทความลงในบล็อกครับ อย่าลืมติดตามอ่านกันนะครับ สวัสดีครับ

ตอนนี้มีความคิดเห็น : 52 ความคิดเห็น
หากคุณมีปัญหาหรือข้อสงสัยใดๆ สามารถสอบถามได้จากกล่อง comment ด้านล่างนี้ได้เลยครับ

  1. อยากด้ายโปรแกรมฟังเพลงในบรอคคับทำไงดี

  1. @ sky_like

    วิธีแรก

    ดูรายละเอียดที่นี่เลยครับ
    http://hackublog.blogspot.com/2009/10/mp3.html

    เมื่อทำตามขั้นตอนเรียบร้อยแล้ว ก็ให้ Add Gadget ชนิด HTML แล้ว นำโค้ดที่ได้จากบทความที่แนะนำไปวางแล้วบันทึกครับ

    วิธีที่ 2 ไปที่
    http://www.pleng.com/
    Add Gadget ชนิด HTML แล้ว นำโค้ดที่ได้มาจากเว็บ pleng.com แปะแล้วบันทึกครับผม

    ถ้ายังสงสัยถามเพิ่มเติมได้ครับ

  1. บทความนีมีกับคนเพิ่งเริ่มเขียนมากเลยครับ ขอบคุณมาก

  1. ถ้าเรา template ทีี่เราเลือกมาเป็นแม่แบบ เนี่ยเราสามารถแก้ไขบางส่วนได้ไหมค่ะ

    เช่น ในตัวรูปภาพของตัวแม่แบบที่ติดมา แล้วเอารูปอื่นที่เราต้องการใส่เข้าไปแทน

  1. ตอบคุณจอย แก้และปรับแต่งได้ง่ายกว่าแม่แบบปัจจุบันของ blogger แต่จะต้องทราบโค้ดที่จะแก้เท่านั้นเองครับ อ่านจากบล็อกนี้ก็ได้ครับ

  1. คุณ Hacku ค่ะ ช่วยดู http://cardpapercraft.blogspot.com/2010_07_01_archive.html ให้หน่อยได้มั้ย คือในพื้นที่(ด้านซ้าย) Gadget มันห้อยลงมา แล้วรูปของ template มันไม่ขยายตามมาด้วยค่ะ จะเป็นในหน้าที่มีบทความสั้นๆๆ เช่นในเดือน ก.ค. แล้วก็หน้า Contact ด้วย ถ้าจะแก้ให้ template ขยายตามลงมาด้วยทำได้มั้ยค่ะ

  1. ตอบคุณจอย : แม่แบบนี้ใช้รูปภาพเป็นพื้นหลังครับ ถ้าต้องการให้พอดีกับที่คุณจอยต้องการต้องแก้ที่รูปภาพครับ
    http://2.bp.blogspot.com/_iI6SgnnhWEM/StdlxZbjx_I/AAAAAAAAAYg/xYr4S-qydtY/s1600/bottom_frame.jpg

    ซึ่งโค้ดจะอยู่ที่โค้ดชุดนี้ครับ
    #bottom_frame {
    -moz-background-clip:border;
    -moz-background-inline-policy:continuous;
    -moz-background-origin:padding;
    background:transparent url(http://2.bp.blogspot.com/_iI6SgnnhWEM/StdlxZbjx_I/AAAAAAAAAYg/xYr4S-qydtY/s1600/bottom_frame.jpg) no-repeat scroll center bottom;
    padding:0 0 57px;
    }

    อาจจะใช้ Photoshop ปรับให้พื้นที่สีน้ำตาลยาวลงมาอีกแล้ว ฝากรูปภาพกับเว็บรับฝากรูป เสร็จแล้วเอามาแทนที่โค้ดรูปเดิมคือ

    http://2.bp.blogspot.com/_iI6SgnnhWEM/StdlxZbjx_I/AAAAAAAAAYg/xYr4S-qydtY/s1600/bottom_frame.jpg

    ในตำแหน่งชุดโค้ดข้างบนในแม่แบบที่ยกมาให้ดูครับ

  1. ตอบคุณจอยครั้งที่ 2 : พอดีผมลองใช้ฝีมือ PS ห่วย ๆ ของผมลองแต่งดู ถ้าคุณจอยอยากให้เร็วก็ทำแบบนี้ครับ

    ค้นหาโค้ดต่อไปนี้ในแม่แบบ
    #bottom_frame {
    -moz-background-clip:border;
    -moz-background-inline-policy:continuous;
    -moz-background-origin:padding;
    background:transparent url(http://2.bp.blogspot.com/_iI6SgnnhWEM/StdlxZbjx_I/AAAAAAAAAYg/xYr4S-qydtY/s1600/bottom_frame.jpg) no-repeat scroll center bottom;
    padding:0 0 57px;
    }
    จากนั้นแทนที่ด้วยโค้ดต่อไปนี้
    #bottom_frame {
    -moz-background-clip:border;
    -moz-background-inline-policy:continuous;
    -moz-background-origin:padding;
    background:transparent url(http://4.bp.blogspot.com/_uJ9ptu1GqQ0/TFpGcBXEdII/AAAAAAAAEaM/VvMiVnwjurM/s1600/bottom_frame.png) no-repeat scroll center bottom;
    padding:0 0 57px;
    }

    บันทึกแม่แบบ จบแล้วครับ ปัญหาน่าจะหมดไป

  1. ทำได้แล้วค่ะ แต่ข้อความ Copyright หายไป คิดว่าไม่ต้องมีก็คงไม่เป็นไรมั้งค่ะ(หรือเปล่า) แต่ก็ขอบคุณมากๆๆๆนะค่ะ ใจดีจังเลยอุตส่าลองทำให้ ถ้าคุณ hacku บอกว่าฝีมือ PS ห่วยๆ อย่างจอยคงไม่เหลือแล้วละค่ะ 555+

  1. ทำไมจอยขยายรูปตรง #top_frame ไม่ได้ละค่ะ ใช้ PS ค่ะ
    จอยขยายแล้วก็ save แล้วก็เอาไปฝากไว้ที่เว็บรับฝากรูปค่ะ
    แต่พอเอามาใช้แทนที่ของเดิม เมือเปิดมาดู รูปตรง #top_frame หายหมดเลยค่ะ
    ทำไมไฟล้ที่คุณแก้ไขให้ถึงยังมีชื่อไฟล์คล้ายๆของเดิมละค่ะ ของจอยเมือเอารูปที่ไปฝาก
    ที่เว็บฝากรูปมาลงชื่อไฟล์เปลี่ยนไปเลยค่ะ คุณ hacku ทำยังไงเหรอค่ะ

    http://2.bp.blogspot.com/_iI6SgnnhWEM/StdlxZbjx_I/AAAAAAAAAYg/xYr4S-qydtY/s1600/bottom_frame.jpg (ของเดิม)

    http://4.bp.blogspot.com/_uJ9ptu1GqQ0/TFpGcBXEdII/AAAAAAAAEaM/VvMiVnwjurM/s1600/bottom_frame.png) (ของคุณ hucku)

  1. กำลังหัดทำพอดีเลย ขอบคุณครับ

  1. กำลังหัดทำพอดีเลย ขอบคุณมากค่ะ

  1. คุณ Mr.Hackublogคะ รบกวนบอกวิธีแก้ไขเทมเพลตเฉพาะส่วนหน่อยได้ไม๊คะ
    เช่นเปลี่ยนแถบที่จะต้องแอดโฆษณา ขอบคุณล่วงหน้านะคะ

  1. @ zoomcheeze : บอก URL ของบล็อกกับจุกประสงค์มาเลยครับ เดี๋ยวจะลองช่วยดูให้ครับ

  1. ขอบคุณมากครับ ผมติดตามผลงานคุณมาตลอดเลยครับ

  1. OK ครับ ทำได้แล้ว ขอบคุณมากๆ

  1. จะลบบางส่วนไม่ทราบโค๊ดค่ะ ช่วยดูให้หน่อยนะคะ พยายามจนเหนื่อยแล้วค่ะ
    ้http://ledtvshopping.blogspot.com ส่่วนบนที่มันมีคำ undefined ค่ะ

  1. @คุณ natty70 : ที่จริงเรากลับไปยังเว็บที่ดาวน์โหลดแม่แบบมาเพื่อดูว่าต้องตั้งระบบวันที่อย่างไรจึงจะแสดงผลก็ได้

    แต่ถ้าคุณ natty70 จะลบจริง ๆ ก็ให้เข้าไปค้นหาโค้ด ]]></b:skin> แล้ววางโค้ดด้านล่างนี้ลงไปก่อนหน้า และบันทึกครับ


    .post_date{display:none;}

  1. ทำได้แล้วค่ะ ขอบคุณค่ะ

  1. รบกวนอีกครั้ง ถ้าเราโหลดtheme ฟรีมาใช้ แล้วมันติด Home Post RSS COMMENTS RSS ABOUT ต้องการลบออกให้หมด ต้องไปลบตรงไหนบ้างคะ ไม่ทราบโค๊ด

  1. @ Paneng : ต้องบอก URL ของบล็อกที่ต้องการเปลี่ยนให้ทราบครับ จึงจะช่วยดูให้ได้

    แต่ถ้าต้องการดูเองก็เข้าไปที่ แก้ไข HTML แล้วกด Ctrl +F ค้นคำว่า Post RSS หรือ COMMENTS RSS จากนั้นการลบออกก็ลองอ่านบทความนี้ต่อเลยครับ

    http://www.hackublog.com/2009/12/templates-link-menu.html

    ปล.ผม Mr.Hackublog ครับ พอดี login ในอีกบัญชีอื่น

  1. เจอปัญหาแบบเดียวกับคุณ NATTY70 คือ มีคำว่า undefined 3 ตัว ลองโพสต์หลายโพสต์ก็ขึ้นทุกโพสต์ ดูของจริงที่ http://www.levisjeansguide.blogspot.com/ ช่วยแนะนำตำแหน่งที่ต้องแก้ไขด้วยค่ะ

  1. ขอบคุณมากๆ เลยคับ เดียวจะลองไปเปลี่ยนดู

  1. คุงคับ กำลังหาอยุเลย

  1. ขอบคุณมากๆเลยค่ะ

  1. ขอบคุณนร๊ะคร๊ธ

  1. คือผมโหลด Templates มาแล้วอ่าครับ
    มีช่องตรงกลางอะครับมีรูปติดมาด้วย เปลี่ยนได้ไหมครับ
    ถ้าได้ แล้วเปลี่ยนยังไงหรอครับ

  1. ผมโหลด templates มาแล้วส่วนมากจะมีรูปที่อยู่ตรงกลางติดมาด้วย
    เปลี่ยน ภาพตรงนี้ได้ไหมครับ ถ้าได้ทำยังไงหรอครับ
    รบกวนช่วยตอบหน่อยนะครับ MR.Hackublog

  1. ต้องการลบหัวขัว home business download etc. ต้องทำยังไงครับ
    นี้ครับบล็อก http://cooking-not.blogspot.com/

  1. อยากทราบว่า ผมโหลด theme มาแล้ว ติดตั้งแล้ว เราอยากเพิ่มความกว้างหรืออะไรแบบเนี๊ยะต้องทำงัยอ่าครับ
    แล้วก้ออยากจะลบหรือจะเพิ่ม ที่แกดเก็ดเกท ทำไม่มี หรือลบตัวที่มีอยู่แล้วไม่ได้ พวกนี้ต้องไปแก้ โค็ด HTML หรอครับบ ถ้าแก้แบบนี้ปัญหาเกิดเลย ทำงัยดี ช่วยหน่อยนะครับ เมล azprangz2@gmail.com

  1. ความคิดเห็นนี้ถูกผู้เขียนลบ
  1. ผมอยากเเก้ undefined ที่เกิดขึ้นในเว๊ปของผมนะครับ

    ลองไปดูสิครับ http://hotmusic-zone4u.blogspot.com มันจะเเก้ยังไงหรอครับ

  1. Gclubclick ศูนย์รวมคาสิโนดัง พนันบอล แค่คลิกเดียวที่มีให้ท่านได้ร่วมสนุกกับเราไม่ว่าจะเป็นคาสิโนยอดนิยม และคาสิโนใหม่ ๆ เช่น GClub , Royal1688 , Ruby888 , Holiday-Palace , Genting-Crown ,Reddragon88 ท่านจะได้สัมผัสบรรยากาศจริง sภายในคาสิโนจริงทุกเกมส์การ เล่นตื่น เต้นเราใจ และนอกจากคาสิโนคุณภาพที่เราคัดสรรมาให้ ท่าน แล้วทาง
    Gclubclick.com เองยังมี SportBetting Onlineให้ท่านได้เลือกเดิมพนันกีฬาโปรด ที่ท่านชื่นชอบอย่างจุใจ อาทิ เช่น SBOBET ,IBCBET , WinningFT , MMMBET ท่าน สามารถเปิดเล่นกับเราได้แล้ววันนี้ ทางเรามีพนักงาน Call Center ไว้คอยบริการท่านด้วยความเป็นกับเองประทับ ในตลอด 24 ชม.
    ติดต่อสอบถาม 24 ชัวโมง
    081-122-5019 , 081-122-4019 , 080-559-7275
    http://www.Gclubclick.com
    http://gclubclick.blogspot.com/

  1. ช่วยตอบคำถามหน่อยนะครับ (เครียดมากเลยครับ)คือผมดาวโหลด templates ฟรี จาก google เมือทำการดูบล็อกแต่ทำไมบล็อกของผมจึงมีโฆษณาของ google ทั้งๆทีไม่ได้สมัคร เป็นเฉพาะ บราวเซอร์ chorm เท่านั้นครับ บราวเซอร์อื่นไม่เป็นครับ มีวิธีแก้ไขไม่ครับ ช่วยดูให้หน่อยนะครับ

    บล็อกนี้ครับ http://happy2paysanalyze.blogspot.com/
    ขอบคุณล่วงหน้าคับ
    ช่วยส่งวิธีแก้ไขมาที่
    jurndarawan@gmail.com
    ขอบคุณอย่างสูงครั

  1. การใส่ HTMLของบล็อกนี้อยู่ตรงไหนอะ

  1. สวัสดีค่ะ จอยทำบล๊อกเป็นได้ก็เพราะติดตามบล๊อกของคุณ hackublog ขอบคุณมากนะค่ะ แต่จอยมีสิ่งหนึ่งที่ยังทำไม่ได้ คือ จอยอยากเปลี่ยน หัว headder ให้เป็นรูปของเราอ่ะค่ะ ต้องไปแก้ที่ไหนค่ะ

  1. ขอบคุณมากครับ
    พัฒนาเด็กไทย Dekthaiandroid

  1. 2.2 Log in ที่ blogger ไปที่แผงควบคุม >> รูปแบบ >> แก้ไข HTML >> คลิกปุ่ม เรียกดู เพื่อที่จะอัปโหลดแม่แบบขึ้นมา
    เพิ่งหัดเขียนค่ะ จะเปลี่ยนธีมที่โหลดมา แต่หา เมนูนี้ไม่เจอค่ะ
    http://www.blogger.com/template-editor.g?blogID=2293791160809730914

  1. ขอบคุณครับเป็นประโยชน์มากเลย

  1. หาที่ีใสHTMLไม่เจอค่ะ

  1. หาที่ีใสHTMLไม่เจอค่ะ

  1. คือโหลดhtmlมาแล้วค่ะ แต่ต้องบีบอัดไฟล์ แล้วทำไม่ได้ ยังงัยช่วยตอบวิธีการไห้หนูหน่อยน่ะค่ะ ขอบคุณค่ะ

  1. คืออ่านแล้วก็เข้าใจอยู่อะค่ะ แต่ blogger มันไม่ใช่รุ่นเดียวกันอะค่ะเลยหาที่โหลดไฟล์ไม่ได้

  1. มีวิธีสร้างเทมเพลตบล็อกด้วยตัวเองไหมครับหายังไงก็ไม่มี ได้แต่ไปหาโหลดของคนอื่นมาใช้

  1. ขอผู้รู้ช่วยแก้ไขปัญหาหน่อยครับ เวลาเปิดเครื่องมา เจอข้อความ template.xml has encountered a problem and need to close แล้วทำให้งานจำพวก office ไม่สามารถใช้งานได้เลยครับ พอจะมีวิธีแก้ไข หรือเปล่า ครับ

  1. Blog นี้มีประโยชน์มากๆเลยครับผมพึ่งอ่านเมื่อวานวันนี้ผมตกแต่งแม่แบบบล็อกของผมได้ในระดับหนึ่งแล้วครับขอบคุณมากๆสำหรับบทความดีๆเช่นนี้นะครับลองดูบล็อกของผมได้ครับยังไม่สมบูรณ์มากนักนะครับ http://www.portraitbysun.com

  1. Blog นี้มีประโยชน์มากๆเลยครับผมพึ่งอ่านเมื่อวานวันนี้ผมตกแต่งแม่แบบบล็อกของผมได้ในระดับหนึ่งแล้วครับขอบคุณมากๆสำหรับบทความดีๆเช่นนี้นะครับลองดูบล็อกของผมได้ครับยังไม่สมบูรณ์มากนักนะครับ http://www.portraitbysun.com

  1. |รับสมัครผู้ร่วมงานและพนักงานฝ่ายการตลาดจำนวนมาก และผู้จัดจำหน่ายทุกภาค ไม่จำกัดวุฒิการศึกษา ไม่จำกัดอายุ เพียงคุณมีความสามารถก็เป็นส่วนหนึ่งของบริษัทเราครับ
    จะทำเป็นงานประจำหรืออาชีพเสริมก็ได้ ไม่ว่าอยู่จังหวัดไหนก็สามารถทำได้ สวัสดิการดี ซึ่งเราจัดกิจกรรมไปเที่ยวพักผ่อนต่างประเทศให้กับผู้ร่วมงานทุกปี สินค้าของเรากำลังเป็นที่ต้องการของตลาด จึงขายได้ไม่ยาก ซึ่งบางที่ชาวเกษตรยังไม่รู้จักสินค้าของเรา เราก็ยินดีให้ทดลองฟรี
    เพราะสินค้าของเราดีจริง จึงกล้าท้าพิสูจน์ให้ทดลองสินค้าของเราฟรีๆไม่มีข้อแม้ใดๆ
    สนใจติดต่อสอบถาม
    คุณป้อม โทร-086-4124288 id line:jomkit19
    ติดตามเรา : https://www.facebook.com/iamgeniussupport/
    เยี่ยมชมเว็บไซต์เรา : http://www.iamgeniuses.com/
    เยี่ยมชม : http://iamgeniuses.blogspot.com/

  1. ถ้าเปลี่ยน template แล้ว ข้อมูลจะยัง เหมือนเดีม หลื ถูกลบ

  1. ถ้าเปลี่ยน template แล้ว ข้อมูลจะยัง เหมือนเดีม หลื ถูกลบ

  1. ขอเรียนรู้ด้วยคนนะค่ะ

  1. ข้อมูลต่างๆจะถูกลบไม

แสดงความคิดเห็น

ถ้าต้องการโพส HTML ให้แปลงโค้ดที่เครื่องมือด้านล่างนี้ก่อนครับ

สร้างบล็อก Facebook SEO บล็อก Linkwheel iMacros Link Wheel