1 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์
การปรับ แต่ ง ขนาดและกราฟิ กหลั พื้ นง Blogger โดยนายวาที ศ รี ผิ ว รหั ส 5211308241
รายงานนี้คอื บันทึกความรู้เรื่องการปรับแต่ง การจัดการบริหารเว็บบล็อก (Blogger) ในฐานะ ผู้จัดการระบบ (Admin) Google Blogger Domain & Hosting ที่ blogspot.com โดยจะอธิบาย รายละเอียดขั้นตอนดังต่อไปนี้ ขั้นตอนการใช้งาน Blogger นั้น สิ่งสาคัญอันดับแรกต้องมีการสมัคร Gmail เสียก่อนจึงจะ สามารถใช้งาน Blogger ได้ วิธีการสมัคร Gmail ให้เข้าไปที่ www.gmail.com
1
2
ภาพที่ 1 แสดงหน้าเว็บของ www.gmail.com ที่มา: www.gmail.com, 2556
ขั้น ตอนการ เรี ย นรู้ ก าร ใช้ งานBlogger หมายเลข 1 กรณีทยี่ ังไม่มี Gmail สามารถคลิกสร้างบัญชีได้ในมุมขวาด้านบน และกรอก ข้อมูลทีบ่ ัญชีได้ให้ไว้ให้ครบ หมายเลข 2 ถ้ามี Gmail เป็นของตนเองแล้วสามารถใช้ Gmail ลงชื่อเข้าใช้งานได้ทันที
นายวาที ศรีผวิ วั นพุธที่ 3 กรกฎาคม พ.ศ. 2556
2 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์
ขั้นตอนต่อไปเมือ่ สมัคร Gmail เสร็จเรียบร้อยแล้ว ให้เข้าไปที่ www.blogger.com แล้ว สามารถลงชื่อเข้าใช้งานได้ทันที เมือ่ ลงชื่อเข้าใช้เสร็จเรียบร้อยแล้วระบบจะเข้าไปสู่หน้า home โดย รายละเอียดขั้นตอนการใช้งานมีดงั ต่อไปนี้ 3 4 6 5 7
8 9
ภาพที่ 2 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผวิ , 2556
ขั้น ตอนการ เรี ย นรู้ ก าร ใช้ งานBlogger หมายเลข 3 แสดงชื่อบล็อคของผู้ใช้ ในทีน่ ี้ชื่อบล็อคของผู้ใช้คอื watee sripew หมายเลข 4 แสดงปุม่ เปลี่ยนภาษา ในทีน่ ี้สามารถทีจ่ ะเปลี่ยนภาษาได้หลายประเทศได้ตาม ความต้องการ หมายเลข 5 สามารถเพิม่ บล็อคได้มากกว่า 1 บล็อค ในขณะทีเ่ ราสามารถใช้ Gmail หรือ ชื่อบัญชีเดิมในการลงชื่อเข้าใช้ได้ หมายเลข 6 เมือ่ คลิกทีเ่ พิม่ บล็อคแล้ว จะมีหน้าต่างขึ้นมาให้ใส่รายละเอียดหัวข้อของบล็อค หมายเลข 7 ทีอ่ ยู่โดเมนของ blogger หรือ ชื่อบล็อคของตนเอง หมายเลข 8 Template หรือ แม่แบบของ blogger โดยสามารถเลือกจาก blogger หรือ สามารถ Download จากเว็บไซต์ทวั่ ไปได้ หมายเลข 9 เมือ่ ใส่รายละเอียดเรียบร้อยแล้ว คลิกทีส่ ร้างบล็อค รอสักครู่บล็อคทีเ่ พิม่ มาใหม่ ก็จะปรากฎ
นายวาที ศรีผวิ วั นพุธที่ 3 กรกฎาคม พ.ศ. 2556
3 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์
ขั้นตอนต่อไปเมือ่ ทราบถึงภาพรวมของบล็อคแล้วเราจะเข้าสู่กระบวนการศึกษารายละเอียดของ หน้าทีแ่ ต่ละคาสั่งของ blogger 10
13 11
12
ภาพที่ 3 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผวิ , 2556
ขั้น ตอนการ เรี ย นรู้ ก าร ใช้ งานBlogger หมายเลข 10 link ทีเ่ ชื่อมโยงไปถึง Google plus หมายเลข 11 สามารถคลิกดูโปรไฟล์ของเราใน Google plus ได้โดย Google plus จะ เชื่อมโยงเข้ากับ blogger อัตโนมัติ หมายเลข 12 แสดงปุม่ คลิกดูบล็อค เมือ่ เราต้องการเข้าไปดูเว็บบล็อคนั้นๆ หมายเลข 13 คลิกทีส่ ร้างโพสใหม่ เมือ่ เราต้องการทีจ่ ะเขียนบทความอัพเดทบล็อค อาจเป็น รายงานหรือบทความบันทึกเรื่องในแต่ละวันก็ได้
นายวาที ศรีผวิ วั นพุธที่ 3 กรกฎาคม พ.ศ. 2556
4 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์
14
18 17 19
15
21 16 ภาพที่ 4 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผวิ , 2556
ขั้น ตอนการ เรี ย นรู้ ก าร ใช้ งานBlogger หมายเลข 14 ชื่อหัวข้อของบทความทีเ่ ราเขียน เช่น โครงการพัฒนาชุมชน...เป็นการบอก หัวข้อเพือ่ การดูข้อความง่ายยิ่งขึ้น หมายเลข 15 HTML ในทีน่ ี้เราสามารถ Link เข้ากับ www.Issuu.com (คือเว็บหนังสือ อนไลน์ทสี่ ามารถอ่านฟรี ) ได้โดยสามารถโพสต์หนังสือออนไลน์ได้ในบล็อค แต่ตอ้ งสมัคร Issuu ก่อน จึงจะสามารถอัพโหลดได้ หมายเลข 16 หน้ากระดาษทีจ่ ะเขียนบทความนั้นๆ หมายเลข 17 แถบเครื่องมือในการเขียนบทความ หมายเลข 18 ปุม่ บันทึกข้อความ หมายเลข 19 คลิกเผยแพร่บทความ บทความจะถูกเผยแพร่ตอ่ สาธารณะชน หมายเลข 20 หน้าแสดงตัวอย่างก่อนเผยแพร่ สามารถแก้ไขหรือดูการวางหน้ากระดาษก่อน เผยแพร่ได้ หมายเลข 21 แถบเครื่องมือการตัง้ ค่าโพสต์ในแต่ละบทความ
นายวาที ศรีผวิ วั นพุธที่ 3 กรกฎาคม พ.ศ. 2556
20
5 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์
22
23
24 25
ภาพที่ 5 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผวิ , 2556
ขั้น ตอนการ เรี ย นรู้ ก าร ใช้ งานBlogger หมายเลข 22 แทรกรูปภาพ เมือ่ เราต้องการเขียนบทความโดยทีต่ อ้ งการเสนอรูปภาพควบคู่ ไปด้วย โดยสามารถปรับขนาดได้ตามความต้องการ หมายเลข 23 แทรกวีดโี อ เมือ่ ต้องการอัพเดทคลิปวีดโี อ หรือสื่อการสอนแบบ Multimedia หมายเลข 24 ลบการจัดรูปแบบ เราอาจชอบบทความจากเว็บบล็อคอืน่ หรืออาจ Copy บทความทีเ่ กีย่ วกับสายงานของเรามาเสนอใน blogger ของเราจาเป็นต้องลบการจัดรูปแบบเสียก่อน เพราะขนาดทีเ่ ราไป Copy มานั้นจะไม่ได้ขนาดตัวอักษรของ blogger หมายเลข 25 ตาแหน่งทีต่ งั้ เมือ่ เราต้องการโพสต์บอกตาแหน่งทีเ่ ราอยู่ขณะการเขียน บทความนั้นๆ
นายวาที ศรีผวิ วั นพุธที่ 3 กรกฎาคม พ.ศ. 2556
6 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์
26 27 31
28
32
29 30
ภาพที่ 6 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผวิ , 2556
ขั้น ตอนการ เรี ย นรู้ ก าร ใช้ งานBlogger หมายเลข 26 ภาพรวมสถิตขิ องการดูหน้าเว็บบล็อค หมายเลข 27 บทความทัง้ หมดของเราทีเ่ ผยแพร่ หมายเลข 28 บอกสถิตขิ องยอดการดูหน้าเว็บในแต่ละช่วง มีทงั้ การดูหน้าเว็บของเดือนที่ แล้ว หรือสัปดาห์ทแี่ ล้ว หรือในแต่ละวัน ซึ่งสามารถบอกได้อกี ว่าบทความไหนทีเ่ ราโพสต์มกี ารดูเป็น จานวนมากทีส่ ุด หมายเลข 29 เมือ่ เราสร้างบล็อคแล้วสามารถหารายได้จาก Google Adsense ได้อกี ด้วย แต่ทงั้ นี้บทความแรกของเราควรจะเป็นภาษาอังกฤษในเว็บบล็อค หมายเลข 30 รูปแบบการจัดหน้าเว็บบล็อค เมือ่ เราคลิกเข้าไปแล้วสามารถจัดรูปแบบหน้า เว็บได้ตามความต้องการ หมายเลข 31 แสดงหน้ารูปแบบการจัดหน้าเว็บบล็อค โดยสามารถแก้ไขหน้าเว็บได้ตาม ความต้องการ หมายเลข 32 เราสามารถเพิม่ Gadget ได้ตามความต้องการ ไม่ว่าจะเป็นนาฬิ กา หรือสถิติ ของการดูหน้าเว็บ เราก็สามารถเพิม่ ได้ทตี่ รงส่วนนี้
นายวาที ศรีผวิ วั นพุธที่ 3 กรกฎาคม พ.ศ. 2556
7 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์
36 33
35
37
34 38 ภาพที่ 7 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผวิ , 2556
ขั้น ตอนการ เรี ย นรู้ ก าร ใช้ งานBlogger หมายเลข 33 การแก้ไขแม่แบบของหน้าเว็บบล็อคซึ่งมี แม่แบบให้เลือกในหลายรูปแบบ หมายเลข 34 แสดงแม่แบบต่างๆ ในblogger หมายเลข 35 ปรับแต่ง Template บนมือถือ หมายเลข 36 เมือ่ เรามีความต้องการในการเปลี่ยน Template ของ blogger สามารถคลิก ได้ทตี่ รงส่วนนี้ สารอง/กูค้ นื เราสามารถหา Template ต่างๆได้ตามความต้องการ เพียงเข้าไปทีเ่ ว็บ www.btemplates.com/ Download ได้ฟรี หมายเลข 37 เมือ่ เราต้องการเปลี่ยนแต่กลัวข้อมูลบทความต่างๆจะหาย สามารถดาวน์โหลด เทมเพลตแบบเต็มไปสารองไว้กอ่ นได้ เมือ่ มีอะไรผิดพลาดเราก็สามารถเปลี่ยน Template blogger กลับมาเหมือนอันเดิมได้ หมายเลข 38 คลิกเลือกไฟล์ กรณีถ้าเปลี่ยน Template blogger จะต้องเลือกไฟล์ .xml ในการเปลี่ยนแปลง blogger
นายวาที ศรีผวิ วั นพุธที่ 3 กรกฎาคม พ.ศ. 2556
8 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์
ขั้นตอนต่อไปจะเป็นการกาหนดค่า Template blogger โดยการกาหนดค่านี้สามารถทาได้ เฉพาะกับ Template blogger ทีม่ ใี ห้เปลี่ยนใน blogger ถ้ากรณีเป็น Template blogger ทีด่ าวน์ โหลดมานั้นไม่สามรถปรับแต่งเองได้ แต่สามารถเข้าไปแก้ไขโค้ด HTML ต่างๆเพิม่ เติมได้ ดังนั้น ขั้นตอนต่อไปนี้คอื การจัดการบริหาร blogger ในแบบละเอียด 40 39 41 42
43
ภาพที่ 8 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผวิ , 2556
ขั้น ตอนการ เรี ย นรู้ ก าร ใช้ งานBlogger หมายเลข 39 พืน้ หลังของ blogger สามารถปรับเปลี่ยนได้ตามความต้องการ หรือสามารถ เลือกภาพของคุณเองจากคอมพิวเตอร์ แต่ตอ้ งอยู่ในขนาดของ blogger หมายเลข 40 แสดงภาพพืน้ หลังหลายๆหมวด ไม่ว่าจะเป็นหมวดนามธรรม หมวดศิลปะหรือ หมวดอืน่ ๆ สามารถปรับเปลี่ยนภาพพืน้ หลังได้ตามความต้องการ หมายเลข 41 เมือ่ เปลี่ยนอะไรก็ตามใน blogger แล้ว ขั้นตอนสุดท้ายต้องคลิก ใช้กบั บล็อค เป็นขั้นตอนสุดท้ายของการปรับเปลี่ยนด้วย หมายเลข 42 ปรับความกว้างหน้าเว็บบล็อค หมายเลข 43 ความกว้างของหน้าเว็บบล็อคเวลาแสดงบทความและเขียนบทความ ควรปรับ ให้ได้ 980px 330px เพือ่ ทีเ่ วลาโพสต์บทความจะได้ขนาดตามความเหมาะสมมากทีส่ ุด
นายวาที ศรีผวิ วั นพุธที่ 3 กรกฎาคม พ.ศ. 2556
9 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์
45 47
44
48
46
ภาพที่ 9 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผวิ , 2556
ขั้น ตอนการ เรี ย นรู้ ก าร ใช้ งานBlogger หมายเลข 44 รูปแบบการจัดวางคอลัมม์ของ blogger หรือองค์ประกอบหน้าเว็บ มีทงั้ 1 คอลัมม์ 2 คอลัมม์ และอืน่ ๆ หมายเลข 45 คอลัมม์การจัดรูปแบบของ blogger ส่วนมากจะใช้ 2 คอลัมม์เพือ่ ง่ายต่อการ อ่านทัง้ นี้ขึ้นอยู่กบั ความชอบส่วนตัวหรือ design ใหม่ๆ ก็เป็นได้ หมายเลข 46 แสดงภาพขั้นตอนการแก้ไขเปลี่ยนแปลง blogger เพือ่ ทีจ่ ะได้เห็นภาพก่อน การเปลี่ยนแปลงจริง หมายเลข 47 กลับสู่ blogger เมือ่ ต้องการย้อนกลับไปสู่หน้า home อีกครั้ง หมายเลข 48 Preview blogger ดูบล็อคได้หลังจากการเปลี่ยนแปลง blogger
นายวาที ศรีผวิ วั นพุธที่ 3 กรกฎาคม พ.ศ. 2556
10 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์
50
51
49
53 52
53
54
55
56
ภาพที่ 10 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผวิ , 2556
ขั้น ตอนการ เรี ย นรู้ ก าร ใช้ งานBlogger หมายเลข 49 เครื่องมือออกแบบเทมเพลตขั้นสูง จะเป็นการออกแบบตัวอักษรหรือเปลี่ยน ตัวอักษรตามทีเ่ ราต้องการ หมายเลข 50 แถบเครื่องมือข้อความหน้าเว็บ หมายเลข 51 แบบอักษรทีม่ มี าให้ใน blogger สามารถปรับเปลี่ยนได้ตามความต้องการ หมายเลข 52 ขนาดของตัวอักษรทีจ่ ะใช้แสดง หมายเลข 53 แถบสีของตัวอักษร หมายเลข 54 ขั้นตอนการเปลี่ยนสีของพืน้ หลัง หมายเลข 55 พืน้ หลังส่วนนอก สามารถปรับเปลี่ยนสี หรือปรับแบบโปร่งแสงได้ เพือ่ ให้เห็น พืน้ หลังรูปภาพแบบชัดเจน หมายเลข 56 พืน้ หลังส่วนหัว สามารถปรับเปลี่ยนสี หรือปรับแบบโปร่งแสงได้ เพือ่ ให้เห็น พืน้ หลังรูปภาพแบบชัดเจน หมายเลข 57 พืน้ หลังของบทความ สามารถปรับเปลี่ยนสี หรือปรับแบบโปร่งแสงได้ เพือ่ ให้ เห็นบทความในแบบทีช่ ัดเจนมากยิ่งขึ้น โดยในส่วนของหัวข้ออืน่ ๆ มีการปรับเปลี่ยนทีเ่ หมือนกัน สามารถทดลองใช้งานเองได้
นายวาที ศรีผวิ วั นพุธที่ 3 กรกฎาคม พ.ศ. 2556
11 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์
59
60
58 61
ภาพที่ 11 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผวิ , 2556
ขั้น ตอนการ เรี ย นรู้ ก าร ใช้ งานBlogger หมายเลข 58 ขั้นตอนการตัง้ ค่าต่างๆ ใน blogger หมายเลข 59 ชื่อบล็อคทีส่ ามารถแก้ไขเพิม่ เติมได้ หมายเลข 60 คาอธิบายเว็บบล็อคเพือ่ ให้ผู้อา่ นทีเ่ ข้ามาอ่านบทความได้เข้าใจจุดประสงค์ของ blogger ทีต่ อ้ งการนาเสนอได้มากยิ่งขึ้น หมายเลข 61 สิทธ์ในการเป็นแอดมินร่วม สามารถเพิม่ ผู้เขียนโดยใส่ทอี่ ยู่ Gmail จากนั้นทัง้ คนสร้างบล็อคและคนถูกเชิญสามารถเข้ามาแก้ไข blogger ของตนเองได้เหมือนกัน
นายวาที ศรีผวิ วั นพุธที่ 3 กรกฎาคม พ.ศ. 2556
12 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์
รายงานสรุปวิชา : ARTI3319 เทคโนโลยีเพือ่ การออกแบบนิเทศศิลป์ รายงาน : การปรับแต่งขนาดกราฟิกและพืน้ หลัง blogger จัดทาโดย นายวาที ศรีผิว รหัสนักศึกษา 5211308241 กลุ่มเรียน 201 คณะมนุษยศาสตร์และสังคมศาสตร์ สาขาวิชาออกแบบนิเทศศิลป์ Contact E-mail: wateesripwe@gmail.com Publish Google plus: https://plus.google.com/107205725546907893337/posts โดย นายวาที ศรีผวิ 3 กรกฎาคม 2556
นายวาที ศรีผวิ วั นพุธที่ 3 กรกฎาคม พ.ศ. 2556