1 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
คานา Blogger คือเว็บไซต์ที่เจ้าของสามารถบันทึกเรื่องราวของตนเองลง ในเว็บได้ตลอดเวลาการ สร้างเว็บบล็อก สามารถทาได้ง่ายไม่ซับซ้อน และภายระบบการจัดการบริหารเว็บไซต์พื้นฐานให้ เช่น เครื่องมือสาหรับเขียนเรื่อง โพสรูป จัดหมวดหมู่ ฯล รายงานเล่มนี้ จัดทาขึ้นเพื่อรวบรวมหลักฐาน กระบวนการศึกษาและการตกแต่ง Blogger อันเป็นเนื้อหาที่ผ่านกระบวนการเรียนการสอนในรายวิชาของ เทคโนโลยีเพื่อการออกแบบนิเทศศิลป์ ( Arti3319 ) สอนโดย ผศ.ประชิด ทิณบุตร หากเนื้อหาในรายงานมีความผิดพลาดประการใดทาง ผู้จัดทาต้องขออภัยมา ณ ที่นี้ด้วย โดย นายวาที ศรีผิว 20 สิงหาคม 2556
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
2 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
ทาความรู้จักกับ Blogger 1. เป้าหมายในการทา Blogger Blogger คืออะไร มาจากไหน Blogger เป็นอีกหนึ่งบริการของ Google ที่จะช่วยให้คุณมี พื้นที่สาหรับเขียนเรื่องราวต่างๆ ที่คุณต้องการในลักษณะของ Weblog ได้อย่างมากมาย บริการ เหล่านี้คุณสามารถใช้งานได้ฟรี โดยไม่มีค่าใช้จ่ายใดๆ ทั้งสิ้น สาหรับคนที่อยากมีเว็บไซต์ส่วนตัวแต่ไม่ อยากมีค่าใช้จ่าย Blogger ช่วยคุณได้ Blogger เพียงแค่สมัคร Gmail ก็สามารถสร้าง Blog ได้อย่างมากมาย นอกจากนี้การสร้าง Blog ด้วย Blogger นั้นเชื่อมโยงพื้นที่เก็บรูปภาพเข้ากับ Picasa ซึ่งเป็นบริการด้านภาพถ่าย ทาให้ คุณมีพื้นที่เขียน blog และพื้นที่เก็บรูปภาพที่สัมพันธ์กัน 1.1 Webblog กับ Website ต่างกันอย่างไรต่างกันตรงที่ Website ต้องมี Domain Name และ Hosting เป็นของตนเองและจะต้องเสียค่าใช้จ่าย ส่วน Webblog นั้นเราสามารถ สมัครใช้บริการได้ฟรีแต่เราต้องใช้ Domain ของผู้ให้บริการ Webblog นั้นๆอยู่ในชื่อ domain ของตัวเราด้วย เช่น http://arti3319-watee.blogspot.com/ เป็นต้น 1.2 Webblog นั้นมี template ให้เลือกโดยการเขียน blog ก็จะมีโครงสร้างที่ตายตัวไม่ สามารถปรับเปลี่ยนได้มากนักหากคุณต้องการเขียนเองต้องเรียนรู้ภาษาคอมพิวเตอร์ หลายภาษาอยู่พอสมควร แต่คุณเพียงแค่เรียนรู้การใช้งานเล็กน้อยคุณก็สามารถใช้งาน Webblog ได้ตามต้องการ
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
3 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
2. Webblog สามารถทาอะไรได้บ้าง Webblog นั้นสามารถทาอะไรได้หลายอย่างมากมาย โดยจะจาแนกข้อดีหลักๆ ของการทา Blogger มาเป็นตัวอย่างดังนี้ 2.1 ทาเป็นเว็บไซต์ส่วนตัว 2.2 เขียนเรื่องราวต่าง ๆ และแบ่งปันให้กับผู้อื่น 2.3 หารายได้กับ google เช่น การเขียนบทความ และนาโฆษณาของ google มาติดลง webblog ของตนเอง 2.4 ทาธุรกิจที่เรียกว่า E-commerce ก็พอจะใช้ได้อยู่บ้าง
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
4 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
การปรับแต่งขนาดและกราฟิกพื้นหลัง 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 ลงชื่อเข้าใช้งานได้ทันที
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
5 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
ขั้นตอนต่อไปเมื่อสมัคร 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 เมื่อใส่รายละเอียดเรียบร้อยแล้ว คลิกที่สร้างบล็อค รอสักครู่บล็อคที่เพิ่มมาใหม่ ก็จะปรากฎ
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
6 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
ขั้นตอนต่อไปเมื่อทราบถึงภาพรวมของบล็อคแล้วเราจะเข้าสู่กระบวนการศึกษารายละเอียดของ หน้าที่แต่ละคาสั่งของ 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 คลิกที่สร้างโพสใหม่ เมื่อเราต้องการที่จะเขียนบทความอัพเดทบล็อค อาจเป็น รายงานหรือบทความบันทึกเรื่องในแต่ละวันก็ได้
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
7 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
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 แถบเครื่องมือการตั้งค่าโพสต์ในแต่ละบทความ
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
20
8 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
22
23
24 25
ภาพที่ 5 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผิว, 2556
ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 22 แทรกรูปภาพ เมื่อเราต้องการเขียนบทความโดยที่ต้องการเสนอรูปภาพควบคู่ ไปด้วย โดยสามารถปรับขนาดได้ตามความต้องการ หมายเลข 23 แทรกวีดีโอ เมื่อต้องการอัพเดทคลิปวีดีโอ หรือสื่อการสอนแบบ Multimedia หมายเลข 24 ลบการจัดรูปแบบ เราอาจชอบบทความจากเว็บบล็อคอื่น หรืออาจ Copy บทความที่เกี่ยวกับสายงานของเรามาเสนอใน blogger ของเราจาเป็นต้องลบการจัดรูปแบบเสียก่อน เพราะขนาดที่เราไป Copy มานั้นจะไม่ได้ขนาดตัวอักษรของ blogger หมายเลข 25 ตาแหน่งที่ตั้ง เมื่อเราต้องการโพสต์บอกตาแหน่งที่เราอยู่ขณะการเขียน บทความนั้นๆ
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
9 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
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 ได้ตามความต้องการ ไม่ว่าจะเป็นนาฬิกา หรือสถิติ ของการดูหน้าเว็บ เราก็สามารถเพิ่มได้ที่ตรงส่วนนี้
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
10 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
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
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
11 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
ขั้นตอนต่อไปจะเป็นการกาหนดค่า 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 เพื่อที่เวลาโพสต์บทความจะได้ขนาดตามความเหมาะสมมากที่สุด
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
12 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
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
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
13 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
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 พื้นหลังของบทความ สามารถปรับเปลี่ยนสี หรือปรับแบบโปร่งแสงได้ เพื่อให้ เห็นบทความในแบบที่ชัดเจนมากยิ่งขึ้น โดยในส่วนของหัวข้ออื่นๆ มีการปรับเปลี่ยนที่เหมือนกัน สามารถทดลองใช้งานเองได้
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
14 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
59
60
58 61
ภาพที่ 11 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผิว, 2556
ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 58 ขั้นตอนการตั้งค่าต่างๆ ใน blogger หมายเลข 59 ชื่อบล็อคที่สามารถแก้ไขเพิ่มเติมได้ หมายเลข 60 คาอธิบายเว็บบล็อคเพื่อให้ผู้อ่านที่เข้ามาอ่านบทความได้เข้าใจจุดประสงค์ของ blogger ที่ต้องการนาเสนอได้มากยิ่งขึ้น หมายเลข 61 สิทธ์ในการเป็นแอดมินร่วม สามารถเพิ่มผู้เขียนโดยใส่ที่อยู่ Gmail จากนั้นทั้ง คนสร้างบล็อคและคนถูกเชิญสามารถเข้ามาแก้ไข blogger ของตนเองได้เหมือนกัน
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
15 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
กระบวนการขั้นตอนต่อไปจะเป็นการแสดงขั้นตอนการเขียนบทความ และการนารูปภาพ และวีดีโอต่างๆ หรือ Embed code จาก www.issuu.com (หนังสือออนไลน์) มาใส่ในโพสต์ในแต่ ละบทความซึ่งจะมีขั้นตอนการทาดังนี้ ขั้นตอนแรกจะเป็นการนา ลิงค์วีดีโอมาใส่ในบทความของเรา 62 64 65 63 66
67
ภาพที่ 12 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผิว, 2556
ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 62 คือปุ่มแสดงสัญลักษณ์การแทรกวีดีโอลงในบทความ หมายเลข 63 ภาพแสดงวีดีโอที่แทรกเข้ามาในบทความของโพสต์นั้นๆแล้ว หมายเลข 64 ป้ายกากับคาค้นหาของบทความใน Blogger ซึ่งสามารถแยกเป็นกลุ่มในแต่ละ หมวดได้ เช่น หมวดของบทความ , หมวดของวีดีโอสื่อการสอน เพื่อให้ผู้ที่เข้ามาอ่านได้ค้นหาได้ง่าย และสะดวกมากยิ่งขึ้น หมายเลข 65 ปุ่ม HTML เอาไว้สาหรับแก้ไขโค๊ดต่างๆ ซึ่งเป็นภาษาของ Web หมายเลข 66 แสดงภาพหน้าของ HTML ซึ่งเมื่อมีการอัพโหลดวีดีโอลงไปแล้ว ต้องมีการ แก้ไขวีดีโอให้มีขนาดเท่ากับหน้าบทความ ขนาดควรจัดอยู่ที่ width="575" height="350" ซึ่งตรงนี้ ควรใช้การดูภาษาของ web ให้ดี หมายเลข 67 แสดงภาพขนาดของวีดีโอเมื่อถูกปรับขนาดเป็น width="575" height="350"
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
16 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
เมื่อเรียนรู้ขั้นตอนการโพสต์วีดีโอและปรับขนาดให้ได้ตามอัตราส่วนที่ต้องการแล้ว มาถึง กระบวนการอัพโหลดหนังสือออนไลน์จากเว็บไซต์ชื่อดัง www.issuu.com โดยเว็บไซต์นี้สามารถอ่าน หนังสือที่เราสนใจ หรือเนื้อหาที่เราต้องการแบบฟรีไม่มีค่าใช้จ่าย เพียงแค่เราสมัครใช้ก็สามารถนา เนื้อหาที่เราสนใจมาไว้ใน Blogger ได้ตามที่เราต้องการ
68
71
70
69
72
73
ภาพที่ 13 แสดงหน้าเว็บของ http://issuu.com/ ที่มา: http://issuu.com/, 2556
ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 68 ช่องค้นหาหนังสือออนไลน์ หมายเลข 69 ถ้ามี Facebook อยู่แล้ว ก็สามารถลงชื่อเข้าใช้ได้จาก Username / password จาก Facebook ได้ทันที หมายเลข 70 ปุ่มแสดงสมัครลงชื่อเข้าใช้งาน หมายเลข 71 แสดงภาพหน้าต่างของ www.issuu.com เมื่อลงชื่อเข้าใช้งานแล้ว หมายเลข 72 ปุ่มอัพโหลดหนังสือออนไลน์ของตัวเอง ซึ่งต้องแปลงเป็นไฟล์ Pdf แล้วรวมทุก หน้าให้อยู่ในไฟล์เดียว จึงจะสามารถอัพโหลดลงใน www.issuu.com ได้ หมายเลข 73 หน้าโปรไฟล์ของตัวเอง
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
17 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
เมื่อเราทาการลงชื่อเข้าใช้เรียบร้อยแล้ว ให้เรานาหนังสือออนไลน์โดยเปิดตัวหนังสือที่ ต้องการจะนามาเป็นเนื้อหาในโพสต์ของบทความมาห่อน
74
75 76 ภาพที่ 14 แสดงหน้าเว็บของ http://issuu.com/wateesripew ที่ issuu.com ที่มา: วาที ศรีผิว, 2556
ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 74 ภาพแสดงหนังสือออนไลน์ หมายเลข 75 เมื่อต้องการที่จะนาไปไว้ใน Blogger ต้องกดที่ Share หมายเลข 76 หลังจากนั้นมองหาปุ่ม Embed เพื่อนาโค๊ดไปวางใน Blogger ซึ่งจะอธิบาย ขั้นตอนการเขียนโค๊ดในภายหลัง
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
18 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
77
79 80 81
78
82
83 ภาพที่ 15 แสดงหน้าเว็บของ http://issuu.com/wateesripew ที่ issuu.com ที่มา: วาที ศรีผิว, 2556
ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 77 ภาพแสดงหนังสือออนไลน์ หมายเลข 78 Styling options คือเครื่องมือปรับแต่ง Layout และพื้นหลังในการเลือกสี ต่างๆของหนังสือ หมายเลข 79 Size ขนาดของหนังสือออนไลน์ สามารถปรับได้ตามขนาด หมายเลข 80 Layout คือแถบเครื่องมือเพื่อให้เราเลือกแสดงแบบหน้าคู่ หรือ หน้าเดี่ยว Autoflip the pages เมื่อเลือกแสดงแบบหน้าคู่ ปุ่มนี้คือเครื่องมือที่จะทาให้หนังสือของเราแสดง แบบ Autoplay ใน Blogger อยู่ตลอด หมายเลข 81 Color สามารถเลือกพื้นหลังเป็นสีได้ตามที่เราต้องการ หมายเลข 82 Create new เมื่อตั้งค่าได้ตามความต้องการแล้วกดปุ่มนี้เพื่อ Save หมายเลข 83 Embed code เมื่อตั้งค่าทุกอย่างเสร็จเราคัดลอก Embed code ตรงแถบนี้ ไปวางไว้ในบทความโดยเลือกใช้ช่อง HTML เพื่อวางโค๊ด
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
19 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
84 85
ภาพที่ 16 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผิว, 2556
ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 84 มองหาโค๊ดและปรับขนาดให้ได้ width="575" height="350" ซึ่งสัดส่วน ขนาดตรงนี้ เมื่อตั้งค่าจะพอดีกับหน้าเว็บบล็อคของเรา สามารถใช้ร่วมกับ รูปภาพ วีดีโอ หรือหนังสือ ออนไลน์ ก็ได้ หมายเลข 85 ภาพแสดงผลของเว็บบล็อกเมื่อนาหนังสือออนไลน์มาโพสต์ ซึ่งเราสามารถนา เนื้อหาหนังสือที่เราสนใจมาโพสต์ก็ได้ กรณีที่ยังไม่มีหนังสือของตนเอง
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
20 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
เมื่อได้ทราบถึงขั้นตอนการนา วีดีโอหรือสื่อมัลติมิเดียต่างๆแล้วขั้นตอนต่อไปนี้คือ กระบวนการเขียนบทความที่ไม่ได้อยู่ในโพสต์ แต่เขียนให้อยู่ในหน้าเว็บ โดยสามารถใช้กับเอกสาร สาคัญที่ต้องการให้ผู้อ่านได้เห็นอยู่ตลอด 88
87 86
89
90
ภาพที่ 17 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผิว, 2556
ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 86 เลือกใช้งานหน้าเว็บเพื่อเขียนบทความ หมายเลข 87 ปุ่มหน้าเว็บใหม่ หมายเลข 88 เมื่อกดปุ่มหน้าเว้บใหม่เข้าไปแล้วให้ทาการเลือกที่หน้าเว็บเปล่า หลังจากนั้นก็ จะเป็นการเขียนบทความซึ่งทุกอย่างเหมือนการเขียนบทความทั้งหมด ไม่ว่าจะเป็นการใส่ Code หรือ ปรับขนาดใน HTML ต่างๆ หมายเลข 89 แท็บด้านบนสุด คือแท็บที่จะโชว์บทความไว้ด้านบน หมายเลข 90 เมื่อเขียนบทความเสร็จเรียบร้อยแล้วจะเห็นได้ดังรูป เราสามารถเพิ่มหน้าเว็บ เปล่าได้ตามที่เราต้องการ
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
21 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
ในขั้นตอนต่อไปจะเป็นการเพิ่ม Gadget ในแถบด้านข้างซึ่งเราสามารถนาสิ่งที่เราอยากให้มี ใน Blogger ได้ เช่น นาฬิกา ปฎิทิน หรือ ข่าวสารจากเว็บบล็อคอื่น โดยในขั้นตอนนี้จะยกตัวอย่าง การนานาฬิกามาใส่ใน Gadget
92 91
94
93 95
ภาพที่ 18 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผิว, 2556
ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 91 เลือกใช้งานรูปแบบ หมายเลข 92 หลังจากนั้นเลือกปุ่มเพิ่ม Gadget หมายเลข 93 พอเลือกเพิ่ม Gadget แล้วจะมีหน้าต่างใหม่ขึ้นมามองหา HTML/จาวา สคริปต์ แล้วกดเพิ่ม หมายเลข 94 ให้เขียนชื่อหัวข้อ เช่น นาฬิกา หรือ ปฎิทิน เป็นต้น หมายเลข 95 จากนั้นให้ใส่ Code ตรงส่วนเนื้อหาซึ่งขั้นตอนการทาก็คล้ายคลึงกับการนา หนังสือออนไลน์มาใส่นั้นเอง ซึ่งขนาดตรงส่วนนี้จะอยู่ที่ "width: 276px; height: 186px;"
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
22 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
97
98 96 ภาพที่ 19 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผิว, 2556
ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 96 เมื่อตั้งค่าและใส่เนื้อหาเรียบร้อยแล้ว Gadget ที่เราได้เพิ่มไว้จะอยู่แถบนี้ ทั้งหมดเราสามารถจัดลาดับได้ตามที่เราต้องการ หมายเลข 97 เสร็จแล้วจึงบันทึกการจัดเรียงให้เรียบร้อยแล้วคลิกดูบล็อค หมายเลข 98 โดย Gadget ที่เราเพิ่มจะอยู่ทางด้านขวา นี่คือภาพแสดงตัวอย่างของการนา โค๊ดต่างๆ มาใส่ใน Gadget
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
23 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
มาถึงขั้นตอนที่จะเข้าสู่กระบวนการเปลี่ยน Template ของ blogger ซึ่งเราสามารถที่จะ ปรับเปลี่ยนได้ตามความต้องการ สามารถเข้าไปดาวน์โหลดได้ที่ http://btemplates.com/ หรือ http://www.deluxetemplates.net/ ฟรีไม่มีค่าใช้จ่ายใดๆ
100 0 99
101 0
ภาพที่ 20 แสดงหน้าเว็บบล็อคของ http://arti3319-watee.blogspot.com/ ที่ blogspot.com ที่มา: วาที ศรีผิว, 2556
ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 99 เลือกใช้งานที่แม่แบบ หมายเลข 100 จากนั้นเลือกสารอง/กู้คืนเพื่อที่จะอัพโหลด Template ที่ดาวน์โหลดมา หมายเลข 101 กดเลือกไฟล์ ในที่นี้ไฟล์ที่ใช้จะต้องเป็นไฟล์ .xml เสร็จแล้วจึงอัพโหลด ใน กรณีเมื่อเปลี่ยน Template Blogger แล้วการตั้งค่าต่างๆ ที่เราตั้งค่าไว้ตั้งแต่ต้น เช่น ขนาดรูปภาพ วีดีโอ จะถูก Set ให้เป็นค่าเริ่มต้น และแบบ Template ที่เราไปดาวน์โหลดมาไม่สามารถปรับแต่งใน แม่แบได้ กรณีถ้าจะปรับแต่งต้องอาศัยในการอ่านและเขียนโค๊ดให้มีทักษะพอประมาณ ฉะนั้นถ้าเกิด ดาวน์โหลดมาแล้วแต่อยากกลับไปใช้แบบเดิม ก่อนที่จะเปลี่ยนก็สามารถ กด ดาวน์โหลดเทมเพลต แบบเต็ม ซึ่งจะเป็นเทมเพลตเดิมที่เราใช้อยู่ก่อนหน้าที่จะเปลี่ยนแบบใหม่
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556
24 เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์
รายงานสรุปวิชา : ARTI3319 เทคโนโลยีเพื่อการออกแบบนิเทศศิลป์ รายงาน : การปรับแต่งขนาดกราฟิกและพื้นหลัง blogger จัดทาโดย นายวาที ศรีผิว รหัสนักศึกษา 5211308241 กลุ่มเรียน 201 คณะมนุษยศาสตร์และสังคมศาสตร์ สาขาวิชาออกแบบนิเทศศิลป์ Contact E-mail: wateesripwe@gmail.com Publish Google plus: https://plus.google.com/107205725546907893337/posts โดย นายวาที ศรีผิว 20 สิงหาคม 2556
นายวาที ศรีผิว วันอังคารที่ 20 สิงหาคม พ.ศ. 2556