WordPress Meetup 3 & 4 – สอนทำ Plugin & ทำ Theme WordPress ขายในเว็บ WordPress

designil

สอนทำ Them WordPress ขายในเว็บ WordPress หลาย ๆ ท่านน่าจะทราบแล้วว่าเว็บไซต์ Designil.com สร้างขึ้นมาด้วย WordPress และผมก็ชอบใช้ CMS ตัวนี้มาก ทั้งในเว็บส่วนตัวและเว็บลูกค้า (เคยเอาไปใช้ใน เว็บไซต์ Genie Records มาแล้ว) ซึ่งไม่นานมานี้ก็ได้ไปร่วมงานหนึ่ง ชื่อว่า WordPress Meetup คWP Meetup เป็นงานรวมตัวคนใช้ WordPress ในไทย ครั้งนี้เราได้พูดถึงเรื่องของทำ Theme WordPress ขายใน WordPress.comรับ

WordPress Meetup คืออะไร

WordPress Meetup at Hubba Thailand ทำ Theme WordPress
WordPress Meetup #4 at Hubba Thailand – รูปโดย Hubba Thailand เรื่อง ทำ Theme WordPress

WP Meetup เป็นงานที่จัดขึ้นเพื่อรวบรวมผู้ใช้ WordPress ในประเทศไทยเป็น Community ใหญ่ มาแชร์ความรู้กัน ช่วยเหลือกันครับ ซึ่งจัดขึ้นโดยคนรัก WordPress เพื่อคนรัก WordPress และเปิดรับทุกท่านที่สนใจมาช่วยกันแชร์ความรู้ได้

WordPress เป็น CMS ที่ทุกคนเป็นเจ้าของ ใครก็ตามสามารถมาช่วยกันทำให้มันดีขึ้นได้ ทั่วโลกมีผู้ที่ช่วยพัฒนา WordPress ในด้านต่าง ๆ มากมาย เช่น ช่วยแปลภาษา ช่วยแก้โค้ด ช่วยเขียนฟีเจอร์ใหม่ ช่วยออกแบบ UI ต่าง ๆ ฯลฯ ซึ่งใครถนัดด้านอะไรก็ช่วยในด้านนั้นครับ ไม่ต้องเก่งมากก็ได้ แต่ขอให้มีใจรัก WordPress

ซึ่งงาน WP Meetup ก็อยากให้คนรัก WordPress ช่วยกันสร้าง Community คนใช้ WordPress ให้ใหญ่ขึ้น จนสามารถจัดงาน WordCamp ในไทยได้ (เป็นงาน WordPress แบบ Official ของแต่ละประเทศ ซึ่งการจะจัดได้จำเป็นต้องมี Community ที่ Active มากในประเทศนั้นครับ) และช่วยกันพัฒนา WordPress ในทางใดก็ทางหนึ่งครับ

WordPress Meetup เสียค่าเข้ามั้ย เข้าร่วมได้ยังไง

WordPress Meetup Thailand 3 Plugin Development ทำ Theme WordPress
บรรยากาศก่อนเริ่มงาน WordPress Meetup 3

WP Meetup เป็นงานฟรี ซึ่งครั้งที่ 3 และ 4 นั้นได้ Hubba ซึ่งเป็น Coworking Space ที่น่านั่งทำงานสุด ๆ ช่วยสนับสนุนสถานที่ให้ครับ ต้องขอขอบคุณมา ณ ที่นี้ด้วย

สำหรับท่านที่สนใจเข้าร่วม WordPress Meetup ในครั้งต่อ ๆ ไป สามารถติดตามข่าวสารได้จากใน Facebook Group WordPress Alliance – พูดคุย ปรึกษา แนะนำ WP กด Join เข้ามาได้เลยครับ อย่าแสปมโฆษณาก็พอครับ

ในงาน WP Meetup 3 พูดถึงเรื่องการสร้าง WordPress Plugin ขั้นพื้นฐาน โดยคุณ Shininchi ซึ่งเป็น WordPress Plugin Developer จากญี่ปุ่นเป็นผู้พูดครับ คุณ Shininchi เคยจัดงาน WordCamp ในประเทศญี่ปุ่นมาแล้ว และตอนนี้ได้ย้ายมาทำงานในประเทศไทย ซึ่งถือเป็นโอกาสดีที่จะได้คนเก่ง ๆ มานำทางให้จัด WordCamp ในไทยได้สำเร็จ

ส่วนงาน WP Meetup 4 พูดถึงการทำ Theme WordPress เพื่อขายใน WordPress.com และช่วงถาม – ตอบคำถามมีการพูดถึงการขายธีมใน Themeforest.net ด้วยครับ โดยผู้พูดคือพี่เม่น Mennstudio.com นั่นเองครับ หลังจากนั้นคุณ Shinichi ก็มาพูดถึง WordPress Community ในญี่ปุ่น ซึ่งมีผู้เข้าร่วมเป็นพันคนครับ งานใหญ่มาก

บทความที่เกี่ยวข้อง: 5 ความจริงเกี่ยวกับ Themeforest ที่คนอยากขายธีมต้องรู้

ในวันนี้ผมจะมาสรุปเกี่ยวกับงาน WordPress Meetup แต่ละครั้งให้ฟังนะครับว่าได้ความรู้อะไรมาบ้าง

WP Meetup 3 – Plugin Development (for beginner)

WordPress Meetup Thailand 3 ทำ Theme WordPress

งาน WordPress Meetup ครั้งที่ 3 เป็นหัวข้อเกี่ยวกับการสร้างปลั๊กอิน WordPress ขั้นพื้นฐาน ซึ่งคุณ Shinichi สอนโดยใช้ภาษาอังกฤษทั้งหมด แต่ก็ไม่น่าเบื่อครับเพราะพี่แกเป็นคนอารมณ์ดี มีมุขตลอด อ่านภาษาไทยออกด้วย สไลด์ก็ทำออกมาได้เข้าใจง่ายมากครับ บางทีฟังไม่ต้องเข้าใจมาก ดูสไลด์ก็เก็ตหมดแล้ว

ซึ่งสไลด์สอนทำ WordPress Plugin ในครั้งนี้ก็อยู่ด้านล่างนี้แล้วครับ มีภาษาไทยประกอบด้วย น่าจะเข้าใจกันได้ไม่ยากครับ

ผมสรุปในสไลด์มาได้คร่าว ๆ ดังนี้ครับ

การสร้าง WordPress Plugin ขั้นพื้นฐาน

การสร้าง Plugin WordPress คือ การสร้างไฟล์ PHP ไฟล์หนึ่ง ที่ในโค้ดมีการบอกว่าเป็นปลั๊กอิน โดยใส่รายละเอียด เช่น ชื่อปลั๊กอิน, ชื่อผู้เขียน, Version, ลิขสิทธิ์, เว็บไซต์ผู้เขียน ฯลฯ เข้าไป และเขียน PHP เพื่อบอกว่าจะให้ปลั๊กอินนี้ทำอะไรได้บ้าง

ก่อนจะเขียนปลั๊กอินได้นั้นเราต้องรู้จัก Actions กับ Filters ใน WordPress ก่อน ปกติเวลาเราเปิดเว็บไซต์ที่ใช้ WordPress จะมีการอ่านข้อมูลเป็นลำดับหลายขั้นตอนกว่าจะได้หน้าเว็บไซต์ 1 หน้า ซึ่งระหว่างการทำงานแต่ละขั้นตอนนั้นเราก็สามารถเขียนโค้ด PHP แทรกเข้าในระหว่างลำดับต่าง ๆ เพื่อแก้ไขข้อมูลที่จะแสดง หรือเพิ่มข้อมูลที่เราต้องการเข้าไปได้

ขั้นตอนการทำงานของ WordPress ทำ Theme WordPress
Process การทำงานของ WP กว่าจะโหลดเว็บไซต์ได้ 1 หน้า – จากสไลด์ของคุณ Shinichi

Action VS Filter ใน WordPress Plugin

Action ใน WordPress เป็นการเพิ่มข้อมูลเข้าไป เช่น เพิ่มประโยค Copyright ลงใน Footer ของเว็บไซต์ หรือเพิ่ม Javascript เข้าไปในส่วนบนของเว็บไซต์

Filter ใน WordPress เป็นการแก้ไขข้อมูลเดิม เช่น ดึงเนื้อหาบลอคมา แล้วเติมคำว่า คะ, ค่ะ ลงไปท้ายประโยคทุกประโยคก่อนแสดงผล (อันนี้เป็นตัวอย่างปลั๊กอินที่คุณ Shinichi สอนทำในงานครั้งนี้ด้วยครับ)

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

ในปัจจุบันมี 500+ Actions และ 1000+ Filters ให้เราเลือกใช้ในการเขียนปลั๊กอิน โดยในปลั๊กอิน 1 ตัวอาจจะมีการใช้ Action, Filter กี่อันก็ได้นะครับ

เว็บไซต์ศึกษาเรื่องการเขียน WordPress Plugin

WordPress Developer Reference
Developer Reference – Section ใหม่ล่าสุดสำหรับผู้พัฒนา WordPress Plugin / Theme
  • Codex – Official Documentation ที่เขียนทุกอย่างเกี่ยวกับการใช้ WordPress ครับ ตอนที่ผมเป็น WordPress Developer ก็มาศึกษาความรู้จากที่นี่บ่อย ต้องใช้ function ไหนทำอะไร ในนี้มีบอกละเอียด โดยเฉพาะอย่างยิ่งในหน้า Plugin API
  • Developer Reference – Section ใหม่ในเว็บไซต์ WordPress.org ที่จะช่วยให้การค้นหา Function, Class, Method, Hook (Action / Filter) ต่าง ๆ ง่ายขึ้นกว่าเดิมครับ เมื่อก่อนไม่มีหน้านี้ ผมก็ใช้วิชางม Codex ผ่าน Google กันไปครับ

ซึ่งหลังจากจบงาน คุณ Shinichi ก็บอกว่าครั้งหน้าจะมีการพูดเรื่องการทำ Theme WordPress ขายใน WordPress.com ครับ ซึ่งกระแสการทำธีม WordPress ขายในประเทศไทยมีมาตั้งแต่ในเว็บไซต์ Themeforest.net แล้ว แค่ดูหัวข้อก็รู้เลยว่ารอบหน้าคนมากันเยอะแน่นอน

WordPress Meetup 4 – การขายธีม บน WordPress.com

WordPress Meetup Thailand พี่เม่น ทำ Theme WordPress

วันนี้คนมาเยอะตามคาดครับ อาจจะเพราะเป็นวันอาทิตย์ด้วยคนเลยมากันสะดวก (งานครั้งที่แล้วจัดวันธรรมดาครับ ผมต้องรีบออกจากงานก่อนเวลาเพื่อมาให้ทัน)

WordPress Meetup ครั้งที่ 4 พูดถึงเรื่องการขายธีมผ่าน WordPress.com ซึ่งเป็นตลาดใหม่ เมื่อก่อนการวางขายธีมใน WordPress.com จะทำได้เฉพาะคนที่ถูกทางทีมงานเชิญไปทำเท่านั้น แต่ตอนนี้เปิดให้ทุกคนสามารถส่งธีมไปวางขายได้แล้ว

Selling WordPress Theme

สำหรับเนื้อหาในการพูดวันนี้ทั้งหมด พี่เม่นได้เขียนไว้ในบลอคของตัวเองแล้ว สามารถไปอ่านได้ที่ การสร้างธีมที่เป็นมาตรฐาน และขายผ่าน WordPress.com ครับผม เขียนไว้ดีมาก ๆ ครับ

เนื่องจากพี่เม่นเขียนไว้ดีแล้ว ผมก็จะมาเสริมเกี่ยวกับสิ่งที่พูดคุยกันเพิ่มเติมที่จดมาให้ละกันครับ
ระบบ Custom Design ใน WordPress.org

WordPress Custom Design Panel ทำ Theme WordPress
ตัวอย่างระบบ Custom Design ในการเปลี่ยนชุดสี – รูปจาก wordpress.com

Custom Design เป็นระบบเสริมใน WordPress.org ที่จะทำให้ User สามารถปรับแต่ง Font / สี / CSS เพิ่มเติมเองได้ ซึ่งผู้ใช้จะต้องจ่ายเงิน $30 ต่อปี ถึงจะใช้บริการในส่วนนี้ได้

เจ้าของธีมสามารถเขียนชุดสีเป็น Preset ให้กับธีม เพื่อให้เจ้าของบลอคสามารถมาเลือกชุดสีจากในหน้าต่างของ Custom Design ได้เลย นอกจากนั้นยังสามารถเปลี่ยน Font ไปใช้ฟ้อนต์เสียเงินจาก Typekit.com ในธีมได้อีกด้วย (Typekit เป็นบริการ Webfont ออนไลน์ที่มีฟ้อนต์เทพ ๆ ให้บริการมากมาย เช่น Helvetica, Proxima Nova ปัจจุบันถูก Adobe ซื้อไปแล้ว)

หรือถ้าใครเขียนโค้ดเป็น ก็สามารถแก้ CSS สด ๆ เองได้เลย ซึ่งจริง ๆ แล้วผมคิดว่าฟีเจอร์นี้ถ้าต้องเสียเงินใช้ คนเป็น Developer คงอึดอัดน่าดูเลยครับ ด้วยเหตุนี้จึงน่าจะบอกได้เป็นนัย ๆ ว่าคนใช้ WordPress.com ส่วนใหญ่เป็น Blogger ทั่วไปที่เขียนโค้ดไม่ค่อยเป็น ถ้าทำธีมขายใน WordPress.com ให้เหมาะกับคนกลุ่มนี้น่าจะขายได้ดี

Plugin สำหรับเทส Theme ก่อนส่งขาย

WordPress Plugin Theme Development ทำ Theme WordPress
  • Theme Check – WordPress Plugin สำหรับรันเพื่อตรวจสอบว่า Theme ของเรามีโค้ดไหนที่ไม่ตรงตามมาตรฐานการเขียนธีม WordPress มั้ย ซึ่งธีมที่จะส่งขายได้ต้องเป๊ะในส่วนนี้ครับ (แม้แต่ Themeforest.net ก็มีการเช็คเรื่องพวกนี้เหมือนกัน)
  • VIP Scanner – ตัวนี้พี่เม่นบอกว่าคล้าย ๆ ตัวข้างบนครับ Plugin ตัวนี้จะแสกน Theme ของเราเพื่อดูว่าโค้ดตรงตามมาตรฐานมั้ย
  • Theme Unit Test – อันนี้ไม่ใช่ปลั๊กอิน แต่เป็นไฟล์ข้อมูลตัวอย่าง WordPress สำหรับทดสอบ Theme ว่าเราเขียน CSS ครอบคลุมเนื้อหาประเภทต่าง ๆ ครบหรือยัง มีฟังก์ชั่นอะไรที่เราขาดไปใน functions.php มั้ย

บทความที่เกี่ยวข้อง: รวมปลั๊กอิน (Plugin) เจ๋ง ๆ ของ WordPress แห่งปี

หลังจากพี่เม่นพูดจบ คุณ Shinichi ก็มาพูดถึง WordPress Community ในญี่ปุ่นครับ ซึ่งอลังการกว่า WordPress Community ในไทยมาก ในญี่ปุ่นมีงาน WordPress ย่อย ๆ ประจำเมืองทุกเดือน และมีงานใหญ่ประจำปี โดยในปีนี้ Matt ผู้ก่อตั้ง WordPress ก็มาร่วมงานด้วย

มีการพูดถึง Mascot ในญี่ปุ่นตัวหนึ่ง ชื่อ วาพู ซึ่งเป็น Mascot ประจำงาน WordPress ในญี่ปุ่น และมีการดีไซน์ออกมาหลายเวอร์ชั่นมาก

wapuu
วาพู (Wapuu) – Mascot ประจำงาน WordPress – รูปจาก Kobe-Beauty
Wapuu Collection WordPress
Wapuu ในงาน WordPress ต่าง ๆ ทั่วญี่ปุ่น – รูปจาก Kobe-Beauty

ซึ่งคุณ Shinichi ก็บอกว่าอยากหาดีไซเนอร์มาทำ วาพูเวอร์ชั่นไทย ครับ เพราะวาพูตัวนี้เป็นลิขสิทธิ์แบบ GPL สามารถโหลดไฟล์ SVG มาแก้ไข และนำไปใช้ได้ฟรีเลย ระหว่างนั่งฟังเค้าบรรยายผมเลยลองทำดูในโปรแกรม Sketch ครับ (Sketch เป็นโปรแกรมทำ UI, Web Design ที่ใช้ง่ายมากครับ ผมเป็นโปรแกรมเมอร์ยังใช้ได้ อ่าน บทความแนะนำ Sketch จาก Designil กันได้เลย)

Wapuu Thailand WordPress
Wapuu in Thailand by Designil

โอเคครับ หน้าตามันรับไม่ได้มาก T_______T เดี๋ยวรอ Designer เก่ง ๆ มาทำนะครับ เร็ว ๆ นี้น่าจะได้ชมกัน

คุณ Shinichi ได้ย้ายมาทำงานในประเทศไทย ซึ่งเค้าอยากให้คนที่ชอบ WordPress มาช่วยกันสร้าง Community ให้ใหญ่ และสามารถจัด WordCamp ในประเทศให้ได้ครับ โดยเค้าเริ่มจากจัด WordPress Meetup เล็ก ๆ ขึ้นมาก่อน ซึ่งจากที่ผมได้คุยกับเค้ามา รู้สึกประทับใจในความมุ่งมั่นของเค้ามาก และอยากช่วยให้มันสำเร็จครับ

เพราะฉะนั้นถ้าใครอยากพูดคุยเรื่อง WordPress แวะเข้ามาที่ กรุ๊ป WordPress Alliance บน Facebook ได้เลยครับ มาช่วยกันแชร์ความรู้ ถามตอบปัญหากัน และจะมีการแจ้งข่าวเรื่อง WordPress Meetup ให้ตลอดครับผม

ท่านใดที่ต้องการช่วยเหลือ WordPress Meetup ก็สามารถติดต่อมาทาง Message ในเพจ Designil ได้เลยครับ ทำอาชีพอะไรก็ได้ครับ ไม่ต้องเป็นเฉพาะโปรแกรมเมอร์หรือดีไซเนอร์ ถ้ามีใจรักใน WordPress เรามาช่วยกันทำให้สังคม WordPress ในไทยพัฒนาไปเรื่อย ๆ กันครับ

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

designil

designil

Data engineer & WordPress Developer ทำงานที่บริษัทแคนว่า ซิดนีย์ออสเตรเลีย ปัจจุบันเป็นเจ้าของเว็บไซต์ Designil, DataTH ชอบอ่านบทความใหม่ๆ ตลอดเวลา และชอบสรุปเรื่องราวเกี่ยวกับเทคโนโลยีให้ภาษาที่เข้าใจง่าย ยินดีที่ได้รู้จักทุกคนนะครับ
บทความทั้งหมด