การเขียนเว็บไซต์ CMS1

การเขียนเวบ็ ไซต์ CMS 1 นายชยั ชนะ นาทองไชย ผู้สอน วทิ ยาศาสตรแ์ ละเทคโนโลยี โรงเรียนฤทธยิ ะวรรณาลัย ๒ สพม . กท 2.



คานา เนือ่ งดว้ ยสถานการณก์ ารแพรร่ ะบาดของไวรัสโคโรนา่ 2019 (Covid – 19) คร้ังน้มี คี วาม รุนแรงขยายตวั ในวงกวา้ งและรวดเร็วมากกวา่ ในคร้งั ท่ีผา่ นมาโดยเฉพาะอยา่ งยงิ่ มแี นวโนม้ ท่ีจะ เกิดการแพร่ระบาดในโรงเรยี น ทางโรงเรยี นมีความตระหนกั ถงึ สถานการณ์ดงั กล่าว จงึ ประกาศให้ โรงเรียนเลื่อนการเปดิ ภาคเรยี นท่ี 1 ปีการศึกษา 2564 จากวันที่ 17 พฤษภาคม 2564 โดย กาหนดใหโ้ รงเรยี นเปดิ ภาคเรยี นในวนั ท่ี 14 มิถุนายน 2564 การเล่อื นการเปดิ ภาคเรยี นในครง้ั น้ี เป็นไปตามมาตรการปอ้ งกนั การควบคุมโรคตามระดบั พ้ืนที่สาหรบั สถานศึกษาซึง่ แบง่ เขตพนื้ ท่ี ตามระดบั ความรนุ แรงของการแพรร่ ะบาด ฯ 3 ระดบั ได้แก่ พนื้ ที่สีแดงเขม้ พ้นื ท่สี ีแดง และพน้ื ท่ี สสี ม้ อยา่ งไรกต็ ามสาหรบั สถานศึกษาใดทม่ี ีความพรอ้ ม และมคี วามประสงคท์ จี่ ะเปดิ ใหม้ ีการ เรียนการสอนก่อนวันที่ 14 มถิ ุนายน 2564 ก็สามารถเปดิ ทาการได้ โดยจะต้องปฏบิ ตั ิตามรปู แบบ การจัดการเรยี นการสอนทกี่ ระทรวงกาหนดและมาตรการของกระทรวงสาธารณสขุ อยา่ งเครง่ ครดั เพอื่ ความปลอดภยั และระวงั ปอ้ งกนั ให้นกั เรยี น ครแู ละบคุ ลากรทางการศึกษา ไม่ต้องเสยี่ งต่อการ ตดิ เชื้อไวรัสโคโรน่า 2019 (Covid – 19) ชยั ชนะ นาทองไชย ครูผสู้ อน

เวบ็ ไซต์ คือ ? เวบ็ ไซต์ (Website) หมายถึง หน้าเวบ็ เพจที่จดั ทาขน้ึ เพ่อื นาเสนอขอ้ มลู ตา่ ง ๆ ผ่านทาง คอมพวิ เตอร์ และ อินเทอรเ์ นต็ โดยจะมีหนา้ เวบ็ เพจหลายๆ หน้าทีเ่ ชอ่ื มโยงเขา้ กับไฮเปอร์ลิ้งค์ เพอ่ื ให้สามารถ เปิดไปยงั หนา้ เพจตา่ งๆ ได้อย่างง่ายดายและถกู จดั เก็บไวใ้ น www. (เวลิ ด์ไวดเ์ ว็บ) โดยเว็บไซต์ ส่วนใหญน่ ั้นก็มที ้ังเวบ็ ไซตท์ ่ีเปิดให้เข้าชมไดฟ้ รี และเวบ็ ไซตท์ ี่ต้องสมคั รสมาชิกและเสยี ค่าบรกิ าร จึงจะเขา้ ใชง้ านเวบ็ ได้ ซ่งึ ขอ้ มลู ในเวบ็ ก็จะมหี ลากหลายแบบ ขนึ้ อย่กู ับความตอ้ งการนาเสนอ ของเจา้ ของเว็บไซต์ การเรียกดเู วบ็ ไซต์จะเรียกดูผา่ นทางซอฟตแ์ วร์ ในลักษณะของเบราวเ์ ซอร์ เวบ็ เบราว์เซอร์ (Web browser) คอื โปรแกรมคอมพิวเตอรท์ ่ใี ชใ้ นการท่องเว็บ และมีการ จัดเก็บข้อมลู สารสนเทศตา่ งๆ ด้วยภาษาเฉพาะ เชน่ ภาษา HTML ซึ่งกเ็ ปรียบเสมือนกบั เปน็ เครื่องมอื ทีใ่ ช้ในการติดตอ่ กับเครือขา่ ยคอมพวิ เตอรข์ นาดใหญ่ทเี่ รียกวา่ เวิลด์ไวดเ์ วบ็ นอกจากน้ี ยงั สามารถดเู อกสารในเวบ็ เซิรฟ์ เวอรไ์ ด้ ไม่ว่าเว็บเหลา่ นั้นจะแสดงขอ้ มูลในลักษณะของภาพ ระบบมลั ตมิ เี ดยี รูปภาพหรือข้อความ ในปัจจบุ นั เว็บเบราวเ์ ซอร์ทีร่ องรับระบบ HTML 5 สามารถอ่าน CSS 3 ได้อยา่ งสวยงาม และกาลังได้รบั ความนยิ มมากที่สดุ กม็ ี 4 ประเภทดังน้ี - Internet Explorer - Mozilla Firefox - Google Chrome - Safari

การสรา้ งเว็บไซต์ CMS 1 โฮมเพจ (Home Page) ก็คอื หนา้ แรก ของเว็บไซตเ์ มอื่ เปดิ เข้าไปยังเวบ็ ไซตใ์ ด เวบ็ ไซต์หน่ึง โดยหนา้ แรกนีจ้ ะรวมเมนู และเรอ่ื งราวต่างๆ ไว้มากมาย ซงึ่ ก็มีความสาคัญ เปน็ อย่างมาก เพราะหากหนา้ แรกมกี ารออกแบบไดอ้ ย่างสวยงามและจัดหน้าอยา่ งเปน็ ระเบยี บก็ จะทาให้ผู้ชมเกิดความสนใจและอยากเขา้ ชมเวบ็ มากข้ึน เวบ็ เพจ (Web Page) กค็ อื หน้าเอกสารต่าง ๆ ที่อยูใ่ นรูปของ HTML โดยจะ นาเสนอขอ้ มลู หรอื เรอ่ื งราวต่าง ๆ เป็นหน้าๆ ไป และใช้การเช่ือมโยงเพ่อื ใหส้ ามารถ คลิกไปหนา้ เว็บเพจแต่ละหนา้ ไดง้ า่ ยขึน้ เว็บ Static คอื เว็บที่แสดงผล เพอื่ ให้ความรหู้ รือขอ้ มลู แก่ผเู้ ขา้ ชมเวบ็ เพียงอยา่ ง เดยี ว ไม่สามารถโต้ตอบหรือรับสง่ ขอ้ มูลกับผ้ทู ีเ่ ขา้ ชมเว็บได้ ซึ่งส่วนใหญ่แล้วเวบ็ ไซต์ ประเภทน้ี กจ็ ะเป็นเวบ็ Gallery รูปภาพ เว็บของบรษิ ทั หรอื องคก์ รต่าง ๆ และเว็บให้ ความรู้ทัว่ ไป

การสรา้ งเว็บไซต์ CMS 1 เว็บ Dynamic เป็นเวบ็ ไซต์ทส่ี ามารถตอบโต้ และรับสง่ ข้อมลู ระหว่างผเู้ ข้าชมกับเว็บไซต์ ได้ ซึ่งเว็บเหล่าน้ีสว่ นใหญ่ก็จะมรี ะบบเว็บบอร์ด รวมไปถงึ Social Media ประเภทต่าง ๆ มีการสมัครสมาชิก หรอื เป็นเวบ็ ขายสนิ คา้ ออนไลนท์ ม่ี รี ะบบแชทกับผูข้ าย เป็นต้น Web Service เป็นบริการดา้ นขอ้ มลู ที่สามารถดงึ ขอ้ มลู ของอกี เวบ็ หนงึ่ ไปแสดงผลใน อีกเวบ็ หนงึ่ ได้ Hosting เปน็ พื้นทข่ี องคอมพวิ เตอรแ์ มข่ ่าย ท่ที างผู้ให้บรกิ ารได้ทาการจดั สรรมาให้เช่า โดยสว่ นใหญจ่ ะมีการใหเ้ ชา่ เป็นแบบรายเดอื น รายปีหรอื ตามแต่ผู้ใหบ้ รกิ ารกาหนด อนิ เตอร์เน็ต (Internet) เปน็ ตวั กลางในการเชื่อมตอ่ ให้ผคู้ นสามารถท่องเวบ็ ไซต์ต่าง ๆ ไดอ้ ย่างง่ายดาย และช่วยให้กล่มุ องคก์ ร ธุรกิจหรือบริษทั สามารถนาเสนอขอ้ มูลของตน ลงบนอินเทอร์เน็ต ผ่านทางเว็บไซต์ เปน็ การให้ความร้แู ละแลกเปล่ยี นขอ้ มลู ขา่ วสารตอ่ กนั ได้อยา่ งมปี ระสทิ ธิภาพ

CONTEN สารบัญ

2 บทที 1 WordPress คอื อะไร คุณรูห้ รือไม่ % ของเว็บทังโลกสรา้ งเว็บด้วย WordPress ทาํ ไมคนถึง ใช้ WordPress ใน การสรา้ ง เว็บไซต์ มากขนาดนี เหตุผลเดียวก็คือ WordPress สรา้ งโอกาสให้ทุกคนสามารถทาํ เว็บได้ โดยทีไม่ จาํ เป็นตอ้ งมีความรูเ้ รอื ง Code ไม่ตอ้ งเขียนโปรแกรม ไมต่ อ้ งเป็นโปรแกรมเมอร์ เรียกไดว้ ่าใคร ๆ กส็ ามารถ ทาํ เว็บได้ รวมถึงผมดว้ ย ทไี มใ่ ชโ่ ปรแกรมเมอร์ และไม่มีความรูเ้ รือง Coding อะไรเลย WordPress คอื อะไร WordPress คือ เครืองมือทีเป็นตัวช่วยในการสร้างเว็บไซต์ ทีมีระบบจัดการข้อมูล และสรา้ งเนือหา (Content Management System: CMS ) ทีสามารถใหเ้ ราเพิมเติมบทความ รูปภาพ ไดเ้ องแบบง่ายๆ โดย ไมต่ อ้ งมีความรูเ้ รอื ง Code หรือความรูด้ า้ นโปรแกรมมิง นนั เอง ทาํ ไมควรใช้ WordPress x ประหยดั ค่าใช้จา่ ย ใคร ๆ ก็สามารถโหลด WordPress มาใชไ้ ดฟ้ รี เพราะเป็น Opensource ดงั นนั เราจึงประหยดั คา่ ใชจ้ ่ายในการจา้ งคนเขียนโปรแกรม เราสามารถเรียนรูแ้ ละทาํ ดว้ ยตนเองไดเ้ ลย x ไม่ต้องเขยี นโค้ดให้ยุ่งยาก ลืมเรอื งการทาํ เว็บในอดีตไปไดเ้ ลย การทาํ เว็บดว้ ย WordPress คลา้ ยกบั ตวั ต่อเลโก้ เรามีหนา้ ที มองหาชินสว่ นตา่ งๆ และเอามาประกอบกนั เป็นรูปรา่ ง ทีตอ้ งการไดต้ ามใจชอบ ไมต่ อ้ งเขียนโคด้ ใหย้ งุ่ ยากอกี ตอ่ ไป x มีฟังชันต่าง ๆ มากมาย คณุ สามารถเพมิ เตมิ ฟังชนั ต่าง ๆ ผา่ นปลกั อินมากมาย เพือสนองจินตนาการของคณุ ไดไ้ มร่ ูจ้ บ เชือมต่อกบั Social Media ต่าง ๆไดอ้ ย่างรวดเรว็ รองรบั การทาํ งานกบั ไฟลภ์ าพ ไฟลเ์ สียง คลบิ วดี ีโอ ไดท้ กุ อยา่ ง

3 x อพั เดทเนือหาตา่ ง ๆ ได้ง่าย เหตผุ ลทีคนทวั โลกนิยมใช้ WordPress กเ็ พราะมรี ะบบจดั การเนอื หาทใี ชง้ านง่าย เป็นสากล คณุ สามารถเพิมขอ้ มลู หรืออพั เดทเนอื หาไดต้ ลอด ทกุ ที ทกุ เวลา x มีธมี ใหเ้ ลือกเยอะ ดีไซนส์ วยงาม สาํ หรบั คนทเี บืองา่ ย อยากจะเปลยี นหนา้ ตาเว็บไซตใ์ หม่ ขา่ วดีก็คือ WordPress มธี ีมใหด้ าวน์ โหลดมากมายมหาศาลเลย มีทงั แบบฟรีและแบบเสยี เงิน แถมยงั ดีไซนส์ วยงามสดุ ๆ x Google ชอบ Google ระบบ Search Engine ทที รงอิทธิพลทีสดุ ในโลกอนิ เตอรเ์ น็ต ใหค้ วามสาํ คญั กบั เวบ็ ไซตท์ ี สรา้ งดว้ ย WordPress ทงั ยงั แนะนาํ วา่ เว็บไซตธ์ ุรกจิ ควรสรา้ งดว้ ย WordPress จะชว่ ยใหต้ ดิ อบั ดบั Google ไดง้ ่ายขนึ ใช้ WordPress สร้างเวบ็ อะไรได้บา้ ง ถา้ พดู ตามหลกั การ WordPress สามารถสรา้ งเว็บไดท้ ุกประเภทบนโลกใบนี เชน่ สรา้ งเวบ็ บรษิ ัทก็ได้ สรา้ ง เว็บรา้ นคา้ ปลกี กไ็ ด้ สรา้ งเว็บเป็น Marketplace เหมอื น Lazada ก็ได้ หรือจะสรา้ งเว็บเป็นคอรส์ เรียน ออนไลน์ แบบ skilllane ก็ได้ แต่ตอนลงมอื ทาํ จรงิ อาจจะไม่เหมาะกบั การทาํ เว็บบา้ งประเภทนะ โดยเฉพาะเว็บทมี ีระบบซบั ซอ้ น เชน่ Maket place หรอื เว็บพวกประกาศขายบา้ น ดว้ ยเหตผุ ลประมาณนคี รบั

4 x WordPress เหมาะกบั เวบ็ ทเี ป็นรา้ นคา้ เดียว เป็นสินคา้ ของเราเอง โพสขายเอง เก็บเงินเอง อนั นี เหมาะกบั การสรา้ งดว้ ย WordPress x เว็บทเี ป็น Market place มคี วามซบั ซอ้ นของระบบมากกว่าหลายเท่า เพราะผขู้ ายตอ้ งมีสทิ ธิเอา สินคา้ มาวางขาย และแกไ้ ขรายละเอียดของตวั เอง เชค็ ยอดเงิน / การสง่ ของตา่ งๆ (ซงึ ตอ้ งกาํ หนด อีกมากว่า ใครสง่ ดว้ ยเงือนไขไหน ใครรบั ประกนั x WordPress เป็น open source software โดยใหค้ นทงั โลกรวมกนั พฒั นา โดยการเขียนธีม และ ปลกั อิน ใหม้ าทาํ งานรว่ มกบั WordPress แตเ่ มอื ต่างคนตา่ งๆ เขยี น หลายๆ เมอื เราต่อเตมิ เว็บให้ ซบั ซอ้ นยิงขึน จะมีโอกาสทีปลกั อนิ กบั ธีม ตกี นั ทาํ ใหร้ ะบบพงั ไดน้ นั เอง ดงั นนั WordPress เหมาะกบั การสรา้ งเวบ็ บรษิ ัท ทมี ีลกั ษะเป็น Information และเหมาะสาํ หรบั ทาํ เวบ็ รา้ นคา้ เดยี ว มากกว่าการทาํ เวบ็ ทมี รี ะบบซบั ซอ้ นโดยเฉพาะ WordPress ไมเ่ หมาะกบั การสรา้ งเว็บ Market place ครบั ดเู พิมเตมิ : ตวั อยา่ งเวบ็ ไซตป์ ระเภทตา่ งๆ ทสี รา้ งจาก WordPress “ตามหลกั การ WordPress สรา้ งเวบ็ ไดท้ กุ ประเภทบนโลกใบนี แตก่ ารลงมือ ทาํ จรงิ เวบ็ บางประเภทอาจจะไม่เหมาะกบั การสรา้ งดว้ ย WordPress” ความแตกต่างระหว่าง WordPress.com กับ .org x WordPress.com ให้บริการบล็อกฟรีเหมือน Blogger หรือ Tumblr มีพืนทีโฮสติงฟรีแต่จะมี ขอ้ จาํ กัดบางอย่าง เช่น ปรบั แต่งหนา้ ตาเว็บไซตไ์ ดเ้ พียงเล็กนอ้ ย เหมาะสาํ หรบั ผูท้ ีตอ้ งการเขียน บทความเพยี งอย่างเดยี ว คณุ สามารถสมคั รเพอื เรมิ ตน้ สรา้ งเว็บไซตไ์ ดเ้ ลย x WordPress.org สามารถดาวนโ์ หลด Source code และตดิ ตงั ลงในโฮสตงิ สว่ นตวั ปรบั แต่งและ แกไ้ ขไดอ้ สิ ระ มีความยืดหย่นุ มากกว่า เหมาะสาํ หรบั ทาํ เวบ็ ไซตห์ ลากหลายรูปแบบ สามารถดาวน์ โหลดเพอื เรมิ ตน้ ใชง้ าน WordPress กบั ธุรกจิ ของคณุ ไดเ้ ลย (เว็บผมเองก็สรา้ งดว้ ย WordPress.org เชน่ กนั ) ทมี าของคาํ อธิบายนี contentshifu.com

5 ดูรูปภาพการเปรียบเทยี บเพิมเตมิ นะ ทมี าของรูปภาพ wpexplorer.com บทความนจี ะรวมความรูพ้ นื ฐานในการใชง้ านเวบ็ ไซตส์ รา้ งดว้ ย WordPress โดยโฟกสั ที WordPress.org เป็นหลกั ครบั ผม เพราะยดื หยนุ่ กว่า และประหยดั กว่าหากเราจะสรา้ งเวบ็ ไซต์ หลาย ๆ เว็บ

6 องคป์ ระกอบของการสร้างเว็บด้วย WordPress การสรา้ งเว็บดว้ ย WordPress เราไมไ่ ดใ้ ช่แค่ WordPress อยา่ งเดยี วแลว้ จะสามารถสรา้ งเว็บใหใ้ ชง้ านจรงิ ได้ หากคณุ ตอ้ งการทาํ เว็บใหใ้ ชง้ านจรงิ ได้ จะมีองคป์ ระกอบอีกหลายสว่ น ในการทาํ งานรว่ มกบั WordPress ดงั นีครบั 1. WordPress คือ แพลตฟอรม์ เปรยี บเหมือนระบบปฏบิ ตั ิการ (OS) บนคอมพิวเตอรท์ เี รา จาํ เป็นตอ้ งติดตงั กอ่ น แต่ตวั WordPress เองยงั ไมม่ ีความสามารถในการออกแบบความสวยงาม หรือสรา้ งฟังชนั ทซี บั ซอ้ น เราตอ้ งทาํ งานรว่ มกบั เครืองมือหรอื ปลกั อนิ อนื ๆ ดว้ ย 2. Woocommerce คอื ปลกั อินทชี ว่ ยแปลงรา่ งเว็บ WordPress ธรรมดาๆ ของคณุ ใหก้ ลายเป็นเว็บ รา้ นคา้ ออนไลนเ์ ตม็ รูปแบบ เราสามารถโหลดตวั ปลกั อนิ นีมาใชฟ้ รีๆ ไดอ้ ีกดว้ ย และในปัจจบุ นั จาก สถติ ิเว็บรา้ นคา้ ออนไลนข์ องทงั โลก % คือเว็บทสี รา้ งมาจาก Woocommerce

7 3. Theme คอื เครอื งมือทใี ชส้ าํ หรบั ออกแบบ และจดั วาง layout หนา้ ตาเว็บไซต์ WordPress ของเรา ใหส้ วยงามในแบบทเี ราตอ้ งการ หากเราใชง้ านธีมไดเ้ กง่ ๆ เราจะสามารถออกแบบหนา้ เวบ็ ของเรา อยา่ งไรกไ็ ด้ ทกุ ไอเดีย หรอื ออกแบบเว็บเลียนแบบหนา้ ตาของเวบ็ ทเี ราชอบกไ็ ด้ 4. Plugin คือ เครืองมือเพิมฟังชนั การใชง้ านเว็บ WordPress ของคณุ ใหม้ ปี ระสทิ ธิภาพมากขนึ ตอบ โจทยธ์ ุรกจิ หรือในสิงทเี ราตอ้ งการ เช่น สรา้ งฟอรม์ เก็บขอ้ มลู ทาํ ระบบ booking หรือระบบ live chat เป็นตน้ แนะนาํ ใหค้ ณุ ดคู ลปิ นีประกอบครบั https://youtu.be/b93PHDZ-_hE ตน้ ทนุ การสร้างเวบ็ WordPress เว็บไซต์ ก็คือ รา้ นคา้ บนโลกออนไลน์ ทไี วค้ อยเรยี กลกู คา้ ใหแ้ วะมาชอปปิงทีรา้ นของเรา นนั หมายความว่า หากคณุ ตอ้ งการทาํ เว็บแลว้ ใหม้ นั ขายของได้ คณุ ตอ้ งลงทนุ เงิน เวลา การออกแบบ การตกแตง่ ใหร้ า้ นคา้ คณุ นา่ สนใจพอทจี ะดงึ ผคู้ นใหแ้ วะมาเยียมชม สาํ หรับตน้ ทุน (เงนิ /เวลา) ในการสร้างเวบ็ ไซต์ ให้มีคณุ ภาพ มีดงั นีครับ 1. คา่ จดโดเมน 400 – 1000 บาท ราคาจะแตกต่างกนั ตามนามสกลุ ทเี ราเลือกใช้ เช่น นามสกลุ .com, .net, .in.th จะราคาประมาณ 400-500 บาท นามสกลุ .co.th จะราคาประมาณ 1000 บาท 2. คา่ เชา่ โฮสตงิ (ทีตงั เวบ็ ไซต)์ ราคา 1500 – 3000 บาท 3. ค่าแพลตฟอรม์ (เครอื งมอื สรา้ งเวบ็ ) เราจะใช้ WordPress ในการทาํ ซงึ ตวั WordPress นนั ฟรี! 4. คา่ ธีม (สาํ หรบั ในการออกแบบเว็บ) ราคา 2,000-2,500 บาท

8 5. ค่าจา้ งทาํ กราฟฟิค บางครงั อยากใหเ้ ว็บออกมาสวย ดเู ป็นมืออาชพี เราตอ้ งจา้ งคนทาํ กราฟฟิครูป ภาพประกอบเวบ็ ใหเ้ ราครบั ราคาโดยเฉลยี 15,000 – 20,000 บาท (กรณีทีคณุ ไม่ไดท้ าํ เองนะ) 6. ตน้ ทนุ ดา้ นเวลาการทาํ เว็บหากเราจา้ งคนอนื ทาํ ใหเ้ รา ใชเ้ วลาประมาณ 20-30 วนั 7. ตน้ ทนุ ดา้ นเวลาหากคณุ คดิ จะทาํ เวบ็ ไซตเ์ อง มดี งั นี – เวลาทใี ชส้ าํ หรบั การเรียนรู้ 2-3 เดอื น – เวลาทใี ชส้ าํ หรบั การทาํ เว็บใหใ้ ชง้ านจรงิ ๆ ได้ อกี 1-2 เดือน 8. ค่าแรงของคนทรี บั จา้ งทาํ แต่ละคนจะมคี ่าตวั ไม่เท่ากนั โดยเฉลยี 15,000 – 30,000 บาท (กรณีที เราไมไ่ ดท้ าํ เองนะ) ดังนันโดยสรุป ตน้ ทุนของการสร้างเวบ็ ไซต์ ให้มคี ุณภาพดี x หากคณุ จา้ งคนอนื ทาํ ราคาจะประมาณ 30,000 – 50,000 บาท (เป็นราคาขนั ตาํ นะ) x หากคณุ เรยี นรูท้ จี ะทาํ เองตน้ ทนุ ทใี ชจ้ ะประมาณ 4,500 บาท (ไม่รวมค่ากราฟฟิค) 20,000 บาท (ทาํ เวบ็ เอง แต่จา้ งกราฟฟิคออกแบบรูป) x เวลาทใี ช้ 3-4 เดือน กรณีทคี ณุ สรา้ งเวบ็ ดว้ ยตนเอง เรมิ ตงั แตข่ นั ตอนการเรียนรู้ จนถงึ การลงมอื ทาํ เว็บใหส้ าํ เรจ็ “หากคณุ จา้ งใครทาํ เวบ็ แลว้ ราคาประเมิณถกู กวา่ ทผี มแสดงขา้ งตน้ คณุ ก็ ตอ้ งยอมรบั ความเสยี งดา้ นคณุ ภาพของเวบ็ ไซต์ และความเสยี งดา้ นถกู ทงิ งาน หรอื ทาํ เวบ็ ใหใ้ ชง้ านจรงิ ไม่ไดน้ นั เอง เพราะเป้าหมายของการเขยี น บทความนี ผมตอ้ งการพาคณุ สรา้ งเวบ็ ทมี คี ณุ ภาพดใี หไ้ ดเ้ ท่านนั ” แนวทางใช้งาน WordPress ให้มปี ระสิทธภิ าพ การจะใชง้ าน WordPress ใหม้ ีประสทิ ธิภาพ อนั ดบั แรกเราตอ้ งเขา้ ใจก่อนว่า WordPress เขาถกู พฒั นามา เพอื ทาํ สิงใด สงิ ทเี ป็นหวั ใจของ WordPress คือ ช่วยใหผ้ คู้ นธรรมดาๆ ทวั ไป สรา้ งเว็บไซตด์ ว้ ยตนเองได้ โดยไมต่ อ้ ง code และไมต่ อ้ งเป็นโปรแกรมเมอร์

9 WordPress Mission “WordPress is software designed for everyone, emphasizing accessibility, performance, security, and ease of use.” เมอื WordPress แกส้ งิ ทเี ป็น Pain point ของวงการทาํ เว็บไดส้ าํ เรจ็ คือ ทาํ ใหก้ ารทาํ เว็บทเี ป็นเรืองยากๆ กลายเป็นเรืองงา่ ยๆ ได้ จงึ สง่ ผลให้ WordPress กลายเป็น เครืองมือทีคนทงั โลกเลอื กใชใ้ นการทาํ เว็บมาก ทสี ดุ แต่แน่นอน WordPress นนั ไม่ใช่เครืองมือทเี พอรเ์ ฟค แมว้ ่าเขาจะสรา้ งเว็บไดท้ กุ ชนิดบนโลกใบนี แต่ กอ็ าจจะมบี างฟังชนั ทีอาจจะไม่ตอบโจทย์ โมเดลของธรุ กจิ ของคณุ บา้ ง ในบา้ งจดุ เพราะการทาํ เว็บวา่ ซบั ซอ้ นแลว้ แต่ความตอ้ งการคนนนั ซบั ซอ้ นยงิ กวา่ แนวทางการใช้งานทถี ูกต้อง สงิ ทผี มอยากจะสือสารกบั พวกเราคือ โดยสว่ นใหญ่ฟังชนั ทเี ราตอ้ งการนนั มนั จะมีธีม และปลกั อนิ ของ WordPress รองรบั อย่แู ลว้ แคเ่ ราอาจยงั คน้ หาไม่เจอเท่านนั แตห่ ากคน้ หาแลว้ ไมเ่ จอฟังชนั ทเี ราตอ้ งการ สิงที กรู ู WordPress อนั ดบั คณุ เม่น Chakkrisn Menn Talawat แนะนาํ พวกเราคนทาํ เว็บก็คือ “ใหพ้ ยายามปรบั โมเดลเรา ใหเ้ ขา้ กบั ปลกั อนิ จะจบงานไดด้ กี ว่า แต่ถา้ เขยี น ใหม่ มนั จะทงั แพง ทงั ชา้ และอาจทาํ งานไม่จบ” การพยายามไป custom theme หรอื เขยี นปลกั อินขนึ มาใหม่เองไมใ่ ช่เรืองผิดถา้ คณุ เก่งจรงิ ๆ แต่มนั จะทาํ ใหค้ ณุ เสียทงั เงินและเวลา ทีไมไ่ ดเ้ ป็นเครืองการนั ตีว่าเมือทาํ ทกุ อย่างเสรจ็ สนิ คา้ หรือบรกิ ารของคณุ มนั จะ ทาํ เงินได้ เพราะอย่าลืมวา่ แก่น ของ WordPress คือ การสรา้ งเว็บโดยไม่ตอ้ ง Coding ดงั นนั หากคณุ ตอ้ งการใช้ WordPress ใหม้ ปี ระสทิ ธิภาพ ใชง้ านไดจ้ รงิ เว็บไมพ่ งั ในระยะยาว

10 กค็ ือปรบั สิงทีเราตอ้ งการ ใหเ้ หมาะกบั สงิ ที WordPress มี แกไ้ ขโคด้ ใหน้ อ้ ยทสี ดุ หรอื ไมต่ อ้ งแกโ้ คด้ เลย นนั เอง แต่ใหจ้ งโฟกสั สิงทลี กู คา้ เราตอ้ งการ คือ การทาํ เว็บใหน้ ่าเชือถือ ดว้ ยคอนเทนตค์ ณุ ภาพ ทาํ ใหล้ กู คา้ มนั ใจ ว่าหากสงั สนิ คา้ หรือใชบ้ รกิ ารจากเราเขาจะไดส้ ินคา้ ทดี ีมีคณุ ภาพ สง่ ของตรงเวลา แค่นนั ขันตอนการเรยี นรู้ WordPress การสรา้ งเว็บดว้ ย WordPress นนั ไม่ยาก แตม่ นั มีรายละเอียดเยอะ เพือใหก้ ารเรียนรูไ้ ดอ้ ย่างมี ประสทิ ธิภาพ และไมห่ ลงทาง ผมแนะนาํ ใหค้ ณุ เรียนรูแ้ ละลงมือทาํ ทีละขนั ตอน ดงั นีครบั 1. จดโดเมน เช่าโฮส 2. ตดิ ตงั WordPress 3. ฝึกใชง้ าน WordPress พนื ฐาน 4. ออกแบบเว็บใหส้ วยงามดว้ ยธีม 5. สรา้ งระบบรา้ นคา้ Woocommerce 6. สรา้ งฟังชนั เพิมเติมดว้ ย ปลกั อิน 7. เชือมตอ่ เวบ็ เขา้ กบั Google 8. ทาํ SEO และทาํ การตลาดออนไลน์ สรุป การใชง้ าน WordPress นนั ไม่ยาก ใคร ๆ ก็สามารถเรยี นรูไ้ ด้ แตเ่ ขากม็ ีรายละเอยี ดค่อนขา้ งมาก สาํ หรบั ผู้ เรมิ ตน้ ใชง้ าน WordPress อาจจะยงั รูส้ กึ วา่ มนั ยงั ไมง่ า่ ย ตรงจดุ นเี ราตอ้ งค่อยๆ ฝึกฝนทาํ ซาํ ไปเรอื ย ๆ พนื ฐานทแี น่นเทา่ นนั ถงึ จะช่วยใหเ้ ราทาํ เวบ็ ใหม้ ปี ระสทิ ธิภาพไดใ้ นอนาคต เพราะแค่การทาํ เว็บได้ กบั ทาํ เว็บใหด้ ี ยงั มีรายละเอียดทแี ตกต่างกนั อยมู่ ากครบั

11 บทที 2 การจดโดเมน (Domain) โดเมน(Domain) คืออะไร โดเมน คือ ชอื ของเวบ็ ไซต์ ชือโดเมน กเ็ ปรยี บเหมือนชือบรษิ ทั หรือชือรา้ นคา้ ของเรา จะซาํ กบั คนอนื ไม่ได้ โดเมน จะมีองคป์ ระกอบอยู่ สว่ น คือ ชือโดเมน กบั นามสกลุ หลักการจดชือโดเมน x โดเมนเราจดทไี หนก็ได้ แต่เนน้ จดจากบรษิ ัททดี แู ลว้ มีความน่าเชือถือ x ควรตงั ชอื โดเมนให้ สนั กระชบั เพอื ใหค้ นจดจาํ งา่ ย x ควรตงั ชอื ทีออกเสียงแลว้ ฟังงา่ ยๆ ดว้ ย บอกต่อง่าย x ไม่ควรตงั ชอื โดเมน ไปซาํ กบั เว็บใหญ่ๆ หรอื Brand สินคา้ ทมี ีชอื เสียง x ไม่ควรจดโดเมนเป็นคาํ keyword ตรงๆ x ควรตงั ชอื โดเมนเป็นภาษาองั กฤษ x ตงั ชอื ใหส้ ือความหมายถงึ สิงทเี ราทาํ (ถา้ ทาํ ได)้ x อยา่ ตงั ชอื โดเมนทสี ะกดคาํ ยาก หรือพิมพย์ าก x ไม่ควรมีเครืองหมายขีด( – ) เช่อน my-domain.com เพราะอาจทาํ ใหค้ นสบั สน หรือพิมพผ์ ดิ ได้ x เลอื กใชน้ ามสกุล .com เพราะคนสว่ นใหญ่คนุ้ เคย แต่ถา้ จดไม่ไดก้ ไ็ ม่เป็นไร (เพราะมคี นจดชอื นไี ป แลว้ ) ไปหานามสกลุ อนื ๆ ไดไ้ มม่ ปี ัญหา แต่อย่าใชน้ ามสกลุ ทดี แู ปลกตาจนเกินไป x ตงั ชอื โดเมนเพอื คาํ นงึ ถงึ การทาํ Brand SEO ในอนาคตดว้ ย

12 จดโดเมนราคา เทา่ ไหร่ - บาท ราคาโดเมนจะถกู หรือแพงขึนอย่กู บั นามสกลุ การจดโดเมนนนั มคี ่าใชจ้ ่าย ราคาประมาณ ของโดเมนทเี ราเลือกใชน้ นั เอง

13 จดโดเมนทไี หนด?ี มีบรษิ ทั รบั จดโดเมนอย่มู ากมาย แต่บรษิ ัทรบั จดโดเมนทีผมแนะนาํ มีดงั นีครบั (อตั ราค่าบริการการจด โดเมนของแตล่ ะบรษิ ทั อาจไมเ่ ทา่ กนั นะ) แตส่ าํ หรบั บทความนผี มจะแนะนาํ วิธีการจดโดเมนที Hostatom เป็นหลกั ครบั เพราะโดเมนเว็บผมเองก็ใช้ บรกิ ารจดกบั เขานนั เอง และเพอื ใหค้ ณุ สามารถทาํ ตามขนั ตอนทผี มอธิบายไวไ้ ด้ ผมแนะนาํ ใหม้ าจดบรกิ าร ทเี ดยี วกบั ผมไดเ้ ลยครบั

14 ขันตอนการจดโดเมน 1) ใหเ้ ราไปทเี ว็บ hostatom.com 2) ดทู เี มนู ใหค้ ลิกตรงคาํ วา่ จดโดเมนใหม่ 3) คลกิ ตรงคาํ วา่ คลกิ ทนี เี พือจดทะเบียนโดเมนกบั โฮสอะตอม (สาํ หรบั ใครทจี ดโดเมนไวก้ อ่ นแลว้ ขา้ มขนั ตอนนไี ปไดเ้ ลยครบั ผม) 4) พมิ พช์ ือโดเมนทเี ราตอ้ งการจดลงไป และเพอื เป็นการเช็คดว้ ยวา่ ชือทเี ราตอ้ งการนนั มคี นจดไวแ้ ลว้ หรือ ยงั ถา้ ระบบแจง้ ว่า ชือนจี ดไม่ได้ แสดงวา่ ชือทเี ราตอ้ งการนนั มคี นจดไวอ้ ย่แู ลว้

15 ทางแกไ้ ขหากเราอยากไดช้ ือนจี รงิ ๆ ใหเ้ ราเปลียนนามสกลุ ดู แลว้ ลองคน้ หาดใู หม่ หรือจะลองตงั ชอื ใหมล่ ง ไปก็ได้ หากระบบแจง้ ว่าชือนสี ามมรถใชไ้ ด้ เราก็คลิก ใสล่ งตะกรา้ ไดเ้ ลยครบั พรอ้ มกบั ใหค้ ลิกคาํ ว่าชาํ ระเงนิ เราก็จะมาเจอหนา้ นี เขาจะถามว่าซอื โฮสดว้ ยเลยมยั เราอาจจะยงั ไม่ตอ้ งซือตอนนกี ็ได้ รอคาํ แนะนาํ เรือง การเลอื กซอื โฮสกอ่ นกไ็ ดค้ รบั คลิกดาํ เนินการต่อ ไดเ้ ลย

16 จากนนั ให้ คลิกชาํ ระเงิน ครบั

17 ระบบก็จะพามายงั หนา้ กรอกขอ้ มลู สว่ นตวั

18 กรอกขอ้ มลู ใหเ้ รียบรอ้ ย แตใ่ หเ้ รากรอกเป็นภาษาองั กฤษนะ แลว้ ใหค้ ลิก ยืนยนั คาํ สงั ซือไปไดเ้ ลยครบั หลกั จากนนั คณุ จะไดร้ บั ใบแจง้ ค่าบรกิ าร เพือไวใ้ ชส้ าํ หรบั การชาํ ระเงนิ เลอื กบญั ชีทีคณุ สะดวกสาํ หรบั การโอนเงิน ตามนคี รบั ผม หลกั จากโอนเงนิ เรียบรอ้ ยแลว้ เราตอ้ งทาํ การแจง้ ชาํ ระเงินไปใหเ้ ขาครบั ใหเ้ รากลบั ไปทหี นา้ เว็บของ Hostatom ดทู เี มนู แจง้ ยนื ยนั การชาํ ระเงนิ

19 กรอกขอ้ มลู พรอ้ มสง่ หลกั ฐานการชาํ ระเงินเขา้ ไปใหเ้ รียบรอ้ ยครบั ผม จากนนั รอทางโฮสจดทะเบยี นโดเมน ใหเ้ ราอาจจะใชเ้ วลา 1 – 2 ชวั โมงครบั ตรวจเชค็ วา่ โดเมนเราพรอ้ มใชง้ านเรียบรอ้ ยหรือยงั ใหเ้ ราทาํ การ login เขา้ ส่รู ะบบหลงั บา้ นของโฮส โดย การคลิกที Client Login กรอก username (email) และ password ทเี ราใชต้ อนสมคั รจดโดเมน

20 ระบบก็จะพาเราส่รู ะบบหลงั บา้ นของโฮสทีเราเลือกใชบ้ รกิ าร ใหเ้ ราคลิกทเี มนู โดเมนของฉนั ก็จะปรากฏรายชอื โดเมนทเี ราเคยจดไวท้ งั หมด โดเมนทพี รอ้ มใชง้ าน จะมสี ถานะเป็นสีเขยี ว (บรกิ ารทเี ปิด ใชง้ านอย)ู่ เมอื เรามโี ดเมนเรียบรอ้ ยแลว้ อนั ดบั ต่อไป เราตอ้ งไปเชา่ โฮสกนั ต่อครบั ผม ดบู ทเรียนนีบน YouTube: https://youtu.be/VLdIoPZDFlw

21 บทที 3 เชา่ โฮสตงิ (Hosting) โฮสตงิ ก็คอื พนื ที ทใี ชเ้ ก็บรูป ขอ้ มลู ไฟลต์ า่ งๆ เพอื ใชแ้ สดงเว็บของเรา กจ็ ะเปรยี บเหมือนทีตงั รา้ นคา้ ทเี รา ตอ้ งไปเช่าเขานนั เองครบั ดบู ทเรียนนีบน YouTube: https://youtu.be/RiWKf7VgZtw เวบ็ จะมปี ระสิทธิภาพดหี รือไมด่ ี โฮสมสี ว่ นสาํ คญั อยู่ไม่นอ้ ย ก่อนทเี ราจะเลือกใชบ้ รกิ ารโฮสตงิ กบั เจา้ ไหนดี สงิ ทเี ราตอ้ งรูก้ อ่ น ก็คือ ตวั โฮสตงิ ที WordPress แนะนาํ มีเสปคอยา่ งไรบา้ ง แต่การอธิบายเรืองโฮสสว่ น ใหญ่มีแต่คาํ ศพั ทท์ างเทคนิค โดยสรุปยอ่ ผมมีคาํ แนะนาํ สาํ หรบั การเลือกโฮสดงั นีครบั x หากเป็นมือใหม่ควรใชโ้ ฮสไทยครบั หากติดขดั อะไรจะไดค้ ยุ กบั โฮสไดร้ ูเ้ รือง x ระบบจดั การหลงั บา้ นโฮส (control panel) ควรเป็น DirectAdmin หรือ plesk x เวอรช์ นั PHP web server ควรใชเ้ วอรช์ นั PHP 7.3 ขนึ ไป x ในตวั Control panel ควรมี Auto installer ช่วยตดิ ตงั WordPress ดว้ ย ตวั ทีโฮสควรมี กเ็ ชน่ Softaculous คอื ถา้ โฮสทีเราใชม้ ีเจา้ ตวั นีอยู่ เราจะสามารถลง WordPress เองไดง้ ่ายมาก เราจะ ไดไ้ มต่ อ้ งสรา้ ง database เอง ไม่ตอ้ ง FTP ไฟลต์ า่ งๆ ดว้ ย x โฮสควรมีบรกิ าร Let’s Encrypt – Free SSL/TLS Certificates เพอื ใหเ้ ราสามารถทาํ เวบ็ เป็น HTTPS ไดฟ้ รี x แพคเกจของโฮสไม่ควรจาํ กดั โดเมนและซบั โดเมน (เพราะเราตอ้ งทาํ กนั หลายเว็บ) x สว่ นพนื ทขี องโฮสเราไมต่ อ้ งกลวั เต็มครบั เลอื กมาสกั แพคเกจไดเ้ ลย โดยเฉลยี เว็บทที าํ ดว้ ย WordPress ทขี นาดเล็กถงึ กลาง หากเราทาํ เว็บไดถ้ กู ตอ้ งเวบ็ เราจะใหญ่ไม่เกนิ 500 MB ครบั x และอีกเรอื งคอื เรือง bandwidth สง่ ขอ้ มลู เน็ตออกไปต่างประเทศ ถา้ โฮสไหนเน็ตออกต่างประเทศ ไม่คอ่ ยดีจะเกดิ ปัญหาทพี บเจอบ่อยทสี ดุ คอื การ แชรล์ ิงคเ์ ฟสบคุ๊ แลว้ รูปไม่ขึนนนั เอง ตรงจดุ นี บางครงั เรากไ็ มร่ ูว้ ่าโฮสเจา้ ไหนเนต็ นอกดหี รือไมด่ ี จนกว่าจะไดเ้ ช่าโฮสมาลองใชด้ คู รบั x แตแ่ นน่ อนเพือความงา่ ย หากคณุ ยงั ตดั สินใจไม่ไดว้ ่าจะใชโ้ ฮสเจา้ ไหนดี ผมแนะนาํ ใหค้ ณุ ใชโ้ ฮส เจา้ นคี รบั Hostatom ซงึ เป็นโฮสทผี มใชง้ านอยู่ และจะไดท้ าํ ตามขนั ตอนการใชง้ านจากบทความ ชดุ นไี ดน้ นั เอง

22 ขันตอนการเช่าโฮสติง ใหไ้ ปทหี นา้ เว็บของ >> Hostatom << กดผา่ นลิงคต์ รงนีไดเ้ ลย ดทู เี มนตู รงเว็บโฮสตงิ ใหเ้ ราคลิกเลอื ก WordPress Hosting ครบั จากนนั ใหเ้ ลือกแพคเกจของโฮสทีเราจะเลือกใช้ ผมแนะนาํ ใหค้ ณุ เลือกแค่แพคเกจ WP-1 กพ็ อครบั สงิ ทไี ด้รับเมือสงั ซอื แพคเกจ WP-1 นี x พนื ทใี นการเก็บขอ้ มลู 10 GB x ไมจ่ าํ กดั การรบั สง่ ขอ้ มลู x ไม่จาํ กดั โดเมนทใี ชง้ าน x รองรบั ผเู้ ขา้ ชมเว็บ 1 แสนคนต่อเดือน x มีระบบชว่ ยติดตงั WordPress x ฟรี SSL เพอื ทาํ เว็บใหเ้ ป็น HTTPS

23 จากนนั ใหค้ ลกิ สงั ซือ ระบบกจ็ ะพามาทหี นา้ เลือกโดเมน ซงึ เราไดซ้ ือโดเมนไวแ้ ลว้ ดงั นนั ใหค้ ลิกที ใช้ โดเมนทมี ีอยแู่ ลว้ และอพั เดท nameserver พมิ พช์ ือโดเมนทีเราจดไวล้ งไป แลว้ คลิกที ใชโ้ ดเมนนี จากนนั คลกิ ดาํ เนินการต่อ

24 คลกิ ชาํ ระเงิน ระบบก็จะพาเขา้ สหู่ นา้ กรอกขอ้ มลู เพอื ทาํ การชาํ ระเงนิ สาํ หรบั คนทจี ดโดเมนกบั Hostatom อย่แู ลว้ เราก็ ไม่จาํ เป็นตอ้ งกรอกขอ้ มลู ใหม่ ใหเ้ ราคลิก สมคั รใชง้ านเรียบรอ้ ยแลว้ ไดเ้ ลยครบั จากนนั ใหเ้ รากรอก username ทเี ป็นอเี มล และ password ใหเ้ รียบรอ้ ย

25 เมอื คณุ คลิกยืนยนั คาํ สงั ซอื เรียบรอ้ ย คณุ ก็จะไดใ้ บแจง้ ค่าบรกิ าร เพือไปใชใ้ นการชาํ ระเงนิ ครบั และเลือก บญั ชีทีคณุ สะดวกสาํ หรบั การโอนเงิน ตามนีครบั ผม หลกั จากโอนเงินเรยี บรอ้ ยแลว้ เราตอ้ งทาํ การแจง้ ชาํ ระเงินไปใหเ้ ขาครบั ใหเ้ รากลบั ไปทหี นา้ เว็บของ Hostatom ดทู เี มนู แจง้ ยนื ยนั การชาํ ระเงิน กรอกขอ้ มลู พรอ้ มสง่ หลกั ฐานการชาํ ระเงินเขา้ ไปใหเ้ รียบรอ้ ยครบั ผม จากนนั รอทางโฮสเซท็ คา่ โฮสตงิ ให้ เรา อาจจะใชเ้ วลา 2 – 4 ชวั โมงครบั เมอื โดเมนพรอ้ ม โฮสพรอ้ ม ก็ถงึ เวลา สรา้ งเวบ็ ไซต์ ขายของออนไลน์ ของเราจรงิ ๆ กันแลว้ ครบั ผม

26 บทที 4 การตังคา่ Nameserver กอ่ นทจี ะถึงขนั ตอนการติดตงั WordPress ใหเ้ ราเช็คค่าต่างๆ ของโดเมน ว่าเรยี บรอ้ ยแลว้ รยึ งั การตงั คา่ ใน สว่ นของโดเมนทเี ราควรเช็คก่อนเรมิ ตน้ WordPress มดี งั นี Nameserver คอื อะไร Nameserver (NS) คอื เป็น IP ของ Web Hosting ทีคณุ ใชบ้ รกิ ารอยู่ ซงึ โดยทวั ไป Nameserver ตอ้ งมี อยา่ งนอ้ ย ตวั เช่น ns1.sample.com, ns2.sample.com เพอื ใหต้ วั ที นนั เป็นตวั สาํ รองในกรณีที ns1 นนั ลม่ ดบู ทเรียนนีบน YouTube: https://youtu.be/YsWJk7csy3Y เชค็ คา่ nameserver nameserver ก็เหมือนบา้ นเลขที ทกุ โฮสตงิ จะมีเลขทีบา้ น อยากใหโ้ ดเมนทเี ราจดไวม้ าแสดงทโี ฮสไหน ตอ้ ง ตงั คา่ nameserver (บา้ นเลขท)ี ก่อน เพราะบางครงั เราอาจจะจดโดเมนทนี ึง แต่ใชโ้ ฮสตงิ อกี เจา้ นงึ นนั เอง วธิ ีการเช็ค nameserver และตงั คา่ nameserver มีดงั นคี รบั จดโดเมนไวท้ ไี หน เขา้ ระบบหลงั บา้ นของให้ ผใู้ หบ้ รกิ ารนนั ไดเ้ ลย สาํ หรบั คนทใี ช้ Hostatom ทาํ ตามนีไดเ้ ลยครบั

27 ใหเ้ ราเขา้ ระบบหลงั บา้ นของ Hostatom จากนนั ใหเ้ ลือกเมนู บรกิ ารของฉนั เราจะเห็นรายชือโฮสทเี ราไดซ้ ือไว้ จากนนั ใหด้ ตู รงทีเป็นสีเขียวๆ คลิกที สินคา้ /บริการทใี ชง้ านอยู่

28 ระบบกจ็ ะพาเขา้ มาหนา้ การจดั การสินคา้ ใหเ้ รามองดลู า่ งๆ จะเหน็ ชือของ nameserver ของโฮสทีเราใช้ งานอยู่ ให้ copy ชือ nameserver เกบ็ ไวก้ อ่ น เพือเตรียมจะเอาไปใสท่ โี ดเมน จากนนั ใหเ้ ลือกเมนู โดเมนของฉนั จากนนั ไปทชี ือโดเมนของเรา ใหค้ ลกิ ทเี ป็น dropdown และใหค้ ลิก จดั การ Nameservers ตอ่ มาใหเ้ ลือกที ใช้ nameservers ทกี าํ หนดเอง ใหเ้ อาชอื nameserver ของโฮสเรา วางลงไปครบั คลิก เปลยี น nameservers ใหเ้ รยี บรอ้ ย

29 วธิ กี ารเพมิ โดเมน ดบู ทเรียนผ่าน YouTube: https://youtu.be/Z4tyAy1S7UU หากเราจดโดเมน และเช่าโฮสตงิ กบั ผบู้ รกิ ารเจา้ เดยี วกนั ในการจดโดเมนครงั แรก ชือโดเมนจะถกู เพมิ เขา้ ไปในโฮสโดยอตั โนมตั ิ แต่หากเราจดโดเมนจากทอี ืน หรือจดโดเมนเพิม เราตอ้ งเป็นคนเพมิ โดเมนเขา้ ไปยงั โฮสตงิ เอง เพราะทางโฮสตงิ เขาไม่มีทางรูว้ า่ โดเมนทจี ดใหม่นี จะไปรนั ทโี ฮสไหนไดค้ รบั วธิ ีการเพมิ โดเมนมขี ันตอนดงั นี เขา้ สรู่ ะบบ Plesk ดว้ ยการคลกิ ที open control panel

30 คลกิ Add Domain จากนนั ใหพ้ ิมพช์ ือโดเมนทีตอ้ งการเพิมลงไป ตกิ เปิดใชง้ าน Let’s Encrypt เพอื ทาํ เว็บใหเ้ ป็น HTTPS ดว้ ย จากนนั คลิก ok ครบั

31 บทที 5 ทาํ HTTPS (SSL ฟรี) ทาํ เวบ็ ใหเ้ ป็น HTTPS คือ การเขา้ รหสั ขอ้ มลู บนเว็บไซตข์ องเรา เพือเพมิ ความปลอดภยั ในการสือสารหรือ สง่ ขอ้ มลู บนเครอื ข่ายอินเทอรเ์ นต็ ครบั เราจะสงั เกตเห็นว่าเวบ็ ไหนทเี ขาเขา้ รหสั ไว้ มนั จะมกี ารแสดงรูปแม่ กญุ แจเอาไวบ้ น browser ลองดจู ากรูปตวั อยา่ งนะครบั วธิ ีการทาํ HTTPS ดบู ทเรียนบน YouTube: https://youtu.be/_EbIm8KuR7c ซงึ เราจะทาํ HTTPS ผา่ นสิงทีเรยี กว่า Let’s Encrypt Free SSL ทาํ ไมตอ้ งทาํ HTTPS การทาํ เว็บเราใหเ้ ป็น https:// อาจช่วยให้ google มองวา่ เวบ็ เรามีคณุ ภาพ ใสใ่ จเรอื งความปลอดภยั ของ ขอ้ มลู ลกู คา้ การจดั อนั ดบั เว็บเรากจ็ ะดขี นึ ไดค้ รบั หากเปรยี บเทียบกบั เว็บทีคลา้ ยกนั แตเ่ ขาไมไ่ ดเ้ ขา้ รหสั เว็บเอาไว้ โดยแนวโนม้ ผมเชือวา่ google จะใหน้ าํ หนกั เกียวกบั การทาํ เวบ็ ใหป้ ลอดภยั เพิมมากขนึ ดว้ ย

32 วธิ ีการทาํ เราจะทาํ ได้ วิธี คอื 1. ตดิ ตงั เองบนโฮสตงิ 2. แจง้ โฮสตงิ ทาํ ให้ วิธกี ารตดิ ตงั SSL by Let’s Encryption บน Plesk เพือทาํ เว็บให้เป็ น HTTPS Login เขา้ สรู ะบบ Control panel ของ Hosting ตวั อย่างวิธีการทาํ ในบทความนี โฮสทผี มเลอื กใชค้ ือ Hostatom ซงึ ระบบ Control panel ของเขาคือ plesk โฮสเจา้ อืนๆ ก็สามารถเปิดใชง้ าน SSL by Let’s Encryption เพอื ทาํ HTTPS ไดเ้ ชน่ เดยี วกนั แค่ว่าหนา้ ตา การตงั คา่ อาจจะไมเ่ หมอื นกนั เฉยๆ

33 ไปทชี ือโดเมนทีตอ้ งการ คลิกที SSL/TLS Certificates (บางเวอรชนั ของ Plesk เขาก็อาจจะเขยี นว่า Let’s Encrypt กใ็ หค้ ลิกทีตวั นแี ทน) คลิกเลือก Get it free

34 คลกิ เลือก Secure the wildcard domain และ Assign the certificate to mail domain จากนนั รอระบบอพั เดทสกั ครูป่ ระมาณ - ชวั โมงครบั วธิ ีเชค็ ว่าโดเมนของเราพร้อมใช้งานแลว้ รึยงั ถา้ ขนึ รูปแบบนี แสดงวา่ โดเมนพรอ้ มใชง้ าน แต่ SSL (HTTPS) ยงั ไม่อพั เดท ใหค้ ณุ รอระบบอพั เดทสกั ครู่

35 ถา้ ขนึ รูปแบบนี แสดงว่าโดเมนและ SSL พรอ้ มใชง้ านแลว้ แต่ถา้ แสดงรูปแบบนี แสดงว่าโดเมนยงั ไมพ่ รอ้ มใชง้ านใหร้ อ - ชวั โมงก่อน หากทาํ HTTPS ตามขนั ตอนแลว้ ติดขดั สามารถแจง้ ทาง Hostatom ทาํ ใหไ้ ดเ้ ลยครบั ทางโฮสบรกิ ารจดุ นี ใหฟ้ รคี รบั

36 บทที 6 การสรา้ ง Subdomain Subdomain คอื อะไร Subdomain คือ โดเมนย่อย สาํ หรบั การแบง่ หมวดหม่เู ว็บ เพือใหผ้ ใู้ ชง้ านเขา้ ใจง่ายๆ สาํ หรบั เว็บทมี ีเนอื หา คอนเทนตท์ ีหลากหลาย เช่น เว็บ kapook จะแบง่ หมวดหม่เู นอื หา เป็นเว็บใหมแ่ ยกขาดจากเว็บหลกั แต่ สรา้ งบน Subdomain แทน เชน่ news.kapook.com, travel.kapook.com เป็นตน้ ประโยชนข์ อง Subdomain x แตส่ าํ หรบั บุคคลทวั ไป ทไี มไ่ ดเ้ ป็นเว็บขนาดใหญ่ เราไมจ่ าํ เป็นตอ้ งแบง่ เนือหา แยกออกมาเป็นอกี เวบ็ ก็ได้ แต่เราจะใช้ Subdomain ไวเ้ ป็นเว็บสาํ หรบั การฝึกฝนทาํ เว็บนนั เอง x เป็นการใช้ Subdomain สรา้ งเว็บบนโฮสจรงิ แทนการจาํ ลอง server บนเครืองคอมพิวเตอร์ x ซงึ ผมมองว่า การสรา้ ง Subdomain เพอื เอาไวฝ้ ึกทาํ เว็บ สะดวกกวา่ การจาํ ลอง Server บนเครือง คอมพิวเตอรค์ รบั

37 การสร้างเวบ็ สาํ หรับฝึ กซอ้ มทาํ ได้ วิธี 1. จาํ ลอง Server 2. ทาํ บน Subdomain ตวั อยา่ งการใชง้ านเว็บสาํ หรบั ฝึกซอ้ ม สมมตุ ิ ผมรบั งานทาํ เว็บมา งาน ผมจะสรา้ งเว็บบน Subdomain ก่อน เช่นทาํ แบบนี ecloudtec.padveewp.com หากเราทาํ เว็บบน Subdomain ขอ้ ดีคือเราสามารถสง่ ตวั อย่างเว็บทเี รากาํ ลงั ทาํ ไปใหล้ กู คา้ ดไู ดเ้ ลย หากลกู คา้ พอใจ เราก็ทาํ การยา้ ยเว็บนนั มาลงบนโดเมนจรงิ ทเี ว็บนไี ดเ้ ลย ecloudtec.com อา่ นเพิมเตมิ : การยา้ ยเว็บ WordPress ดว้ ยปลกั อิน All in one Migration เชค็ ความเรยี บร้อยของ Let’s Encrypt SSL Login เขา้ สรู่ ะบบ Plesk control panel เลอื กชอื โดเมน คลิกที SSL/TLS Certificates

38 ถา้ มีสญั ลกั ษณ์ Secure สีเขียนขนึ ตามรูปแสดงวา่ ssl บนโดเมนหลกั พรอ้ มใชง้ านแลว้ แต่ถา้ ยงั ไมข่ ึนสี เขียว ใหแ้ จง้ โฮสทาํ Wildcard SSL ใหไ้ ดเ้ ลยครบั วธิ กี ารสร้าง Subdomain บน Plesk ดวู ิธีทาํ บน YouTube: https://youtu.be/o_dig6KPIg0 หลกั จากเขา้ ส่รู ะบบ Plesk ใหค้ ลิก Add Subdomain พิมพช์ ือ Subdomain ทตี อ้ งการลงไป และอย่าลืมเลือกชือโดเมนหลกั ทีตอ้ งการดว้ ย (สาํ หรบั คนทมี หี ลาย โดเมน) คลกิ OK เป็นอนั เรยี บรอ้ ย สาํ หรบั การสรา้ ง Subdomain บน Plesk ครบั

39 **หมายเหตุ ตวั subdomain ยงั ไมส่ ามารถใชง้ านไดท้ นั ที คณุ ตอ้ งรอใหร้ ะบบมนั อพั เดทสกั ครูน่ งึ กอ่ น ประมาณ - ชวั โมงครบั เปิ ดใช้งาน SSL บน Subdomain หลกั จากทเี ราเพิม Subdomain เรยี บรอ้ ยแลว้ ทรี ะบบ Plesk จะปรากฏชอื ซบั โดเมนนนั ขนึ มา ใหเ้ ราเลอื ก ชือ Subdomain ทเี ราตอ้ งการทาํ SSL คลกิ ที Hosting & DNS และคลกิ ที Hosting Settings มองหาคาํ ว่า Certificate เลือก Lets Encrypt ทเี ป็นชือโดเมนหลกั และในวงเลบ็ เป็นชือ Subdomain ทเี รา พงึ สรา้ งไป คลิก ok ใหเ้ รียบรอ้ ยครบั

40 เช็คความเรยี บร้อยของ Subdomain หลงั จากทเี ราเปิดใช้ SSL ที Subdomain ใหร้ อการอพั เดทของระบบประมาณ - นาที แลว้ ลองเอาชือ Subdomain ทคี ณุ สรา้ งไวไ้ ปเปิดบน browser ดู ถา้ ขึนหนา้ ตาดงั รูป แสดงว่า Subdomain และ SSL พรอ้ มใชง้ านแลว้ หากมีปัญหาในการสรา้ ง Subdomain หรอื เปิดใชง้ าน SSL ผมแนะนาํ ใหค้ ณุ ไปติดต่อยงั ผใู้ หบ้ รกิ ารโฮสตงิ และใหเ้ ขาทาํ ใหเ้ ลยก็ไดค้ รบั

41 บทที 7 วิธีตดิ ตงั WordPress จากบทเรียน WordPress คืออะไร ผมไดอ้ ธิบายไวแ้ ลว้ ว่า การสรา้ งเว็บดว้ ย WordPress จะมีองคป์ ระกอบ อย่ดู ว้ ยกนั สว่ น คือ 1. ตวั WordPress ทเี อาไวใ้ ชเ้ ป็น Platform 2. ตวั ธีม ทเี อาไวใ้ ชใ้ นเรืองการออกแบบดา้ นความสวยงาม 3. ตวั WooCommerce ทเี อาไวท้ าํ ระบบตระกรา้ สนิ คา้ 4. ตวั ปลกั อนิ เอาไวส้ รา้ งระบบหรอื ฟังชนั เพมิ เตมิ ดงั นนั ขนั ตอนแรกเลย ก่อนทเี ราจะสรา้ งเวบ็ ไซต์ หรือออกแบบเวบ็ ใหม้ นั สวยงาม เราตอ้ งติดตงั WordPress ลงทโี ดเมน หรือ Subdomain ของเราใหเ้ รียบรอ้ ยก่อน ถา้ เปรียบเทียบใหเ้ ห็นภาพ เหมอื นตอนทเี ราซอื คอมพิวเตอรม์ าใหม่ๆ กอ่ นทีเราจะติดตงั พวกโปรแกรม Photoshop หรือโปรแกรมตดั ต่อวีดโิ อได้ เราตอ้ งลง Windows ก่อนนนั เอง

42 ขันตอนการติดตัง WordPress เขา้ ไปสรู่ ะบบ Control panel บนโฮสก่อน จากนนั มองหาคาํ วา่ WordPress ทกุ โฮสว่ นใหญ่จะมีตวั ชว่ ย ตดิ ตงั WordPress (WordPress Toolkit) มาใหอ้ ยแู่ ลว้ แค่วา่ หนา้ ตาอาจจะแตกตา่ งกนั ไปบา้ ง เมอื เขา้ สหู่ นา้ ระบบ WordPress Toolkit ใหค้ ลกิ ทคี าํ ว่า Install

43 สาํ หรบั หนา้ ตงั คา่ ใหเ้ ลอื กการตงั คา่ ตามรูปตวั อย่างไดเ้ ลยครบั ระบบของ Plesk จะถามเราวา่ ลงปลกั อินอะไรเลยมยั ตรงจดุ นใี หเ้ ราคลิก No, thanks ไปกอ่ นครบั ผม

44 เราก็ลองเชค็ ดวู ่าตวั WordPress ทเี ราลงไป แสดงผลหรอื ไม่ ใหค้ ลกิ ที open website ไดเ้ ลยครบั หากขนึ หนา้ ทมี คี าํ วา่ Hello world! แสดงวา่ เว็บของเราไดล้ ง WordPress เรียบรอ้ ยแลว้ ดบู ทเรียนนผี า่ น YouTube: https://youtu.be/MxXdwm_nDHA