wapu_thailand

สรุปงาน WordCamp 2018 ทั้งหมด 2 วัน

วันนี้ผมจะมาสรุปงาน WordCamp 2018 ขอเล่าคราวๆก่อนว่างานนี้คือ งานยิ่งใหญ่ที่สุดของคนทำ wordpress หรือใช้งาน wordpress ก็ดีซึ่งจะมารวมตัวกันและมีห้องสัมนาให้ฟังทั้งแบบเทคนิคเชิงลึก เทคนิคด้าน Dev ( การพัฒนาตัว wordpress ) โดยจะแบ่งเป็น 2 วันวันแรกคือ Contributor day และ Conference Day เอาล่ะเป็นอย่างไรไปอ่านกันเลย !!!

Table of Contents

Contributor Day

wapu_thailand

วันแรกจะเป็นวัน Contibutor day มันคืออะไรล่ะ มันคือวันที่เปิดให้คนทั่วไปมาช่วยเหลือชุมชน ( Community ) ของ wordpress โดยจะมีหลายๆส่วนให้เราได้ช่วยเหลือ

ตอนผมไปเขาจะแบ่งออกเป็น 6 โต๊ะตามนี้

contributor_day_wordpress
6 section

อธิบายเพิ่มเติมนะครับ สำหรับแต่ละหัวข้อเพื่อว่าผู้อ่านสนใจและอยากมีส่วนช่วยเหลือ ส่วนของผมไปโต๊ะ Theme ครับเดี๋ยวจะเล่าให้ฟัง

wordcamp_contribute_day
นั่งทำไรกันอ่ะ =0= ?

CLI ( command line interface )

เป็นส่วนเกี่ยวกับการช่วยเหลือด้าน command line หากผู้ไม่รู้มันคือเวลาเราเปิดโปรแกรม Terminal ใน mac หรือ cmd หน้าจอดำๆตัวอักษรสีเขียวๆ เหมือนหนังเรื่อง Maxtrix คือก่อนพวกโปรแกรมมันจะเป็นแบบคลิกๆเหมือน window ที่คุณใช้กันมันต้องผ่านการทำงานด้วยคำสั่งหน้าจอดำๆนี่ก่อนครับ เอาล่ะนอกเรื่องไปไกล คือ โต๊ะนี้จะแนะนำว่าเวลาเราจะช่วยเหลือเพิ่มคำสั่งใหม่หรือแก้ไขต้องทำอย่างไร และมีการแนะนำจากคนที่เฝ้าโต๊ะนั้นๆ ว่าต้องทำอย่างไร

wordcamp_contribute_day
โต๊ะนี้ทำไรกัน

Community

อันนี้ไม่ได้ถามรายละเอียดแต่อ่านใน wordpress.org ก็คือประมาณว่าช่วยเหลือการตอบคำถามใน webboard อ่านเพิ่มเติมได้ตรงนี้

ซึ่งไม่ต้องเก่งมากหลักๆคุณสามารถช่วยเหลือตรงนี้ได้ตามนี้เลย

  • ตอบหัวข้อต่างๆที่คุณมีความสามารถตอบได้เช่น เขาหาวิธีสร้าง page ไม่เจอคุณก็อาจจะสร้างเป็นก็ช่วยเหลือเขาได้ครับ
  • ตอบคำถามในแง่บวก ไม่ใช่ท้าเตะต่อยนะครับ แฮร่ คนไม่รู้เราก็ต้องช่วยเหลือและค่อยๆบอกเขาครับ
  • พยายามตอบกลับ ( reply ) ใน topic หรือกระทู้นั้นๆ

อยากช่วยเหลือแล้วทำยังไงทำตามนี้เลย

CORE

อันนี้น่าจะของนักพัฒนาเลยเพราะว่าต้องเข้าไปช่วยเหลือ code ส่วนหลักๆ ของตัว wordpress เลยโดยทาง wordpress ก็ไม่ได้ปล่อยให้คุณลอยคออยู่กลางทะเลนะครับมีการช่วยเหลือและมีแบบ step ในการช่วยเหลือเลยแต่คุณต้องอ่านเพิ่มเติมและมี code standard ให้อีกด้วย อ่านทางนี้ได้เลย https://make.wordpress.org/core/handbook/

Ployglots

โต๊ะนี้ผมคิดว่าทุกคนน่าจะช่วยเหลือได้ครับ คือการช่วยแปลนั่นเอง โดยการแปลจะมีขั้นตอนเหมือนๆกันก็คือต้องมี account ใน wordpress.org ก่อนแล้วก็ทำการเข้าหัวข้อ translate โดยการแปลเราไม่ต้องกลัวนะครับคุณเริ่มแปลแค่เลือกคำ โดยคำจะเป็นพวกหลังบ้าน wordpress เนี้ยแหละครับพวกคำแจ้งเตือน คำอธิบาย อะไรพวกเนี้ยโดยการแปลของคุณจะไม่ได้แปลแล้วไปโผล่ทันทีไม่ต้องกลัวนะครับ เมื่อคุณแปลจะมีเจ้าหน้าที่หรือคนที่ช่วยเหลือในนั้นมาดูให้อีกทีครับ สามารถดูรายละเอียดจากตรงนี้ได้ครับ

https://www.meetup.com/Bangkok-WordPress/events/242761335/

ซึ่งมีการจัดในไทยแล้วหลายครั้งครับ

WordPress User Manual for Thai

ขอข้าม theme ไปก่อนเพราะน่าจะยาวสุดเพราะผมมีส่วนร่วมในครั้งนี้อีกด้วย อันนี้น่าจะช่วยเหลือการทำคู่มือการใช้งาน wordpress สำหรับคนทั่วๆไป โดยมีพี่เม่นเป็นคนผลักดันหลักๆครับ สามารถดูได้ทางนี้เลย https://wpman.org/

THEME

wordcamp_contribute_day
Theme

โอเคมาถึงหัวข้อที่ผมได้มีส่วนร่วมทั้งวันเลยกับโต๊ะนี้ โดยเรื่อง Theme ให้เรามีการช่วยเหลือเรื่องการ Review Theme นั่นเอง โดยการจะมา join โต๊ะนี้ได้อาจจะต้องมีความสนใจในการเขียน theme มาก่อน ทางโต๊ะไม่ได้สอนทำนะครับ แค่สอนว่าเวลาเราจะเอา Theme คนอื่น ย้ำ! Theme ของคนอื่น มา Review ก็จะมี Guide Line ว่าต้องตรวจเช็คตรงไหนอย่างไร โดยผมได้ทดสอบ Review และปัจจุบัน ณ ตอนที่เขียนบทความ กระบวนการ Review ของผมได้สำเร็จลงแล้วครับมาดูกันว่าทำอย่างไร

อย่างแรกให้คุณต้องสมัครสมาชิก wordpress.org ก่อนนะครับ เสร็จแล้วให้เข้า Link นี้ครับ https://make.wordpress.org  โดยเลือกเมนูว่า Get invoke เลือกหัวข้อ Theme ตามรูปด้านล่างเลยครับ

contributor_day_wordpress_theme

เลือก Become a Reviewer ตามภาพด้านล่างครับ

become_a_reviewer_theme

ในหน้านั้นคุณจะสามารถอ่านรายละเอียดการช่วยเหลือ Review ว่าต้องทำอะไรอย่างไร สังเกตุทางด้านซ้ายมือจะเห็น ปุ่ม “Review a Theme” ปุ่มนี้คุณจะกดได้เมื่อคุณพร้อมแล้วนะครับ เพราะบางครั้งจะ Review theme คุณอาจจะต้องมีเวลาว่างพอหน่อย โดยเราจะให้เวลาเรา 2 สัปดาห์ถ้าเราไม่ว่าง theme นั้นก็จะถูกโยนไปให้คนอื่น ให้เรารู้สึกผิดเบาๆ โอเคหลังใจพร้อม กายพร้อมกดกันเลย *จึ้ก* เมื่อคุณกดแล้วจะเจอภาพด้านล่านะครับ

review_theme
review_theme

ยัง !!  ยังมีคำเตือนให้คุณได้ระถึกอีกแต่เราก็พร้อมแหละกดปุ่ม “Request a theme to review” โอเคเมื่อคุณกดแล้วจะมี email ส่งมาให้คุณว่าเขาได้ assign theme มาให้เราแล้วหน้าตาของ ticket ที่เรารับหน้าที่มาจะเป็นแบบนี้ครับ

review_theme1

โดยเราต้อง set up เครื่องของเราให้พร้อมลง wordpress ในเครื่องเราเพื่อจะทำการ downlaod theme มาทดสอบบนเครื่องเราครับ โดยเราจะสามารถดูย้อนไปว่าก่อนหน้าเรามีคน review ไว้หรือเปล่าเขาไปเช็คเจออะไรบ้าง ในหน้านั้นจะมี comment จากคนที่ reivew ก่อนเราครับ ก็ให้เราทำการเช็ค function ต่างๆ guide line จะมีบอกหมดแต่ในเบื้องต้นให้คุณทำการ downlaod plugin theme check มาก่อนครับ แล้วลองรันดูว่ามันผ่านไหม ถ้าสมมติไม่ผ่านตั้งแต่ตรงนี้คุณก็แคปภาพแล้วไป comment พร้อมเขียนว่ายังไม่ผ่านนะเพราะอะไร

โดยใน theme appgate ผมก็ทำการ check พวก code ด้วยโดย ulrich คนที่ค่อยช่วยเหลือโต๊ะนี้เขาก็จะให้คำแนะนำว่าเขียนยังไง ตรวจสอบและ refactor code ให้เราดูว่าตรงไหนทำอะไรผมก็ตรวจไปเรื่อยๆก็เจอ bug นิดหน่อยต้องขอบคุณน้องเนส https://www.facebook.com/Jasdaporn.chaitan ( น้องทำงานที่ลำปางนะครับเก่งมากทำได้หมดเกี่ยวกับ wordpress ) และก็ comment ตอบเขาไปซึ่งทุกๆครั้งที่เราทำการ comment ระบบจะส่งเมลมาแจ้งเราอีกด้วย จนสุดท้ายเมื่อเขาแก้ไขตามที่เราบอกก็ทำการกด resolve => approved ครับ

approved

ก็ไม่ใช่ว่าพอผ่านจากเราแล้ว theme นั้นจะขึ้นใน wordpress.org นะครับ จะต้องผ่านไปให้คนที่เป็นนัก Reviwer ที่เชี่ยวชาญกว่าเราให้เขา approve ถึงจะผ่านครับ

ช่วยเหลือทำไม ?

เอาจริงๆคงเป็นคำถามหลายๆคนคิดว่าเราจะมาเหนื่อยวันนี้ทำไม ไม่ได้อะไรเลย อย่างผมเนี้ยผมก็เพิ่งเคยมางานนี้ครั้งแรกนะครับ ซึ่งเอาจริงๆหลังจากได้ช่วยเหลือชุมชนแล้วผมก็รู้สึกว่า มันดีนะที่เราได้ช่วยเหลือและส่งต่อยกตัวอย่าง theme ที่ผม review ไปถ้าสังเกตุคือ เขาทำ theme นี้และส่งเข้ามาเป็นเวลา 2 เดือนแล้วนะครับ คิดดูถ้าพวกเราไม่ช่วยเหลือ theme ฟรี เน้นย้ำนะครับ ฟรี อันนี้ก็จะไม่ได้ถูกปล่อยออกมา ซึ่งคนที่เขาช่วยเหลืออยู่ตรงกลางนั้นเขาก็ Review นะแต่คนเขาก็ไม่สามารถดูได้หมดหรอก เมื่อเราพอจะช่วยเหลือได้เราก็ช่วยเหลือและส่งต่อไปครับอันนี้มันตอบโจทย์ตัวผมเองก่อนว่า ผมรู้สึกดีที่ตัวเองมีคุณค่าในการช่วยเหลือชุมชนครับ

ต่อไปการที่ผมได้ Review theme ทำให้ผมเองได้เรียนรู้ว่า code ส่วนอื่นๆเวลาที่จะเขียน control widget ทำไง เขียนติดต่อรับค่าส่วน customize ทำอย่างไร ตรงจุดนี้คุณ ulrich ก็บอกผมตอนผมถามเขาว่าทำไมเราต้องช่วยเหลือชุมชน เขาบอกว่าตัวเขาเองก็เรียนรู้จากจุดนี้เหมือนกันหลังจากช่วยเหลือแล้ว ผมได้เรียนรู้บ้าง tag ที่ผมไม่เคยได้ใช้เลยหรือว่าวิธีการเขียนแบบแปลกๆ

อันถัดมาเป็นเรื่อง Connection คืออันนี้ผมได้เจอคนในกลุ่ม wordpress มีคนจำผมได้หลังจากผมไปเรื่อยๆ คือผมเองก็ไม่ได้ช่วยเหลืออะไรเท่าไร แต่ก็พยายามไปจนวันงานผมก็ได้เจอหลายคนมาทักทาย ซึ่งมันดีมากๆนะถ้าคนอื่นจำเราได้ และเราก็จำคนอื่นได้

จากข้อข้างบนนั้นทำให้เราได้รับรายได้อีกทาง เพราะการที่เราได้รู้จักคนเพิ่มขึ้นเป็นช่องทางเปิดโอกาสมากขึ้น มีคนอยากทำเว็บก็จะนึกถึงเราจำเราได้ คนนี้ที่สอนทำ theme หรือคนนี้ที่จัดงาน wordpress ผมเองก็ยังได้รับโอกาสจากชุมชนเหล่านี้ครับ ข้อดีขนาดนี้คุณจะไม่ลองมาช่วยเหลือกันหน่อยหรอครับ ถ้าคุณสนใจก็ติดตามข่าวสารได้จาก

https://www.facebook.com/groups/wpalliance/

สุดท้ายนี้ของวันแรกสิ่งที่ผมอยากฝากไว้จาก Post ของพี่เม่นซึ่งได้จากคุณชินอิจิอีกทีคือ

คุณเคยได้ยินเรื่อง WordPress Karma ( กฎแห่งกรรมของ wordpress ) มั้ย ?

ใครก็ตามที่ Contribute ให้ wordpress เค้าจะเจริญรุ่งเรือง ก้าวหน้าในอาชีพ


Conference Day

วันนี้เป็นวันเข้าฟังสัมนาโดยกำหนดการจะแบ่งเป็นทั้งหมด 21 session 3 ห้องนั่นคือคุณไม่สามารถฟังทั้งหมดได้แต่ทางทีมงานจะ upload vdo เข้ามาให้ดูทีหลังนะครับโดยในบทความนี้จะเป็นอันที่ผมฟังทั้งหมดนะครับ session แรกตัดไปได้เลยเพราะไปสาย -_-” สิ่งที่ประทับใจสุดๆและชอบมากๆเป็นสิ่งเล็กๆในงานที่พูดได้ว่าทำออกมาดีมากๆคือ สมุดห้อยคอที่บอกรายละเอียดและเป็นป้ายชื่อในตัว

wordcamp sign
สมุดห้อยคออันนี้คือด้านหน้า
wordcamp-book
ข้างหลังกลับด้านเพื่อให้เวลาห้อยคนอื่นจะอ่านได้

ซึ่งข้างในทำออกมาได้ดีมากบอกทุกอย่างเกี่ยวกับรายละเอียดของงานและทุก session ที่จัดในงานครั้งนี้ครับ โดยครั้งนี้ถ้าไปไม่สายไม่ใช่เจ้าของ Blog แน่นอน ( ยังมีหน้ามาภูมิใจ แฮร่ ) ต้องขออภัยด้วยจริงๆพยายามไปแหละไม่ทันขอเริ่มที่อันที่ 2 เลยแล้วกันครับ

What is Transients API? And Why We Need It

อ่านว่า ทราน-ซิ-เอ็นท์ อ่านเร็วๆหน่อยเหมือน ทรานเซียนท์ มันคือ cache ของ database โดยสามารถกำหนดการหมดอายุได้ หรือไม่ให้หมดอายุได้ โดยปกติเราต้องไปเอาข้อมูลจากใน database ใช่ไหมครับ แต่ถ้าเราใช้เจ้า transient มันก็เหมือนจะเก็บข้อมูลไว้ ทำให้ระบบเรียกข้อมูลนั้นออกมาได้ทันทีไม่ต้องไปค้นหาใน database ใหม่โอเคเรามาดูว่า การใช้งานเป็นอย่างไรนะครับ

transient wordcamp
what is transient

การใช้งาน

เอาไปเก็บ header-menu เช่น มีเมนูเยอะหลายชั้น ต้อง query เยอะก็ใช้ transient เก็บข้อมูลพวกนี้ไม่ต้อง query ซ้ำ เก็บข้อมูล home page หากมีการ query เยอะๆ ก็เก็บ transient เพื่อให้มันรวดเร็วขึ้น plugin debug bar ดูว่า query อะไรมาบ้างและใช้เวลาเท่าไรเร็วขึ้นประมาณ 3 เท่ากว่าๆ

transient wordcamp bkk
ก่อนใช้งาน transient

อันนี้เขาเขียน plugin แบบง่ายๆคือเช็คว่ามี transient เก็บข้อมูลไหมถ้ามีก็ดึงเอามาใช้เลยถ้าไม่มีก็ต้องไปค้นหาใน Database เวลาที่ใช้ตอนค้นหาใน Database คือ 8.4 วินาที

transient wordcamp bkk
หลังจากที่ใช้งาน

แต่อย่าลืมว่าเนื่องจากมันเป็น cache เราจึงต้อง hook เมื่อมีการ insert post หรือเมนูใหม่ให้มัน clear cache ออกไปด้วยครับใครอยากศึกษาเพิ่มเติมตามไปศึกษาต่อได้ https://codex.wordpress.org/Transients_API

ข้อควรระวัง

ทั้งเว็บจะใช้ transient ร่วมกัน เพราะฉะนั้นถ้าหากชื่อ key เหมือนกัน ก็จะทำให้ค่าไม่ออกอย่างที่คิดและวิธีแก้ก็คือเอาพวก post id ไปใส่เพื่อให้มันแยก key กัน

Marking Tools for wordpress

wordcamp bkk 2018
wordcamp bkk 2018

หัวข้อนี้เป็นของเจ้าของเว็บไซร์ www.contentshifu.com โดยจะมาแชร์ Plugin ต่างๆที่ทางผู้ก่อตั้งได้ทดลองทั้งเสียเงินหรือฟรี ซึ่งมีการเตือนตลอดว่าของฟรีไม่ใช่ว่ามันจะถูกเพราะตอนใช้ไปมาสักพักก็จะเสียเงินแพงกว่าบางอันเสียอีก โอเคมีอะไรบ้างไปดูกันเลย

Plugin พื้นฐาน

wordcamp bkk 2018

พวกแนวๆเครื่องมือที่จะเชื่อมต่อไปกับพวกช่องทางอื่นๆทั้ง social ต่างๆครับเรามาดูกันว่ามีอะไรบ้าง

jetpack

ครบเครื่องตั้งแต่จัดการความปลอดภัยและดูแลช่องทางอื่นๆ มันมีประโยชน์สำหรับมือใหม่ถ้าหากยังไม่รู้จะลงอะไร ก็ลงตัวนี้ตัวเดียวก็จบเลย แต่ต้องศึกษาไปด้วยนะครับว่าใช้งานอะไรอย่างไร และที่สำคัญคือมันหนักทำให้เว็บโหลดช้าลงนิดหน่อย ก็อย่างที่บอกจะใช้อะไรก็ต้องศึกษาเพิ่มเติมด้วยครับ ก็ติดตั้ง plugin ค้นหาคำว่า jetpack ได้เลยครับหรือจะ download ติดตั้งเองก็ได้

download: https://jetpack.com/

tracking code manager

ปกติเวลาเราทำเว็บไซต์เราก็คงอยากทราบว่า คนที่เข้ามานั้นมาจากช่องทางไหนอย่างไร เช่น เรายิงโฆษณาและเล่น campion ต่างๆนั้น อันได้ผลก็จะเช็คจากพวก code ต่างๆที่เราแนบไปกับ link ครับ หรือสามารถรู้ว่า code ตัวนี้เราจะให้โผล่หน้าไหนอย่างไร  ซึ่งเจ้าตัวนี้ต่อกับ google analytics หรือ facebook pixel มันเจ๋งกว่าตัวอื่นตรงที่สามารถต่อกับพวก e-commerce

ถ้าเข้าไปดู link แล้วลองดูที่ vdo แนะนำการใช้งานจะเข้าใจมากขึ้นครับ

download: https://wordpress.org/plugins/tracking-code-manager/

pretty link

ย่อ link ให้สั้น จัดการพวก dofollow , nofollow จัดการเกี่ยวกับ Affiliate link ซึ่งคุณสามารถ group การย่อได้อีกด้วย

download: https://prettylinks.com/about/

wp smush

เป็น Plugin ย่อรูปให้ ทำ auto resizing ซึ่งอันนี้ผมว่าดีตรงคนส่วนใหญ่เวลา upload ภาพไม่ทันได้ย่อรูปก่อนหรือไม่ได้เอาไฟล์ไปบีบอัดก่อนจะมาทำการ upload ซึ่งรายละเอียดภาพบางครั้งเราไม่ได้ต้องการภาพคมแต่แค่อยากได้ภาพประกอบ ซึ่งเจ้าตัวนี้จะมาช่วยทั้งบีบอัดลดขนาดภาพโดยตัวภาพไม่เสียเนื้อหาครับ

download: https://premium.wpmudev.org/project/wp-smush-pro/

Plugin เกี่ยวกับเรื่องเนื้อหาในบทความ

wordcamp bkk 2018
wordcamp bkk 2018

ต่อไปเป็น Plugin จำพวก ช่วยเหลือในการทำให้บทความในเว็บของเราน่าสนใจมากขึ้นครับ

table of content plus

ทำสารบัญในเนื้อหาของหน้า บางครั้งคุณเข้าไปอ่านเนื้อหาแล้วเห็นสารบัญก็ไม่ต้องแปลกใจอันนี้เอาจริงๆไม่ต้องทำ plugin ก็ทำได้เองนะครับแต่มันก็ยุ่งหน่อยๆ ก็ลองเอาตัวนี้ไปใช้ดูครับ อยากเห็นตัวอย่างก็ link นี้เลย

https://www.contentshifu.com/wordpress/wordcamp-bangkok-review/

เมื่อเปิดเข้าไปจะเห็นตรงจุดให้คลิก “ยาวไปอยากเลือกอ่าน ?” ลองกดดูครับ plugin จะทำประมาณนั้นครับ

download: https://wordpress.org/plugins/table-of-contents-plus/#description

H5P Content

เป็น plugin สำหรับทำให้บทความมีลูกเล่นมากขึ้น เช่น คุณอาจจะอยากให้มี quiz เล็กๆในบทความทำนองนี้ครับ หรืออยากให้มี tab ให้กดซ่อนหรือแสดงเป็นบางจุดก็ทำได้เช่นกันมีให้เลือกหลากหลายเลย

download: https://wordpress.org/plugins/h5p/#description

SEO ( Search Engine Optimize )

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

Yoast SEO

ตัวนี้ดีผมใช้อยู่เหมือนกันช่วยเหลือเกี่ยวกับการเขียนบทความว่าเราขาดอะไร ขาดรูปหรือ link ไหม keyword ของบทความเยอะหรือน้อยอย่างไร โดยใช้สัญลักษณ์เป็นสีของไฟจราจร ถ้าดีสุดก็เขียวถ้าลดมาหน่อยก็เหลือง/ส้ม โดยไม่จำเป็นต้องทำให้เขียวสุดก็ได้เพราะตัว plugin มันทำมาเพื่อภาษาอังกฤษครับ บางทีภาษาไทยมันก็ไม่ฉลาดเท่าไร แต่ก็อยากให้พยายามทำให้สีมันเขียวที่สุดแล้วกันครับ

download: https://wordpress.org/plugins/wordpress-seo/

Broken link checker

ตัวนี้สำหรับเช็คว่ามี Link ในเว็บเราเสียหายบ้าง

download: https://wordpress.org/plugins/broken-link-checker/

All in one schema.org Rich snippet

ทำให้แสดงผลใน google search แบบมีดาว มี Event ต่างๆ คุณลองค้นหาพวกร้านอาหารก็ได้จะมีพวกดาวหรือบางอันมีหน้ารองๆในนั้นก็แสดงผลมาด้วยอันนี้แหละครับตัวช่วยเหลือเรา

download: https://wordpress.org/plugins/all-in-one-schemaorg-rich-snippets/

Social Media Marketing

ตรงนี้จะรวมเกี่ยวกับพวกช่วยเหลือเราด้าน marketing online นั่นเอง

Seed Social

แชร์ทุกช่องทางที่คนไทยใช้ Facebook, Twitter, G+, Line น้ำหนักเบา

download: https://wordpress.org/plugins/seed-social/

Revive Old Posts

แชร์ไปพวก post เก่าๆไปยัง social media ต่างๆ โดยเว็บเราอาจจะมีบทความดีๆที่มันประยุกต์ใช้ได้ไม่ว่าเวลาจะผ่านไปนานเท่าไร ตัวนี้จะช่วยเหลือเราครับ

download: https://wordpress.org/plugins/tweet-old-post/

Lead Generation

ส่วนนี้จะรวมเกี่ยวกับการเก็บข้อมูลลูกค้า

Thrive Leads

จัดการพวกเก็บข้อมูลลูกค้า

download: https://thrivethemes.com/leads/

OptinMonster

อันนี้จะเป็นพวก popup ต่างๆ เวลาคุณเข้าเว็บแล้วมีหน้าต่างเด้งมาบอกโปรโมชั่น ให้คุณสมัคร email รับข่าวสารหรือพวกในบทความ

download: https://wordpress.org/plugins/optinmonster/

Convertful

เป็นการเก็บข้อมูลผู้ชมเหมือนกันแต่ว่าถ้าหากใครกรอก form แล้วไม่ผ่านหรือ email ไม่ส่งมันก็จะพยายามส่งไปหาครับ

donwload: https://wordpress.org/plugins/convertful/

Form

เกี่ยวกับพวกการติดต่อ

Contact form 7

Plugin เกี่ยวกับ form ตลอดกาลข้อดีฟรี

download: https://wordpress.org/plugins/contact-form-7/

Gravity Forms

ทำได้หลายเชื่อมต่อกับ api หรือ plugin อื่นๆได้อีก

download: https://www.gravityforms.com/

Ninja Forms

ฟรี สวย แต่ข้อเสียคือแพง อ้าวงงดิ ฟรีแล้วทำไมแพง คือถ้าเราใช้ฟรีมันก็ระดับหนึ่งแต่ถ้าหากต้องการใช้แบบ pro ก็อาจจะแพงโดยจะมี feature ต่างๆให้เราใช้

download: https://wordpress.org/plugins/ninja-forms/

Landing Page

พวกทำหน้า หน้าเดียวเช่นเราอยากได้หน้ากิจกรรมที่มัน layout ไม่เหมือนกับหน้าปกติหรือมีหน้าขายของอะไรพวกนี้อ่ะครับ

Thrive Architect

feature เยอะทำหน้าต่างๆได้ง่ายสามารถแก้ไขแบบ real time หรือมีอะไรอีกมากมายลองไปอ่านศึกษาเพิ่มเติมดูครับ

download: https://thrivethemes.com/architect/

Instapage

feature เยอะ เจาะจงในการสร้าง Landing page ราคาแพง

download: https://wordpress.org/plugins/instapage/

Email Marketing

รวมเกี่ยวกับพวก email marketing

MailChimp

integration ได้เยอะมากๆ ต่อได้หลายตัว ข้อเสีย คือข้อกำจัดเยอะ

download: https://wordpress.org/plugins/mailchimp-for-wp/

Mailerlite

Good ux , free เทียบกับตัวอื่นถูกกว่า ข้อเสีย feature น้อย

download: https://wordpress.org/plugins/official-mailerlite-sign-up-forms/

Where to find get tools ?

จากเครื่องมือทั้งหมดตรงนี้จะเป็นบอกแหล่งในการค้นหาพวก plugin พวกนี้ครับ

wordcamp bkk 2018
ทิ้งท้ายกับ Quote ดีๆ

==== พักเที่ยงจ้า ====

ข้าวเที่ยงที่นี่ดีมากอร่อยจริงๆ ต้องชม 

==== เริ่ม session บ่าย ====

Modify My Woocommerce

modify my woocommerce

หัวข้อนี้เขาจะมาเล่าเกี่ยวกับการ modify woo-commerce ว่าเขาจะรับมือกับลูกค้าคนไทยได้อย่างไร ต้องปรับเปลี่ยนอะไรให้พร้อมบ้างทั้งลูกค้าที่มาซื้อของในเว็บและลูกค้าที่มาจ้างทำเว็บครับ

ทำไมเราถึงเลือกใช้ woo และวิธีการเชิญชวนลูกค้ามาใช้กับเรา

  • ฟรี แต่ไม่ได้รวมค่า MA
  • 40% ของเว็บขายของทั่วโลกใช้ woo อยู่
  • เร็วและตอนนี้ มี plugin สำหรับจัดการช่วยเหลือ
  • การซื้อครั้งเดียวจบ ซึ่งทาง woo มาการเปลี่ยน patch auto ( ขายพ่วง MA ) ด้วยเพราะการ update ก็คือเกิด error
  • ความเสี่ยงเป็น 0 ซึ่งเราจะดูแลดี

อะไรที่ woo ขาดหายสำหรับลูกค้าคนไทย

modify my woocommerce

Payment พวกไม่ใช้บัตร credit จะใช้โอนเงิน ในอนาคตอันใกล้อาจจะจ่ายแบบ QR promtpay ระบบ chat เพื่อให้คนไทยเวลาซื้อก่อนจะจ่ายเขาจะถำถามเพื่อความมั่นใจซึ่งตรงจุดนี้ฝรั่งเขาซื้อของเขาจะไม่ถามอะไรพวกนี้เราอาจจะต้องมีระบบบอก

Promotion ตอนนี้ของ woo มีแค่คูปอง แต่มี plugin ที่ช่วยเหลือคือ WooCommerce Dynamic Pricing & Discounts ตัวนี้ตัวเดียวราคา 49$ ขายใน CodeConyon สามารถทำ buy x get x หรือ cross ได้ว่าเช่น buy A free B

Chat plugin ที่แนะนำคือ zopim มันสามารถ popup เวลาลูกค้าอยู่ในหน้านั้น 2 นาที ( เวลาปรับเปลี่ยนได้ ) สามารถถามได้ว่าต้องการอะไรยังไง แอดมินสามารถใส่ของในตะกร้าลูกค้าเพิ่มเติมได้

Modify Woo Theme with ( very  little ) knowledge

modify my woocommerce

ต้องเข้าใจ Hook อธิบายง่ายๆคือ สมมติถ้า code มันลำดับการทำงาน 5 ขั้นตอนเช่น

code 1 ทำงานเสร็จ -> ทำงาน code 2 -> …. -> ทำงาน code 5

เราสามารถเขียนโค้ดให้ทำงานอย่างอื่น ระหว่างก่อนการทำงานของ code ที่ 1 หรือหลังการทำงานของ code ที่ 1 ทำนองนี้

ถ้าในสถานการณ์จริงเช่นเมื่อลูกค้าซื้อของเราสามารถ popup บอกว่าให้โปรโมชั่นพิเศษสำหรับคุณครับ

Virtual guide hook อันนี้คือ keyword ของ hook ใน woo

FAQ

Q: เมื่อ update theme ของ hook ใน function.php จะหายไหม ?

A: หายครับ วิธีแก้ไขคือทำ child theme

Q: woo ดีกว่าพวก open cart หรือ magento ยังไง ?

A: ต้องดูลูกค้าก่อน บางคนก็ชอบแบบทำใหม่หมด บางคนชอบ new tech เสร็จถ้าเปรียบเทียบว่าลูกค้าที่ต้องการเร็วและยากเวลาจะบีบเขาเอง ถ้าคนสร้างเองดีไหม ดีแต่ custom ช้ากว่าการที่เราซื้อ Plugin อยู่ดี

Q: รองรับสินค้าได้เยอะแค่ไหน ?

A: สามารถเก็บได้เยอะ 1000 ชิ้นถ้า 10,000 ชิ้นคนซื้อเยอะ แล้วสามารถไปใช้ hyper db เข้าช่วยเหลือ เช่นการเรียก report ก็อาจจะช้า

Q: Stock Management มี plugin แนะนำไหม ?

A: จาก case ที่คุณกอล์ฟเจออยากได้แบบ real time stock ต้องเขียนเอง

Q: อยากได้ตัว plugin sync กับพวก market place เช่น เรามีขายของที่เว็บเองและมีเปิดร้านขายที่ lazada ด้วยอยากให้มันตัด stock สองที่พร้อมกัน

A: อันนี้ต้องไปลองเองยังไม่มีดีสุด

ออกแบบเทพแต่โค้ดไม่เป็น ทำไงดี ?

ออกแบบเทพแต่โค้ดไม่เป็น ทำไงดี?
ออกแบบเทพแต่โค้ดไม่เป็น ทำไงดี?
wordcamp bkk 2018

ปัญหาโลกแตกของ Web Designer คือ code ไม่เป็นแต่มันหมดไปเมื่อเจอ wordpress การติดตั้งง่าย ฟรี  หน้าตา ( theme ) มีให้เลือกเยอะและมีภาษาไทย

เมื่อศึกษาได้สักระยะจึงเริ่มนำมาใช้จริง ประเมิน Project ก่อนทำ step มี

รับบรีฟ -> ประเมินงาน -> ออกแบบ -> นำเสนอ -> นำลง wordpress

เค้น บรีฟ ให้ได้มากที่สุด

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

ประเมินงาน

รับบรีฟเรียบร้อยขั้นตอนต่อไป ประเมินงานว่า จะทำเองทั้งหมดหรือว่าจะหา Dev ช่วย เลือก theme ให้เหมาะกับงาน โดยหลักๆเลือกแบบพวก theme ที่สามารถประกอบด้วยการใช้ theme

แบบอเนกประสงค์คุณเบ้นเรียกว่า theme lego หมายถึงปรับเปลี่ยนการจัดวางได้หลากหลาย ให้ลองเล่น Demo ของ theme ที่มีหน้าตาใกล้เคียงกับบรีฟของเรา ถ้าส่ิงที่ demo ทำได้แปลว่า

เราก็ออกแบบตามได้เลยตัวอย่างเช่น

Avada

สามารถดูได้ที่หัวข้อ element ว่าเราสามารถจัดวางแต่ละอันได้อย่างไรบ้าง ดูสองอย่างไปพร้อมๆกัน Demo , Element

เวลามองให้ดูเหมือนแยกส่วนประกอบ

เช่นส่วนบน ตรงเมนูกับ slide ทำแบบไหนได้บ้าง การวาง font ทำแบบไหนได้บ้าง จัดวางได้แบบไหนบ้าง อย่าลืมดูตอนเป็น mobile ด้วยไม่ใช่ดูแต่ desktop สวยแต่ mobile เฉยๆ

พยายามออกแบบตาม element ที่มีเท่านั้น และใช้ 960gs ในการออกแบบ 12, 16 columns

wordcamp bkk 2018
เริ่มออกแบบ

ออกแบบหน้าแรก Desktop และ Responsive ไปเสนอลูกค้า แบบ mockup เรียบร้อย โดยตัว prototype ใช้ invision ในการทำ prototype ซึ่งสามารถ comment ได้เลยว่าจุดไหนชอบไม่ชอบ เมื่อลูกค้า Approve แบบค่อยเริ่มหน้าต่อไปโดยเราสามารถเก็บเงินได้แหละในเฟสแรก

เมื่อออกแบบเสร็จจะเอาไปประกอบใน wordpress ซึ่งตอนนี้จะง่ายเพราะว่ามีการ ออกแบบที่อ้างอิงจาก element ไว้แล้ว เมื่อ Feature ใน theme ไม่ตอบโจทย์ได้ก็หา plugin ช่วยเหลือ เช่น

  • Font ของ theme บางอันมันไม่สวยสำหรับภาษาไทย ก็ใช้ Seed font แต่บางอันก็สามารถจัดการ Font ให้อยู่
  • Contact form plugin Ninja
  • Yoast seo
  • WPML สำหรับหลายภาษา

ตั้งแต่ต้นจนจบไม่ต้องเขียน code เลยหากเรารู้จักการใช้ theme และ plugin ที่ช่วยเหลือ

แนวทางการพัฒนาและอัพขึ้น WordPress.org ใน 3 วัน

wordcamp bkk 2018
wordcamp bkk 2018

session นี้ผมอาจจะไม่พูดอะไรมากนะครับแนะนำอ่านที่เจ้าตัวได้เลย จะเล่าคราวๆนี้ปกติเวลาเราทำพวก theme หรือ plugin นั้นมันต้องมีกระบวนการในการเอาขึ้น wordpress.org ต้องมีคนมาตรวจทำไม่ผ่านก็ต้องแก้ไขและรอคนมาตรวจใหม่อีกทำนองนี้ครับ ซึ่งปกติมันจะใช้เวลานานมากๆ ไปดูในหัวข้อ theme วัน contribute day ข้างบนได้เลยว่า แต่หัวข้อนี้เขาจะมาบอกว่าวิธีที่ทำให้ผ่านการตรวจสอบเร็วๆมีอะไรบ้าง วิธีการเขียนบอกคนมาตรวจให้เขาทำงานเร็วขึ้นเพื่อให้ Theme/Plugin ของเราได้ผ่านการตรวจเร็วๆทำอย่างครับ ตามอ่านต่อได้ที่ Link ด้านล่างเลย

github.com/jojoee/3days

Cache ยังไงให้เร็วประดุจฟ้าแลบ

หัวข้อนี้ผมเข้าไปทีหลังเพราะว่าไปเข้าห้อง networking อยู่แต่เข้าไปคุณโดมเขาก็เล่าคร่าวๆว่า ไปเจอปัญหาตอนทำ server ของทีวีพูลเอาง่ายๆคือทำ cache โดยใช้ Nginx ( โปรแกรมที่ทำตัวเป็น server ) กับภาษา Lua โดยปกติ wordpress มันจะใช้ PHP ในการประมวลแต่อันนี้เวลามัน cahce มันจะไม่แตะ PHP เลยคือสร้างเป็นไฟล์ใน nginx แล้วส่งให้ user ทันทีซึ่งมันจะเร็วมากๆ แต่ก็ต้องใช้ประสบการณ์และมี Plugin ที่เกี่ยวกับสองตัวคือ

สุดท้าย

wordcamp bkk 2018
wordcamp bkk 2018

ต้องขอขอบคุณทุกคนที่มาร่วมงาน stuff ทุกคนและทีมหัวหอกที่จัดงานนี้ทุกคน ไม่ว่าจะเป็น น้องอั้ม น้องยูกิ พี่หนุ่ม พี่นก ลีน่าและแฮม น้องบิ๊ก ชินอิจิ พี่เม่น และเพิร์ดขาดใครไปแจ้งนะครับจะเพิ่มชื่อให้ งานดีๆอย่างนี้จะจัดขึ้นทุกปีและแต่ละเดือนเราก็มีงาน meeting wordpress ทุกครั้ง ก็หวังว่าคุณผู้อ่านทุกคนจะได้รับความรู้และ plugin ดีๆที่ผมนำมาให้แก่ทุกท่านครับ

wordcamp bkk 2018
wordcamp bkk 2018

สิ่งสุดท้ายจริงๆคือ ถ้าเห็นว่าบทความนี้ดีและควรบอกต่อก็ฝากแชร์ด้วยนะครับก็ถือว่าทำให้ผมมีกำลังใจหาบทความดีๆ มาส่งมอบให้คุณผู้อ่านอีกสำหรับบทความนี้ก็ขอลาไปก่อนนะครับ บายบ๊าย :)

Loading

เป็นโปรแกรมเมอร์ที่ตามหาคุณค่าของชีวิตและความฝันในวัยเด็ก ชอบเล่นเกม เรียนรู้ทุกอย่าง ชอบเจอคนใหม่ๆ งานสังคมทุกชนิด ออกกำลังกายในวันว่าง อ่านหนังสือ มีเว็บรีวิวหนังสือด้วย www.readraide.in.th