สื่อการเรียนรู้ขั้นตอนวิธีการใช้ blogger

Page 1

0

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

คู่มือการเรียนรู้การใช้งานบริหารจัดการ Blogger

จัดทาโดย นายณัฐวุฒิ นุชนา รหัสนักศึกษา 5211300552 สาขาศิลปกรรม แขนงออกแบบนิเทศศิลป์ นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


1

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

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

(Blogger) ใน

ฐานะผู้จัดการระบบ (Admin) Gooogle Blogger Domain & Hosting ที่ blogspot.com โดยจะ อธิบายรายละเอียดขั้นตอนดังนี้ ขั้นตอนแรกก่อนที่เราจะสามารถใช้งาน Blogger ได้นั้นเราจะต้องมี gmail ซะก่อนโดยเข้า ไปสมัครได้ที่ www.gmail.com

1

2

ภาพที่ 1 แสดงหน้าเวปของ gmail ที่มา : www.gmail.com, 2556

ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 1 ขั้นแรกเราจะต้องมี gmail ซะก่อนโดยการสมัคร gmail เพื่อการสร้าง Blogger หมายเลข 2 เมื่อทาการสมัคร gmail เรียบร้อยแล้ว เราก็สามารถเข้าสู้ระบบ gmail ได้เลย

นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


2

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

เมื่อเข้าสู่ระบบของ gmail ได้แล้วเราก็สามารถ ทาการสร้าง Blog ได้เลยโดยไม่ต้อง login เข้า Blog เพราะมันเชื่อมต่อกับ gmail อยู่แล้วด้วยการเข้า www.blogger.com เพื่อการสร้าง Blog

3

9

6

7 4 8 5 ภาพที่ 2 แสดงหน้าเว็ปของ http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 3 แสดงชื่อบล็อกของผู้ใช้งาน หมายเลข 4 สามารถสร้าง บล็อก ใหม่ขึ้นมาเพื่อใช้งาน สามารถสร้างได้มากกว่า 1 บล็อก เพื่อการเผยแพร่หลายรูปแบบ หมายเลข 5 เมื่อเคลิ๊กปุ่มบล็อกใหม่ (หมายเลข 4 ) จะปรากฏหน้าต่างใหม่ขึ้นมาเพื่อการตั้ง ค่าบล็อกที่เรากาลังสร้าง หมายเลข 6 ช่องตั้งชื่อบล็อกการใช้งาน หมายเลข 7 ชื่อ Domain ของเราเช่น nattawut.blogspot.com หมายเลข 8 Template หรือ แม่แบบของบล็อกที่เราจะสร้าง

โดยสามารถเลือกจาก

blogger หรือสามารถ Download จากเว็บไซต์ได้ หมายเลข 9 คลิ๊กเพื่อเปลี่ยนภาษา นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


3

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

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

12

11

10

ภาพที่ 3 แสดงหน้าเว็ปบล็อกของ http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 10 ปุ่มแสดงโปรไฟร์ของ Blogger หมายเลข 11 ปุ่มแสดงคลิกดูบล็อก เมื่อเราต้องการเข้าไปดูเว็บบล็อคที่เราสร้างขึ้นมา หมายเลข 12 ปุ่มคลิกเพื่อสร้างโพสใหม่ เมื่อต้องการที่จะเขียนบทค วามอัพเดทบล็อก อาจ เป็นงาน หรืออะไรก็แล้วแต่ที่เราต้องการจะเผยแพร่

นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


4

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

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

13

15

18

16

17

20

19 14 ภาพที่ 4 แสดงการเขียนบทความ http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 13 ชื่อหัวข้อของบทความที่เราเขียน เช่น โครงสร้างคณะมนุษยศาสตร์ เพื่อการดู ข้อความง่ายยิ่งขึ้น หมายเลข 14 หน้ากระดาษที่ใช้เขียนบทความ หมายเลข 15 แถบเครื่องมือต่างๆที่ใช้ในการเขียนบทความ (คล้ายๆกับ Microsoft Office Word) หมายเลข 16 ปุ่มบันทึกบทความ เวลาเราเขียนบทความสามารถกดบันทึกได้เรื่อยๆ เมื่อมี การขัดข้องคอมดับ หรือเว็ปค้างเมื่อเปิดบล็อกเข้ามาใหม่มันจ ะบันทึกบทความที่เรายังไม่ได้บันทึกไว้ โดยอัตโนมัติ หมายเลข 17 หน้าแสดงตัวอย่างก่อนเผยแพร่ สามารถแก้ไขหรือดูการวางหน้ากระดาษก่อน เผยแพร่ได้ หมายเลข 18 คลิกเผยแพร่บทความ บทความจะถูกเผยแพร่ หมายเลข 19 แถบเครื่องมือการตั้งค่าโพสต์ในแต่ละบทความ

นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


5

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

หมายเลข 20 HTML เราสามารถลิงค์เข้ากับ www.Issuu.com (คือเว็บหนังสืออนไลน์ ) ได้ โดยสามารถโพสต์หนังสือออนไลน์ได้ในบล็อค แต่ต้องสมัคร Issuu ก่อนจึงจะสามารถอัพโหลดได้

21

23 22

ภาพที่ 5 แสดงการเขียนบทความ http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 21 แทรกรูปภาพสามารถอัพโหลดจากคอมพิวเตอร์หรือจากที่อื่นๆได้ เมื่อเรา ต้องการเขียนบทความโดยที่ต้องการเสนอรูปภาพค วบคู่ไปด้วย โดยสามารถปรับขนาดได้ตามความ ต้องการ หมายเลข 22 ลบการจัดรูปแบบ เราอาจชอบบทความจากเว็บบล็อคอื่น หรืออาจ Copy บทความที่เกี่ยวกับสายงานของเรามาเสนอใน blogger ของเราจาเป็นต้องลบการจัดรูปแบบเสียก่อน เพราะขนาดที่เราไป Copy มานั้นจะไม่ได้ขนาดตัวอักษรของ blogger หมายเลข 23 แทรกวีดีโอ เมื่อต้องการอัพเดทคลิปวีดีโอ หรือสื่อการสอนแบบ Multimedia

นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


6

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

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

24 รูปแบบ

ภาพที่ 6 แสดงการเข้าสู่รูปแบบ http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

28 27

29

26 25 ภาพที่ 7 แสดงการเพิ่ม Gadget http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


7

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 24 วิธีการเข้าสู่รูปแบบ เพื่อออกแบบบล็อกได้ตามต้องการ หมายเลข 25 แสดงหน้ารูปแบบการจัดหน้าเว็บบล็อค โดยสามารถแก้ไขหน้าเว็บได้ตาม ความต้องการ หมายเลข 26 ปุ่มเพิ่ม Gedget เราสามารถเพิ่ม Gadget ได้ตามความต้องการ เช่นนาฬิกา ปฏิทิน หรือสถิติของการดูหน้าเว็บ เราก็สามารถเพิ่มได้ที่ตรงส่วนนี้ หมายเลข 27 ปุ่มแสดงตัวอย่าง เมื่อเราเพิ่ม Gadget ตามต้องการแล้วเราสามารถแสดง ตัวอย่างก่อนที่เราจะใช้กับบล็อกได้ หมายเลข 28 ปุ่มบันทึกการจัดเรียง หากเรามั่นใจกับการเพิ่ม Gedget แล้วก็กดเพื่อบันทึก การจัดเรียง หมายเลข 29 ปุ่มลบ หากต้องการลบ Gedget ที่ไม่ต้องการออกก็คลิ๊กที่ปุ่มลบ เริ่มต้นด้วยเทมเพลตพื้นฐาน และปรับแต่งพื้นหลัง การออกแบบ สี แบบอักษร และอื่นๆ

30 สารอง/กู้คืน

31

ภาพที่ 8 แสดงการดีไซน์ Blogger http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 30 แสดงปุ่มกู้คืน เมื่อเรามีความต้องการในการเปลี่ยน Template ของ blogger สามารถคลิกได้ที่ตรงส่วนนี้ สารอง

/กู้คืน เราสามารถหา

Template

ต่างๆได้ตามเว็บ

www.btemplates.com/ สามารถ Download ได้ฟรี หมายเลข 31 คลิกเลือกไฟล์ ถ้าเปลี่ยน Template blogger จะต้องเลือกไฟล์ .xml นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


8

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

32 33 34 ภาพที่ 9 แสดงการดีไซน์ Blogger http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

ขัน้ ตอนการเรียนรู้การใช้งาน Blogger หมายเลข 32 การปรับแต่ง Template บนมือถือ หมายเลข 33 การกาหนดค่าแม่แบบของหน้าเว็บบล็อคซึ่งมี แม่แบบให้เลือกในหลายรูปแบบ และสามารถเข้าไปปรับการออกแบบในส่วนอื่นๆได้ หมายเลข 34 แสดงแม่แบบต่างๆ ในblogger

นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


9

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

เริ่มต้นด้วยเทมเพลตพื้นฐาน และปรับแต่งพื้นหลัง การออกแบบ สี แบบอักษร และอื่นๆ ขั้นตอนต่อไปจะเป็นการกาหนดค่า Template blogger โดยการกาหนดค่านี้สามารถทาได้ เฉพาะกับ Template blogger ที่มีให้เปลี่ยนใน blogger เท่านั้น ถ้าเป็น Template blogger ที่ ดาวน์โหลดมาจะไม่สามร ถปรับแต่งได้ แต่สามารถเข้าไปแก้ไขโค้ด HTML ต่างๆเพิ่มเติมได้ ดังนั้น ขั้นตอนต่อไปนี้คือการจัดการบริหาร blogger ในแบบละเอียด

35 กาหนดค่า

ภาพที่ 10 แสดงปุ่มกาหนดค่า http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

39 36

42 37

38

40

41 ภาพที่ 11 แสดงการกาหนดค่า Blogger http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 35 ปุ่มกาหนดค่า Blogger หมายเลข 36 ปุ่มตั้งค่าพื้นหลัง นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


10

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

หมายเลข 37 ปุ่มตั้งค่าความกว้าง Blogger หมายเลข 38 พื้นหลังของ Blogger หมายเลข 39 พื้นหลังของ blogger สามารถเลือกภาพของคุณเองจากคอมพิวเตอร์ แต่ต้อง อยู่ในขนาดของ blogger หมายเลข 40 ความกว้างของหน้าเว็บบล็อคเวลาแสดงบทความและเขียนบทความ ควรปรับ ให้ได้ 980px 330px เพื่อจะได้ขนาดตามความเหมาะสมมากที่สุด หมายเลข 41 การคืนค่าเดิม ถ้าไม่ต้องการขนาดที่ปรับ ก็สามารถกดปุ่มเพื่อคืนค่าเดิมได้ หมายเลข 42 ปุ่มใช้กับบล็อก เมื่อเราปรับตามความชอบใจแล้ว ก็บันทึกการใช้กับบล็อก

45

47

46

43 44

ภาพที่ 12 แสดงการกาหนดค่า Blogger http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 43 รูปแบบการจัดวางคอลัมม์ หมายเลข 44 การออกแบบคอลัมม์ในส่วนเนื้อความ หมายเลข 45 การออกแบบคอลัมม์ในส่วนท้ายของบล็อก หมายเลข 46 กลับสู่ blogger เมื่อต้องการกลับไปหน้า home หมายเลข 47 Preview blogger ดูบล็อคได้หลังจากการแก้ไขเปลี่ยนแปลง blogger

นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


11

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

49 50 48

ภาพที่ 13 แสดงการกาหนดค่าขั้นสูง Blogger http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

หมายเลข 48 เครื่องมือออกแบบเทมเพลตขั้นสูง จะเป็นการออกแบบตัวอักษร สี ขนา ตัวอักษรหรือเปลี่ยนตัวอักษรตามที่เราต้องการ หมายเลข 49 การตั้งค่าต่างๆของข้อความหน้าบล็อกของเรา หมายเลข 50 แสดงเครื่องมือการเปลี่ยนสีตัวอักษร การทาให้บล็อกเป็นแบบโปร่งใส

นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


12

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

52 53 54 51 55 ภาพที่ 13 แสดงการตั้งค่าพื้นฐาน Blogger http://arti3319-nattawutnuchanaa.blogspot.com/ ที่มา : นายณัฐวุฒิ นุชนา, 2556

ขั้นตอนการเรียนรู้การใช้งาน Blogger หมายเลข 51 ปุ่มการตั้งค่าพื้นฐานของบล็อก หมายเลข 52 ปุ่มแก้ไขชื่อของบล็อก เราสามารถแก้ไขชื่อของบล็อกได้ถ้าไม่พอใจ หมายเลข 53 ปุ่มแก้ไขคาอธิบายใต้บล็อก สามารถแก้ไข้คาอธิบายได้ หมายเลข 54 สามารถแก้ไข Domain ของบล็อกเราได้ หมายเลข 55 สิทธ์ในการเป็น Admin ร่วม สามารถเพิ่มผู้เขียนโดยใส่ที่อยู่ Gmail จากนั้นทั้ง คนสร้างบล็อคและคนถูกเชิญสามารถเข้ามาแก้ไขบล็อกนี้ได้เหมือนกัน

นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


13

เอกสารบันทึกความรู้ในรายวิชาเทคโนโลยีเพื่อการออกแบบนิเทศศิลป์

ชื่อ นายณัฐวุฒิ นุชนา รหัสประจาตัว 5211300552 ออกแบบนิเทศศิลป์ Tel. 081-441-2334 E-mail : nattawut.nuchanaa@gmail.com Blogspot : http://artd3319-nattawutnuchana.blogspot.com/

นายณัฐวุฒิ นุชนา วันพุธที่ 3 กรกฎาคม พ.ศ. 2556


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.