รวมเทคนิควิธีสร้าง Blogger

รวมเทคนิควิธีสร้าง Blogger


เริ่มสร้าง Blogger กัน  http://www.hackublog.com/2010/06/roadmap-blogger-blogspot.html



Gadget ต่างๆ ใน Blogger  http://itoeblog.blogspot.com/2009/05/gadget-blogger.html

ลงเพลงให้กับ Blogger http://writer.dek-d.com/ABCXYZ/story/view.php?id=746341

download templates http://btemplates.com/page/5/

แผงควบคุม (Dashboard)
เป็นหน้าที่รวม Blog ที่เราสร้างไว้ทั้วหมด รวมทั้งการเข้าถึง Blog นั้นๆ เพื่อแก้ไข หรือสร้างบทความใหม่ การปรับแต่ง ตั้งค่า และอื่นๆอีกมากมาย ซึงผมจะอธิบาย เมนู การใช้งานหน้าแผงควบคุม (Dashboard) ให้อย่างละเอียด เพื่อให้เพื่อนเข้าใจการใช้งาน Blogger ครับการสร้างบทความ (Post)
ส่วนของการสร้างบทความให้เข้าไปที่ "การส่งบทความ" หัวข้อ "สร้าง" ให้เพื่อนๆทำความเข้าใจเมนูและเครื่องมือต่างๆ ของการสร้างบทความใน Blogger เพื่อให้ง่ายต่อการใช้งาน
ความเข้าใจเบื้องต้นในการสร้างบทความ
การสร้างบทความใช้พื้นฐาน Microsoft word คือเขียนอย่างไรก็จะออกมาอย่างนั้น แบ่งออกเป็น 2 ส่วน

1. ส่วนของ "เขียน"
   ในส่วนนี้จะเหมือน Microsoft Word เกือบทุกๆอย่าง อยากเขียนอะไร อยากใช้ตัวหนา ตัวเอียง การใส่ Link เพียงแค่คลิ๊กเมนูการใช้งานด้านบน มีข้อเสียคือ เวลา Copy อะไรก็ตามแล้วนำมา Paste ลงในนี้ ลักษณะของของตัวอักษรจะเหมือนกับต้นแบบที่ Copy มาทุกอย่างครับ
2. ส่วนของ "HTML"
ส่วนนี้ต้องใช้ความรู้พอสมควรในการปรับแต่เนื้อหาหรือบทความที่เราเขียนให้เป็นไปตามที่เราตั้งใจ ซึ้งต้องใช้ความรู้ภาษา HTML พอสมควร แต่ไม่ได้ยากเท่าไรครับ ข้อดีคือ สามารถปรับตามความต้องการของเราได้ทุกอย่าง เมื่อ Copy อะไรมาวาง ลักษณะตัวอักษรจะถูกปรับเป็นตัวอักษรปกติของบล๊อกเราครับ

ข้อสังเกตุ:
การ Copy อะไรมาวางถ้าไม่อยากให้ลักษณะผิดเพี้ยน ไม่ตรงตามรูปแบบที่สวยงาม ให้้ Copy แล้วทำมา Paste ในส่วนของ HTML ครับ ข้อความทั้งหมด จะถูกปรับให้การแสดงผลเป็นค่าปกติของบล๊อกเรา ไม่ใช่ตามลักษณะต้นแบบที่เรา Copy มาครับ

เครื่องมือต่างๆ ในการสร้างบทความ

Blogger มีเครื่องมือต่างๆมากมาย เพื่อให้ผู้ใช้งานสามารถเขียบบทความได้ตามรูปแบบที่ตั้งใจ ดูตามดังรูปเลยครับ

1. แบบอักษร สามารถเลือกตัวอักษรได้ตามต้องการ
2. ปรับขนาดตัวอักษร ปรับขนาดความใหญ่หรือเล็กลง
3. ตัวหนา
4. ตัวเอียง
5. สีของตัวอักษร
6. ทำ Link ให้ข้อความ เราสามารถสร้าง Link ให้ข้อความได้โดยการ คลิ๊กคลอบข้อความที่เราต้องการแล้วกดที่เมนูนี้ ระบบจะให้ทำการใส่ URL (ที่อยู่ของ Link เช่น www.snook.com) เมื่อคลิ๊กที่ข้อความจะถูกส่งไปยังหน้าเว็บที่เราใส่ Link เข้าไป
7. ทำบทความให้ชิดซ้าย
8. ทำบทความให้อยู่กึ่งกลาง
9. ทำบทความให้ชิดขวา
10. ทำบทความให้ชิดทั้งขอบซ้ายและขวา
11. ทำรายการเรียงลำดับเป็นตตัวเลข
12. ทำรายการเรีนงลำดับเป็นจุด
13. ใส่ "," ให้กับข้อความที่ต้องการเน้นคำพูด
14. เพิ่มรูปภาพลงในบทความของเรา ระบบจะให้เราอัพโหลดไฟล์รูปภาพจากเครื่องคอมพิวเตอร์ของเรา สามารถปรับขนาดและจัดรูปแบบให้อยู่ ซ้าย,กลาง,ขวา ได้
15. เพิ่ม Video เข้าไปในบทความของเราเช่นเดียวกับรูปภาพครับ
16. ส่วนนี้เป็นการลบข้อความที่เราเขียนผิดพลาด ในส่วนนี้ไม่ค่อยได้ใช้เท่าไร หรือไม่ได้ใช้เลยก็ได้
17. แก้ไข HTML ส่วนนี้ต้องใช้ความรู้พอสมควรในการปรับแต่เนื้อหาหรือบทความที่เราเขียนให้เป็นไปตามที่เราตั้งใจ ซึ้งต้องใช้ความรู้ภาษา HTML พอสมควร
18. หน้าที่ใช้เขียนบทความเหมือนการใช้งาน Microsoft Word
19. แสดงตัวอย่างที่เราเขียนบทความ
20. การใส่หัวข้อเรื่อง เช่น เรื่อง "การตกแต่งบ้างโดยใช้ต้นไม้ประดับ" หัวข้อก็คือ การตกแต่งบ้าน (บ่งบอกให้รู้ว่าเรื่องเกี่ยวกับอะไร)
21. ทำการเผยแพร่บทความทันที บทความจะแสดงหน้าบล๊อกของเราทันที่ที่เราเผยแพร่
22. บันทึก เป็นการบันทึกบทความไว้ก่อน จะยังไม่แสดงในหน้าบล๊อกของเรา เหมือนการร่างบทความ เราสามารถเข้าไปปรับเปลี่ยนทีหลังได้ใน "การแก้ไขบทความ"

การทำ Read more ให้กับ Blogger
บางครั้งคนอ่านไม่ชอบเนื้อหายาวๆบนหน้าเว็บซึ่งยาวเป็นกิโล ผมก็ไม่ค่อยจะชอบเหมือนกัน การใส่ Read more หรือ อ่านต่อ… เป็นตัวเลือกอย่างนึงที่ทำให้เนื้อหาเราดูสั้นลงตามที่เรากำหนด เมื่อคนอ่านอยากอย่านต่อหัวข้อนั้นๆก็สามารถคลิ๊ก Read more.. หรือ อ่านต่อ… ได้ ทำให้สะดวกและประหยัดหน้าเว็บเราไม่น้อยทีเดียว
การทำ Read more ให้กับ Blogger ให้เราเข้าไปที่ Edit HTML หรือแก้ไข HTML

1. .ให้ทำการ Backup ไว้ก่อนกันเหนี่ยวเดียวผิดพลาดขึ้นมางานจะเข้า
2. กดเพิ่มเครื่องมือแม่แบบ เพื่อเปิด Code แบบเต็ม

ใส่ code สีแดงข้างล่างนี่ใส่ไว้ก่อน </head> หลัง </b:skin> ครับ

]]></b:skin> <b:if cond='data:blog.pageType != "item"'> <style>#fullpost{ display:none;}</style> </b:if> </head>

จากนั้นกด Ctrl+F หา Code นี้ครับ <p><data:post.body/></p> แล้วใส่ Code สีแดงไว้ด้านล่างครับ

<div class='post-body entry-content'>       <p><data:post.body/></p>       <b:if cond='data:blog.pageType != "item"'>          <p><a expr:href='data:post.url'>Read More</a></p>       </b:if>       <div style='clear: both;'/> <!-- clear for photos floats –>

ให้สังเกตุคำว่า Read More ใน Code ด้านบนนี้ครับ เราสามารถแก้ไขตามใจเราได้เช่นเราอยากให้แสดงเป็นคำว่า อ่านต่อ… เราก็เปลี่ยนจาก Read More เป็นคำว่า อ่านต่อ… ครับ แค่นั้นแหละ
หลังจากนั้นให้เรากด Save Template ได้เลยครับ
จากนั้นไปที่ Setting >>> Formatting เลื่อนลงมาล่างสุดจะเห็น Post Template ให้ Copy ข้างล่างนี่ใส่กรอกเข้าไปแล้ว Save ครับ

ส่วนที่จะให้แสดง
<span id="fullpost">
ส่วนที่เหลือ
</span>

เราอยากให้ตรงไหนโผล่ขึ้นก็ให้เขียนตรง “ส่วนที่จะให้แสดง” ตรงไหนอยากให้อ่านต่อก็ใส่ตรง “ส่วนที่เหลือ”

เมนูต่างๆของหน้า แผงควบคุม (Dashboard)

เมนูต่างๆที่เพื่อนๆต้องรู้มีไม่มากครับ แต่อาจจะลายตาไปหน่อยนะครับ ดูตามรูปภาพเลยครับ

1. E-mail
   ที่เราใช้สมัครเป็บ Username ของเราครับ
2. หน้าแผงควบคุม(Dashboard)
   ก็คือหน้านี้ที่กำลังอธิบาย
3. หน้า Account
   หรือหน้ารวมเครื่องมือต่างๆ ที่เราสมัครกับ Google เช่น E-mail, Blog, สามารถเปลี่ยนรหัสได้ในหน้านี้
4. ช่วยเหลือ
   เป็นการช่วยเหลือในส่วนต่างๆ ของ Blogger ที่ Google ทำไว้ให้เราครับ
5. ออกจากระบบ
   เป็นการ Logout ออกจากระบบการใช้งานเมื่อใช้งานสร็จครับ
6. เปลี่ยนภาษา
   ของบล๊อกเราทั้งระบบครับ
7. ประวัติของเรา
   สามารถปรับรูปภาพเกี่ยวกับเจ้าของครับ หรือโปรไฟล์ต่างๆ
8. สร้างบล๊อกใหม่
   และช่วยเหลือตามข้อ 4 ครับ
9. ชื่อของบล๊อก
   หรือ Title ของบล๊อกเรา ที่เราตั้งค่าไว้ตอนสมัครครับ
10. ดูบล๊อกของเรา
11. สร้างบทความใหม่ให้กับบล๊อก
12. แก้ไขบทความ
    เป็นการแก้ไขบทความต่างๆ ที่เราสร้างไว้แล้ว สามารถแก้ไขได้ในส่วนนี้
13. การตั้งค่า
    เป็นการตั้งค่าต่างๆ เช่น ชื่อบล๊อก และอื่นๆอีกมากมายครับ
14. รูปแบบ
    เป็นการเปลี่ยนรูปร่างหน้าตาของบล๊อกเรา (Theme)