ครั้งที่ 4

     - นักเรียนสามารถสร้างแผนที่ โดย Google map ของตนเองได้

ใบงาน  ให้นักเรียนสร้างแผนที่ของตนเองใน google map แล้วนำไปใส่บทความหน้าเว็บ (ติดต่อเรา)

การส่งงาน  ให้นักเรียนส่งภายในคาบเรียน ของสัปดาห์ที่ 5

ขั้นตอนการสร้าง Map Google
   1. เปิด Internet Explorer มา 1 browser ไปที่ http://maps.google.co.th
   2. ลงชื่อเข้าสู่ระบบ Login ของนักเรียน
   3. ช่องค้น ให้นักเรียนค้นหาสถานที่ใกล้เคียงบ้านพักของนักเรียน เช่น วัด , ถนน ,หมู่บ้าน ,สถานที่ราชการ เป็นต้น
   4. ให้นักเรียนค้นหาสถานที่บ้านของนักเรียนโดยสังเขป
   5. เมื่อนักเรียนสามารถหาบ้านพักของนักเรียนได้แล้ว ให้นักเรียนเลือกหัวข้อสถานที่ของฉัน
   6. เลือกสร้างแผนที่ กำหนดจุดที่อยู่
   7. ใส่ข้อมูลชื่อที่อยู่ของนักเรียน แล้วบันทึก
   8. กลับสู่ http://maps.google.co.th อีกครั้ง
   9. เลือกสถานที่ของฉัน
  10. แล้วเลือกรูปลิ้งค์ สัญลักษณ์คล้ายรูปโซ่  คัดลอกลิ้งค์บรรทัดที่ 2 ไปวางในบล็อก หัวข้อติดต่อเรา
  11. ใส่ข้อมูลติดต่อเราให้ครบถ้วน ชื่อ สถานที่ติดต่อ Email  เว็บไซต์

การสร้างเมนูหน้าเว็บ

การเรียกใช้ Gadget ชนิดนี้สามารถเลือกใช้ได้เช่นเดียวกับการ Add Gadget ชนิดอื่น ๆ  นั่นคือ ไปที่ องค์ประกอบของหน้า >> แล้วเลือก เพิ่ม Gadget  


ต่อไปเรามาดูว่า Gadget นี้ ใช้อย่างไร และใช้เพื่อจุดประสงค์ใด

หลักการของ Gadget นี้เหมือนการสร้างบทความขึ้นมา 1 บทความ และ สร้าง Link เชื่อมโยงไปยังบทความนั้น ๆ แต่มีความพิเศษตรงที่ผู้ใช้ทั่วไปสร้างเมนูขึ้นเองได้อย่างง่ายดาย โดยไม่ต้องมีความรู้พื้นฐานเกี่ยวกับ HTML เลย

ตัวอย่างวิธีการใช้งาน(จริง)

ในตัวอย่างนี้ผมจะสร้าง 2 หน้าให้เห็นเป็นตัวอย่าง ได้แก่ HOME และ CONTACT ME

ขั้นเตรียมการ

เนื่องจากผมจะยกตัวอย่างการสร้างหน้า Contact me ดังนั้นให้ทุกคนไปสร้าง Form สำหรับติดต่อเจ้าของบล็อกซึ่งก็คือเราเอง ได้ที่

 http://www.foxyform.com/

ซึ่งขั้นตอนในการสร้าง ฟอร์มนั้นง่ายมาก มีเพียง 4 ขั้นเท่านั้น (ดูรูป)

  
    

เมื่อได้โค้ด แล้วคัดลอกเก็บเอาไว้ก่อนครับ

ขั้นสร้างหน้าเว็บจริง

ขั้นที่ 1 สร้างหน้าแรก หรือ HOME

Log in เข้าไปที่ draft.blogger

ไปที่แผงควบคุม >> องค์ประกอบของหน้า >> แล้วเลือก เพิ่ม Gadget เลือกอันแรกเลยครับ คือ gadget หน้าเว็บ

จากนั้นก็สร้าง หน้าแรกขึ้นมาโดยตั้งชื่อตามที่ต้องการได้เลย แล้วทำการบันทึกครับ

ขั้นที่ 2 เมื่อผ่านขั้นที่ 1 มาแล้วก็เท่ากับว่าเราได้สร้าง หน้าบล็อกขึ้นมาแล้ว 1 หน้า 

ถ้าจะทำการเพิ่มหน้าอีก ให้ไปที่แผงควบคุม >> การส่งบทความ >> แก้ไขหน้าเว็บ >> หน้าเว็บใหม่ 

เมื่อคลิกสร้างหน้าเว็บไหม่ เราก็จะพบเครื่องมือต่าง ๆ เหมือนการเขียนบทความนั่นเองครับ

ให้นำโค้ดของ Form ที่เตรียมไว้ จากขั้นเตรียมการมาวางในหน้าหน้านี้ จัดรูปแบบตามต้องการแล้วบันทึกหน้าได้เลยครับ

เพียงขั้นตอนสั้น ๆ นี้เราก็จะมีเมนูเชื่อมโยงไปยัง หน้าของบล็อกถึง 2 หน้าด้วยกัน ได้แก่ HOME และ CONTACT ME

ขั้นที่ 3 

- ถ้าหากต้องการเพิ่มหน้าบล็อกเพิ่มขึ้นอีกก็ทำซ้ำขั้นตอนที่ได้กล่าวมาข้างต้นครับ

- แต่ถ้าต้องการลบหน้าบล็อกทิ้ง ก็มาที่เดิม แล้วจะเห็นคำว่าลบ ถ้าต้องการลบทิ้งก็กดคำว่าลบได้เลย

   

ขั้นที่ 4 วิธีจัดการกับเมนูหน้าเว็บ 

- ถ้าต้องการเรียงลำดับหน้าเว็บใหม่ ก็ไปที่ องค์ประกอบของหน้า แล้ว คลิก Gadget หน้าเว็บขึ้นมาแก้ไข >> ดูรูป

นอกจากนี้ Gadget หน้าเว็บจะมีลักษณะพิเศษ คือ ถ้าอยู่ที่ Sidebar เมนูจะจัดเรียงเป็นแนวตั้ง

 

 

แต่ถ้าลากไปในตำแหน่งใต้ส่วนหัว จะจัดเรียงเรียงเป็นแนวนอนโดยอัตโนมัติ

 

  

ครั้งที่ 3

     - นักเรียนสามารถตั้งค่าพื้นฐานเกี่ยวกับบล็อกของตนเองได้

ใบงาน  ให้นักเรียนปรับเปลี่ยนรูปแบบเทมเพลต / ตั้งค่าพื้นฐานของบล็อก / สร้างหน้าเว็บไหม่ (ติดต่อเรา) / ส่วนเพิ่มของ Gedget ป้ายกำกับ (เมนูหลัก)  

การส่งงาน  ให้นักเรียนส่งภายในคาบเรียน ของสัปดาห์ที่ 4

ขั้นตอน  การปรับเปลี่ยนเทมเพลต    คลิ๊กที่นี่ 


             การสร้างหน้าเมนูหน้าเว็บ    คลิ๊กที่นี่ 


            ส่วนเพิ่มของ Gedget ป้ายกำกับ (เมนูหลัก)  คลิ๊กที่นี่

การตั้งค่าพื้นฐานให้กับบล็อก

บทความนี้ผมจะสอนการตั้งค่าพื้นฐานต่างๆ ของบล็อกเพื่อให้เข้าใจการตั้งค่าในส่วนต่าง ๆ ของ Blogger และจะทำให้คุณสามารถตั้งค่าต่าง ๆ ตามความต้องการของตนเองได้ อีกทั้งจะเป็นประโยชน์ในการพัฒนาการทำ Blogger ในระยะยาวด้วย

การตั้งค่าพื้นฐานต่างๆ ของบล็อกทำได้โดย Log in เข้าไปที่ blogger เมื่อมาที่หน้า แผงควบคุม ให้ Click ที่ การตั้งค่า

และท่านจะเข้ามาที่เมนูการตั้งค่าของบล็อก

 

ผมจะแบ่งการตั้งค่าออกเป็น 8 ส่วนดังนี้

1. ขั้นต้น

คุณสามารถดาวน์โหลด Blog เพื่อเก็บเป็น Backup ข้อมูลบทความและ comment ของบล็อกได้โดยเลือก ส่งออกบล็อก

แต่ถ้าคุณมีข้อมูลบล็อกเดิมอยู่แล้วอยากจะนำมาใช้กับบล็อกใหม่ที่สร้างขึ้น ก็ให้เลือก นำเข้าบล็อก 

แต่ถ้าคิดว่าไม่ต้องการใช้บล็อกนี้แล้วก็สามารถลบทิ้งได้โดยเลือก ลบบล็อก

Title และคำอธิบายของบล็อก ควรใส่ให้เข้าใจภาพรวมของบล็อกและมี keyword ในการทำบล็อกแทรกอยู่ใน Description ด้วย

ในส่วนการตั้งค่าอื่น ๆ ควรตั้งค่าดังนี้

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

2. การเผยแพร่  

ในการตั้งค่าส่วนนี้สามารถเปลี่ยน URL ของบล็อกได้

ถ้าคุณต้องการเปลี่ยนโดเมนของบล็อกจาก .blogspot.com เป็นโดเมนอื่นก็สามารถตั้งค่าได้ตรงส่วนนี้ แต่จะต้องเสียค่าใช้จ่ายการจดโดเมนผ่าน google ปีละ 10 US (ประมาณ 300 กว่าบาทต่อปี) เช่นบล็อกของผมเปลี่ยนจาก http://hackublog.blogspot.com เป็นhttp://www.hackublog.com    

3. การจัดรูปแบบ

ในส่วนนี้เป็นการตั้งค่าการเผยแพร่บทความ เช่น จำนวนบทความในหน้าแรก รูปแบบเวลาและวันที่เป็นต้น

คุณควรจะตั้งค่าต่าง ๆ ดังนี้ 

องค์ประกอบ	ตั้งค่าเป็น
แสดงสูงสุด	เท่าไรก็ได้
รูปแบบส่วนหัวของวันที่	ตั้งได้ตามใจชอบ
รูปแบบวันที่ของดัชนีคลังบทความ	ตั้งได้ตามใจชอบ
รูปแบบเวลา	ตั้งได้ตามใจชอบ
โซนเวลา	(GMT+07:00)กรุงเทพ
ภาษา	ไทย
แปลงการขึ้นบรรทัดใหม่	ไม่
แสดงฟิลด์ชื่อเรื่อง	ใช่
แสดงฟิลด์ของลิงก์	ไม่
เปิดใช้การจัดเรียงแบบลอย	ใช่
แม่แบบบทความ	ยังไม่ต้องตั้งค่า

4. เมนูข้อคิดเห็น

เป็นเมนูสำหรับตั้งค่าต่าง ๆ เกี่ยวกับการแสดงความคิดเห็นของบล็อก

 

คุณควรจะตั้งค่าต่าง ๆ ดังนี้

องค์ประกอบ	ตั้งค่าเป็น
ข้อคิดเห็น	แสดง
ใครสามารถแสดงความคิดเห็น	ผู้ใช้ที่มีบัญชี Google
การจัดวางฟอร์มความคิดเห็น	วางไว้ใต้บทความ
ความคิดเห็นเริ่มต้นสำหรับบทความ	บทความใหม่มีความคิดเห็น
ลิงก์ย้อนกลับ	ซ่อน
ค่าเริ่มต้นของลิงก์ย้อนกลับสำหรับบทความ	บทความใหม่มีลิงก์ย้อนกลับ
รูปแบบเวลาในส่วนความคิดเห็น	ตั้งค่าตามใจ
ข้อความของฟอร์มความคิดเห็น	ไม่ต้องใส่ค่าใด ๆ ก็ได้
การจัดการความคิดเห็น	ไม่
แสดงการตรวจสอบคำสำหรับความคิดเห็นหรือไม่	ไม่
แสดงรูปภาพโปรไฟล์บนความคิดเห็นหรือไม่	ใช่
อีเมลสำหรับแจ้งเตือนเมื่อมีความคิดเห็นใหม่	กรอก email ของคุณลงไป

5. เก็บเข้าคลังบทความ

ตั้งให้เป็นรายเดือนจะดีที่สุด

6. ฟีดของไซต์

ถ้าบทความในบล็อกไม่มากนัก ตั้งค่าเป็นแบบเต็ม แต่ถ้าบทความมีประมาณ 100 ขึ้นไปควรจะตั้งเป็นแบบสั้น

ถ้าต้องการทำความเข้าใจเกี่ยวกับฟีดมากขึ้นให้อ่านบทความ ทำความรู้จัก กับ Feed ใน Blogger 

และบทความ FeedBurner ตัวช่วยให้ Feed แรง!!!

7. อีเมลและมือถือ 

ในส่วนนี้เป็นการตั้งค่า อีเมลเพื่อให้ระบบส่งบล็อกของคุณทุกครั้งที่มีการเผยแพร่  และเป็นการตั้งค่า การใช้อุปกรณ์เคลื่อนที่ในการเขียนบล็อก ตรงนี้ผมยังไม่เคยลองเหมือนกัน ถ้าสนใจลองศึกษาเพิ่มเติมที่ เรียนรู้เพิ่มเติมเกี่ยวกับโทรศัพท์มือถือ

8. OpenID

คุณสามารถใช้ OpenID URL เพื่อเข้าสู่ไซต์อื่นๆ ที่ใช้งาน OpenID นอกจากนี้คุณยังสามารถกำหนดให้ผู้ใช้ OpenID สามารถแสดงความคิดเห็นในบล็อกของคุณ โดยปรับการตั้งค่า ความคิดเห็น ของคุณ เรียนรู้เพิ่มเติม เกี่ยวกับ OpenID

ตัวอย่าง URL ของ OpenID ของผม http://www.hackublog.com

9. สิทธิ์

 

ในส่วนนี้คุณสามารถใช้ในการเปลี่ยนผู้เขียนบล็อก และเพิ่มผู้ดูแลระบบได้ถึง 100 ราย

สำหรับวิธีการทำให้ศึกษาจากบทความ วิธีย้าย Blogger จากบัญชีผู้ใช้หนึ่งไปสู่บัญชีผู้ใช้อื่น

นอกจากนี้คุณยังจำกัดคนเข้าชมบล็อกได้ด้วย โดยการระบุ Email ของผู้ที่ต้องการลงไป

ลองศึกษาการตั้งค่าเหล่านี้ดูนะครับ แล้วจะพบว่าทำได้ไม่ยุ่งยากเลย สวัสดีครับ

การปรับเปลี่ยน แม่แบบ

การใช้ เครื่องมือออกแบบแม่แบบ ทำได้โดย Log in เข้าไปที่ draft.blogger และไปที่ แผงควบคุม >>รูปแบบ  >>  องค์ประกอบของหน้า >> คลิกที่ “เครื่องมือออกแบบแม่แบบ” 

  

เมื่อคลิกที่ “เครื่องมือออกแบบแม่แบบ” แล้วเราจะพบเครื่องมือสำหรับออกแบบแม่แบบอยู่ 4 อย่างด้วยกัน ได้แก่  1. แม่แบบ  2. พื้นหลัง  3. รูปแบบ  และ 4. ขั้นสูง


  



1. การใช้งานเครื่องมือแม่แบบ

การใช้เครื่องมือแม่แบบทำได้โดย คลิกที่ข้อความ แม่แบบ >> จากนั้นเลือกรูปแบบที่ต้องการ >> และเลือก theme ที่ต้องการ เมื่อแสดงตัวอย่างเป็นที่น่าพอใจแล้ว ให้คลิกที่ปุ่ม “ใช้กับบล็อก”เพื่อยืนยัน   



2. การใช้งานเมนูพื้นหลัง การใช้งานเครื่องมือ “พื้นหลัง” สามารถใช้เพื่อเปลี่ยนภาพพื้นหลังของบล็อก และเลือกสี Theme ของบล็อกได้ตามความต้องการได้ด้วย  



2.1 วิธีเปลี่ยนภาพพื้นหลังทำได้โดย คลิกที่ “ภาพพื้นหลัง” และเลือกถาพตามต้องการ และกดปุ่ม“ใช้กับบล็อก” เพื่อยืนยัน 






2.2 การเลือกสี Theme ของบล็อก คลิกที่สี Theme ที่ต้องการโดย อาจจะคลิกเลือกจาก Theme สำเร็จรูปหรือเลือกจาก Theme ที่แนะนำ

 



3. การใช้งานเครื่องมือ “รูปแบบ” : คุณสามารถใช้เครื่องมือนี้เพื่อกำหนดจำนวน คอลัมน์ รูปแบบคอลัมน์ ความกว้างของคอลัมน์ รวมถึงการกำหนดคอลัมน์ให้กับส่วนท้ายของหน้าได้ด้วย 



3.1 การใช้งานเครื่องมือ “การออกแบบเนื้อความ” : เครื่องมือนี้ใช้กำหนดรูปแบบคอลัมน์ของ template ของคุณ ซึ่งทำได้ง่ายดายโดยการคลิกเลือกรูปแบบที่ต้องการ ดูตัวอย่าง เมื่อเป็นที่พอใจแล้วก็กดปุ่ม “ใช้กับบล็อก” เพื่อยืนยัน  





3.2 การใช้งานเครื่องมือ “การออกแบบส่วนท้าย” : เครื่องมือนี้เป็นเครื่องมือสำหรับการกำหนดคอลัมน์ให้กับส่วนท้ายของหน้าบล็อก ซึ่งทำได้เช่นเดียวกับ 3.1 




3.3 การใช้งานเครื่องมือ “การปรับความกว้าง” : คุณสามารถปรับความกว้างของแม่แบบ และ sidebar จากเครื่องมือนี้เพียงแค่เลื่อน slider ให้ตรงกับค่าตัวเลขที่ต้องการเท่านั้น 


  


4. สำหรับเมนูขั้นสูงเป็นการกำหนดรายละเอียดต่าง ๆ ให้กับบล็อก เช่น รูปแบบของลิงค์  gadget ต่าง ๆ  หัวเรื่อง  ชื่อของบล็อก เป็นต้น ซึ่งคุณสามารถปรับแต่งตามความต้องการแล้ว แสดงตัวอย่าง  หากเป็นที่พอใจก็บันทึกเช่นเดียวกับ ข้อ 1-3 ที่ได้กล่าวมาแล้ว




หวังว่าเครื่องมือนี้น่าจะเป็นที่ชื่นชอบของหลาย ๆ ท่านที่ต้องการปรับแต่ง Template ให้ถูกใจตามสไตล์ของคุณเองมากขึ้นนะครับ ขอจบบทความอีกหนึ่งเทคนิควิธีในการปรับแต่งและใช้งาน blogger อีก 1 บทความเพียงเท่านี้ครับ หากมีเรื่องดี ๆ ก็จะเอามาเล่าสู่กันฟังอีกครั้งครับ