Monthly Archive February 2, 2018

วิธีทำให้เวิร์ดเพรสโดนแฮค

เรามาดูวิธีทำให้เวิร์ดเพรสโดนแฮคกันครับ ผมรับรองได้เลยว่าทำตามนี้แล้วโดน Hack แน่นอน

วิธีทำให้เวิร์ดเพรสโดนแฮค

1.โหลดธีมหรือปลั๊กอินเถื่อนหรือโหลดจากแหล่งที่ไม่น่าเชื่อถือ

โหลดปลั๊กอินเถื่อนเพราะฟรี ที่ไหนแจกของฟรีเราโหลดหมด เราเป็นคนประหยัด (งก)

2.ตั้งค่า Permission Folder & File เป็น 777

Permission 777 คือสิทธ์ิในการยินยอมให้ใครก็ได้สามารถสร้างหรือแก้ไขไม่ว่าจะเป็น File หรือ Folder สามารถทำได้หมด เราเป็นคนใจกว้าง ใจดี ใครอยาก สร้างหรือแก้ไขไฟล์อะไรบนเว็บเรา เรายินดี มาจัดการได้เลย

3.อย่าอัพเดทเวอร์ชั่น WordPress ,Themes, Plugin

ทุกครั้งที่มีเวอร์ชั่นใหม่ออกมา อย่าอัพเดทครับ ปล่อยไว้อย่างนั้น เพราะทุก ๆ อัพเดททางผู้พัฒนาเค้าก็จะปรับปรุงโค๊ด เพิ่มประสิทธิภาพให้มันเสถียรขึ้น อุดช่องโหว่ต่าง ๆ ที่มีในเวอร์ชั่นเก่า เราไม่ชอบของใหม่ เราจะใช้ของเก่า เราเป็นนักอนุรักษ์ของเก่า เพราะฉะนั้นเราจะไม่อัพเดทอะไรทั้งสิ้น

4.ตั้ง Username ให้ง่าย ๆ

ผมแนะนำให้ตั้ง Username เป็นชื่อพวกนี้

  • admin
  • ชื่อเว็บคุณเอง
  • admin1234

5.ตั้ง Password ให้จำได้ง่าย ๆ

ตั้งให้จำง่าย เข้าไว้อะไรจำยาก ๆ อย่าไปตั้งเช่น

  • admin1234
  • password
  • password1234
  • 1234

6.อย่า Backup

เปลืองพื้นที่เว็บครับอย่าไปทำเลย Backup อะไรเนี่ย ทำไปก็ไม่ได้ใช้ เสียเวลา

7.อย่าติดตั้ง Plugin Security

อย่าลง Plugin พวกนี้เพราะถ้าเราลงจะทำให้ Hack ได้ยากขึ้นเว็บจะมีระดับความปลอดภัยที่ดีขึ้น แต่บทความนี้เราอยากให้ Hack ได้ง่าย ๆ เลยไม่ลง

จบแล้ว

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


ขอบคุณข้อมูลดี ๆ จาก https://codingdee.com/how-to-make-wordpress-hacked/

วิธีป้องกัน การโดน Copy บทความด้วย JavaScript

วิธีป้องกัน การโดน Copy บทความด้วย   JavaScript

เพิ่มโค๊ดชุดนี้เข้าที่  footer.php

<script type="text/javascript">
document.addEventListener('copy', function(e){
	e.clipboardData.setData('text/plain', 'Original Content By standhost.com\r\n');
	e.preventDefault();
});
</script>

การทำงานของโค๊ดชุดนี้คือ

  • ตรวจสอบว่าเมื่อมีการกด Copy ไม่ว่าจะเป็น คลิกขวาแล้วกด Copy
  • หรือกด Control + C
  • โค๊ดจะทำการแทนที่ข้อความที่ Copy มาด้วย ข้อความที่เรากำหนดไว้
  • ตัวอย่างข้อความที่ผมกำหนดไว้คือ Original Content By Standhost.com ใครจะเปลี่ยนก็เปลี่ยนตรงนี้นะครับเป็นข้อความที่เราต้องการตามใจชอบเลย

สิ่งที่ควรทำ ก่อนจะโดน Copy บทความหรือโดนแล้วก็ทำได้ครับ คนที่มา Copy เราเค้าจะได้ทำได้ลำบาก

  1. ใส่ความเป็นตัวตนหรือเอกลักษณ์ของเราลงไปเช่น แทนสรรพนามที่เรียกตัวเราเองเป็นชื่อ เว็บเราหรือเป็นชื่อเราไปเลยแบบนี้คนที่ Copy ไปก็ต้องลำบากขึ้นอีกหน่อยต้องมาไล่เปลี่ยนตรงนี้
  2. วิธีจากคุณ Woravut Ikssn Srianant แนะนำว่า “เวลาเขียนเรื่องใหม่ๆ จะพยายามใส่ลิ้งในเนื้อหาให้วิ่งไปหาหน้าหลักหรือหน้าเดียวกันนี้ของเว็บเรา แล้วส่ง url เข้าไปในเครื่องมือเว็บมาสเตอร์ของ search engine ต่างๆ เวลาโดนก็อบถ้ามันไม่ได้แก้ไขเนื้อหาเรา ก็เท่ากับมันช่วยโปรโมทเว็บเราให้แบบฟรีๆ”
  3. เปิด Hot link Protection ใน CloudFlare เพื่อป้องกันโดนสูบ bandwidth
  4. ถ้าอยากใช้ Plugin ก็ลองตัวนี้ครับ WP Content Copy Protection & No Right Click

จบแล้ว

ขอขอบคุณข้อมูลดี ๆ จาก https://codingdee.com/copy-me-if-you-can/

5 เหตุผลว่าทำไมถึงต้องใช้ Ninja Forms แทน Contact Form 7

 Ninja Forms ปลั๊กอินสร้างแบบฟอร์มที่โคตรเทพ ใช้งานง่าย ฟังก์ชั่นครบครัน ลงตัวนี้ตัวเดียวลืม CF7 ไปได้เลย

Ninja Forms

ถ้าพูดถึงปลั๊กอินสำหรับใช้สร้างแบบฟอร์ม หลายคนคงจะนึกถึง  Contact Form 7 (CF7) ใช่ไหมครับ ไม่แปลกเพราะก่อนหน้านี้ผมเองก็ใช้ CF7 มาตลอดแต่ CF7 มันไม่มีฟีเจอร์ที่เก็บข้อมูลลงดาต้าเบส ถ้าอยากให้มันเก็บข้อมูลลงดาต้าเบสได้เราต้องลงปลั๊กอิน  Contact Form Submissions  หรือ  Contact Form 7 Database Addon – CFDB7  เพิ่ม ผมก็ลองค้น Google หาปลั๊กอินดูจนมาเจอปลั๊กอินนี้ พอลองใช้ดูแล้วก็ติดใจมาก ใช้ง่ายกว่า CF7 มากและเก็บข้อมูลลงดาต้าเบสได้ด้วย มาดูกันครับว่าทำไมผมถึงเปลี่ยนจากจาก CF7 มาใช้ปลั๊กอินนี้แทน

1.รองรับ Google reCaptcha

ปลั๊กอินสามารถใส่ Google reCaptcha ได้ด้วยเพื่อป้องกัน Spam (ข้อนี้ CF7 เองก็มีเหมือนกัน)

2.รองรับภาษาไทย

ตัวปลั๊กอินรองรับภาษาไทยอยู่แล้วแทบไม่ต้องแปลเลย ประหยัดเวลาไปได้เยอะ

3.Drag & Drop

หน้าตาการใช้งานเรียบง่ายมาก การสร้างฟอร์มทำได้สะดวก เราสามารถลากฟิลด์มาวางได้เลย มีฟิลด์ให้เลือกเพียบ วันที่, อีเมล, ที่อยู่ รหัสไปรษณีย์ และที่ผมชอบอีกอย่างคือ ฟิลด์ Text Area เราสามารถตั้งให้ใช้งาน Rich Text Editor ได้ด้วย

4.เลือกได้ว่าจะให้เก็บข้อมูลลงดาต้าเบสหรือไม่

อีกจุดเด่นของปลั๊กอินนี้คือเราสามารถเลือกได้ว่าจะเก็บข้อมูลที่ลูกค้าส่งมาเก็บลงดาต้าเบสหรือไม่ โดยค่าเริ่มต้นที่ปลั๊กอินให้มาจะเก็บลงดาต้าเบสอัตโนมัติ แถมยัง export ออกมาเป็นไฟล์ excel ได้ด้วยนะ

5.Import และ Export ฟอร์มที่เราสร้างไปใช้กับเว็บอื่นได้

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

ข้อเสีย

อ่านข้อดีมาเยอะแล้วมาดูข้อเสียกันบ้าง เรียกได้ว่ามีอยู่ข้อเดียวเลย ข้อเสียนั่นก็คือ ไม่สามารถแนบไฟล์ได้ (สำหรับเวอร์ชั่นฟรี) ถ้าอยากให้แนบไฟล์ได้ก็ต้องซื้อ extension เสริม  File Uploads

ดาวน์โหลดปลั๊กอินได้ที่นี่

คลิก


ขอบคุณบทความดี ๆ จาก

https://codingdee.com/five-reasons-to-use-ninja-forms/

7 ปลั๊กอินสามัญประจำเวิร์ดเพรส

สำหรับบทความนี้ผมก็ได้รวบรวมรายชื่อปลั๊กอินยอดนิยมที่ผมลงทุกครั้งที่ทำเว็บมาให้ดูกันครับ เชื่อว่าหลาย ๆ คนคงมีรายชื่อปลั๊กอินที่ชอบเหมือนผม มาดูกันว่ามีปลั๊กอินอะไรบ้าง 

7 ปลั๊กอินสามัญประจำเวิร์ดเพรส

1.iThemes Security

สำหรับปลั๊กอินนี้ บอกได้คำเดียวว่า ต้องลง ไม่ลงไม่ได้เป็นปลั๊กอินที่ช่วยเสริมความปลอดภัยให้กับเว็บเรา ป้องกันและอุดช่องโหว่ต่าง ๆ ที่เสี่ยงต่อการโดนแฮคหรือโดนมัลแวร์

สาเหตุที่ผมแนะนำตัวนี้เพราะ เบา ไม่กินทรัพยากรเว็บมาก ใช้เวลาเรียนรู้น้อย

ไปอ่านเพิ่มเติมได้ที่นี่ เสริมเกราะให้เวิร์ดเพรสด้วย iThemes Security ตอนที่ 1

โหลดที่นี่

2.Yoast SEO

ปลั๊กอินนี้คงไม่มีใครไม่รู้จัก เป็นปลั๊กอินที่ช่วยเช็คคะแนนการ Set Onpage ว่าตรงตามมาตรฐานการทำ Seo อยู่ในระดับใดโดยสังเกตได้จาก สีที่เป็นตัวบ่งบอกสถานะว่าหน้านี้เรา Set onpage ได้ดีระดับไหน

  • สีเขียวคือ ดี – ดีมาก
  • สีส้มคือ พอใช้
  • สีแดงคือ แย่

นอกจากนี้ยังช่วยในเรื่องของการ Set รูปภาพ Set รายละเอียดเมื่อเรานำบทความนั้นไปแชร์ตาม Social ต่าง ๆ เช่น Facebook, Twitter เป็นต้น โหลดที่นี่

3.W3 Total Cache

ปลั๊กอินช่วยแคชเว็บนั่นเอง ทำให้เว็บทำงานได้เร็วขึ้น ช่วยลดการทำงานของ server ลง เว็บใครช้าลงตัวนี้เลยครับเร็วขึ้นแน่นอน ส่วนใครที่ใช้ CloudFlare อยู่แล้วก็สามารถ Integrate เข้ากับปลั๊กอินนี้ได้เหมือนกัน Clear Cache CloudFlare ด้วย W3 Total Cache ไปโหลดกันเลย คลิก

4.Imagify

ปลั๊กอินนี้จะช่วยลดขนาดของรูปภาพที่เราใช้ในเว็บให้มีขนาดเล็กลง พอขนาดเล็กลงก็ส่งผลให้โหลดได้เร็วขึ้น โดยตัวปลั๊กอินจะมีระดับการบีบอัดอยู่ 3 ระดับ

  1. NORMAL ลดขนาดลงนิดหน่อย ไม่สูญเสียความละเอียดของภาพ
  2. AGGRESSIVE ลดขนาดลงปานกลาง สูญเสียความละเอียดของภาพบ้างเล็กน้อย
  3. ULTRA ลดขนาดลงแบบเยอะมาก สูญเสียความละเอียดของภาพเยอะ

สาเหตุที่ผมแนะนำตัวนี้เพราะว่า ปลั๊กอินนี้ให้ใช้ฟรีโดยมี เครดิต ให้เราเดือนละ 100 เครดิต สามารถบีบอัดรูปได้ทั้ง 3 ระดับใช้งานง่ายมีหน้าให้เปรียบเทียบรูปภาพ ก่อน – หลัง บีบอัด แนะนำว่าใช้คู่กับ W3 Total Cache จะยิ่งคอมโบโหดมาก โหลด

อ่านรีวิว Imagify เต็ม ๆ ได้ที่นี่ เว็บเร็วขึ้นด้วย Imagify สุดยอดปลั๊กอินลดขนาดรูป

5.Google XML Sitemaps

ปลั๊กอินนี้จะช่วยสร้างไฟล์ sitemap.xml ไว้สำหรับให้ Search engines เข้ามาเก็บข้อมูลและนำไป index ต่อไป ตัวปลั๊กอินใช้งานง่ายไม่ต้องตั้งค่าอะไรลงเสร็จใช้ได้เลย ผมเคยสงสัยอยู่เหมือนกันว่าในเมื่อ Yoast SEO ก็มีฟังก์ชั่นสำหรับสร้าง Sitemap ได้ทำไมไม่ใช้ตัวนั้น ผมค้นไปเจอบทความอยู่บทความหนึ่งที่เปรียบเทียบกันระหว่าง Yoast กับ Google XML ว่าอันไหนดีกว่ากันได้ผลว่า Google XML ชนะผมก็เลยแนะนำให้ใช้ตัวนี้ครับ โหลด

6.Facebook Comments Plugin

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

7.Seed Social

ขาดปลั๊กอินตัวนี้ไปไม่ได้ด้วยประการทั้งปวง เพราะเหมาะกับคนไทยเรามากมี Social แชร์หลัก ๆ ที่นิยมอยู่ครบทั้ง

  • Facebook
  • Google Plus
  • Twitter
  • Line

ผมให้คำนิยามปลั๊กอินนี้สั้น ๆ คือ เบา ดี มีไลน์ รออะไร โหลดเลย

ขอบคุณข้อมูลดี ๆ จาก

https://codingdee.com/important-plugin-for-wp/

 

รวม WordPress Plugins น่าสนใจ แยกตามหมวดหมู่

WordPress Plugins น่าสนใจ แยกตามหมวดหมู่

 

ปลั๊กอินพื้นฐานควรติดตั้ง

ชื่อตัวเสริม คุณสมบัติตัวเสริม
Jetpack by WordPress คุณสมบัติหลากหลาย โดยเฉพาะเรื่องป้องกันความปลอดภัย
All in One SEO จัดการ SEO
WP Super Cache เก็บ Cache เพื่อเพิ่มความเร็วในการเข้าเว็บไซต์
Wordfence Security แสกนเว็บไซต์ป้องกันความปลอดภัย ปล.หนักไม่เหมาะกับติดตั้งตลอดเวลา

ปลั๊กอินสำหรับร้านค้า & ธุรกิจ

ชื่อตัวเสริม คุณสมบัติตัวเสริม
Woocommerce ตั้งร้านค้าออนไลน์ (ฟรี)
Easy digital download ตั้งร้านค้าออนไลน์เน้นเป็นพวกสื่อดิจิตอล (ฟรี) Extension เสริม (ไม่ฟรี)
Sensei ขายคอร์สสอนออนไลน์ (ไม่ฟรี)
easyReservations ระบบจองห้องพัก
Pinpoint Booking System ระบบจองห้องพัก +WooCommerce
Easy Property Listings ธุรกิจอสังหาริมทรัพย์
Car Rental System ระบบจัดการการเช่ารถ (ไม่ฟรี)
WP Car Manager ระบบขายรถ
Booking Ultra Pro Appointments ระบบจองนัดหมายแบบเป็นเวลา
Restaurant Reservations ระบบจองสำหรับร้านอาหาร
Table Rate Shipping for WooCommerce ตัวเสริมจัดการเรื่องระบบขนส่งสำหรับ Woocommerce (ไม่ฟรี)

ปลั๊กอินจัดการเนื้อหาเว็บไซต์

ชื่อตัวเสริม คุณสมบัติตัวเสริม
Page Builder by SiteOrigin ช่วยจัดความสวยงามของเนื้อหาของเว็บไซต์ (ฟรี)
Elementor Page Builder ช่วยจัดความสวยงามของเนื้อหาของเว็บไซต์ (ฟรี)
Visual Composer ช่วยจัดความสวยงามของเนื้อหาของเว็บไซต์ (ไม่ฟรี)
Divi Builder ช่วยจัดความสวยงามของเนื้อหาของเว็บไซต์ (ไม่ฟรี)
SiteOrigin Widgets Bundle ตัวเสริมของ Page Builder by SiteOrigin

ปลั๊กอินจัดการ SEO & ค่าสถิติ

ชื่อตัวเสริม คุณสมบัติตัวเสริม
All in One SEO จัดการ SEO
Yoast SEO จัดการ SEO
Google Analytics Dashboard ดูค่าสถิติ
WP Statistics ดูค่าสถิติ
Google XML Sitemaps สร้าง xml ช่วยเรื่องติดอันดับ google
Broken Link Checker จัดการลิงก์ที่เสียหายเพื่อเพิ่มความน่าเชื่อถือด้าน SEO

ปลั๊กอินเพิ่มความเร็วในการเข้าเว็บไซต์

ชื่อตัวเสริม คุณสมบัติตัวเสริม
WP Fastest Cache เก็บ Cache เพื่อเพิ่มความเร็วในการเข้าเว็บไซต์
WP Super Cache เก็บ Cache เพื่อเพิ่มความเร็วในการเข้าเว็บไซต์
W3 Total Cache เก็บ Cache เพื่อเพิ่มความเร็วในการเข้าเว็บไซต์
EWWW Image Optimizer ลดขนาดรูป เพื่อเพิ่มความเร็วในการเข้าเว็บไซต์
Imagify Image Optimizer ลดขนาดรูป เพื่อเพิ่มความเร็วในการเข้าเว็บไซต์
WP Smush – Image Optimization ลดขนาดรูป เพื่อเพิ่มความเร็วในการเข้าเว็บไซต์
Autoptimize บีบพวก html css js เพื่อเพิ่มความเร็วในการเข้าเว็บไซต์
WP-Optimize ทำความสะอาดฐานข้อมูล และ ไฟล์ที่ไม่จำเป็นออก
P3 (Plugin Performance Profiler) เช็คการทำงานของเว็บไซต์

ปลั๊กอินสร้างเว็บไซต์หลายภาษา

ชื่อตัวเสริม คุณสมบัติตัวเสริม
Polylang สร้างเว็บไซต์ 2ภาษา (ฟรี)
qTranslateX สร้างเว็บไซต์ 2ภาษา (ฟรี)
WPML สร้างเว็บไซต์ 2ภาษา (ไม่ฟรี)

ปลั๊กอินเพิ่มความปลอดภัยเว็บไซต์

ชื่อตัวเสริม คุณสมบัติตัวเสริม
Jetpack by WordPress คุณสมบัติหลากหลาย โดยเฉพาะเรื่องป้องกันความปลอดภัย
Wordfence Security แสกนเว็บไซต์ป้องกันความปลอดภัย ปล.หนักไม่เหมาะกับติดตั้งตลอดเวลา
Captcha by BestWebSoft ให้บวกลบตัวเลขก่อนเข้าสู่ระบบป้องกันเรื่องความปลอดภัย
Lockdown WP Admin เปลี่ยน url การเข้าหลังบ้าน
All In One WP Security & Firewall ป้องกันความปลอดภัยของเว็บไซต์

ปลั๊กอินระบบเว็บบอร์ด & ระบบคอมเม้นท์

ชื่อตัวเสริม คุณสมบัติตัวเสริม
bbPress สร้างเว็บบอร์ด ถามตอบ
DW Question & Answer สร้างเว็บบอร์ด ถามตอบ
AnsPress สร้างเว็บบอร์ด ถามตอบ
BuddyPress สร้างเว็บบอร์ด ถามตอบ
Disqus Comment System ระบบคอมเม้นท์
Facebook Comments ระบบคอมเม้นท์เฟสบุ๊ค
DW Reactions สร้างปุ่ม Like หลายอารมร์แบบ Facebook

ปลั๊กอินสำรองข้อมูล & ย้ายโฮส

ชื่อตัวเสริม คุณสมบัติตัวเสริม
all-in-one-wp-migration สำรองข้อมูล กับ ย้ายโฮส
Duplicator ย้ายโฮส
BackUpWordPress สำรองข้อมูล
UpdraftPlus สำรองข้อมูล

ปลั๊กอินจัดการป้ายโฆษณา

ชื่อตัวเสริม คุณสมบัติตัวเสริม
AdRotate ระบบจัดการป้ายโฆษณา

ปลั๊กอิน Social

ชื่อตัวเสริม คุณสมบัติตัวเสริม
Simple Share Buttons Adder สร้างปุ่ม Social Share ไม่มี Line (ฟรี)
Seed Social สร้างปุ่ม Social Share มี Line (ฟรี)
Easy Social Share Buttons for WordPress สร้างปุ่ม Social Share มี Line (ไม่ฟรี)
Facebook Login ล็อกอินจาก Facebook
Social Login ล็อกอินจากโซเชียลต่างๆ
Sidebar Login ใช้แสดงรายละเอียดผู้ที่ทำการล็อกอิน อื่นๆ

ปลั๊กอินสร้าง Post Type & Custom Field

ชื่อตัวเสริม คุณสมบัติตัวเสริม
Toolset Types สร้าง Custom Post Type, Taxonomy, Custom Fields
custom-post-type-ui สร้าง Custom Post Type, Taxonomy
Advanced Custom Fields สร้าง Custom Fields
Pods – Custom Content Types and Fields สร้าง Custom Post Type, Taxonomy, Custom Fields

ปลั๊กอินระบบค้นหา

ชื่อตัวเสริม คุณสมบัติตัวเสริม
FacetWP ระบบค้นหาแบบมี field ให้กรอก (ไม่ฟรี)
Search & Filter ระบบค้นหาแบบมี field ให้กรอก (ฟรี)
Ajax Search Lite ปุ่มค้นหาแสดงผลทันที

ปลั๊กอินสร้างตาราง & ฟอร์ม

ชื่อตัวเสริม คุณสมบัติตัวเสริม
Easy Table สร้างตาราง
TablePress สร้างตาราง
Contact Form 7 สร้างฟอร์ม (ฟรี)
Caldera Forms สร้างฟอร์ม (ฟรี)
Gravity Forms สร้างฟอร์ม (ไม่ฟรี)

ปลั๊กอินสร้างสไลเดอร์ & ปฏิทิน

ชื่อตัวเสริม คุณสมบัติตัวเสริม
RoyalSlider สร้างสไลเดอร์ (ไม่ฟรี)
LayerSlider สร้างสไลเดอร์ มีลูกเล่นแยก Layer (ไม่ฟรี)
Smart Slider 3 สร้างสไลเดอร์ (ฟรี)
The Events Calendar สร้างปฏิทินกิจกรรม
Appointment Calendar สร้างปฏิทินนัดหมาย

ปลั๊กอินสร้างลูกเล่นอื่นๆ

ชื่อตัวเสริม คุณสมบัติตัวเสริม
Foo Gallery สร้างแกลอรี่
Nextgen Gallery สร้างแกลอรี่
Gallery สร้างแกลอรี่
WP-VR-view สร้างภาพแบบ 360 องศา (ฟรี)
360 Virtual Tour WP สร้างภาพแบบ 360 องศา (ไม่ฟรี)
blueimp lightbox ทำให้รูปภาพเมื่อคลิ๊กแล้วจะเด้งเป็น popup สวยงาม
WP Featherlight ทำให้รูปภาพเมื่อคลิ๊กแล้วจะเด้งเป็น popup สวยงาม
Embed Any Document จัดการพวกไฟล์เอกสาร เช่น pdf

ปลั๊กอินระบบเกี่ยวกับสร้างบทความ

ชื่อตัวเสริม คุณสมบัติตัวเสริม
Recent Posts Widget Extended แสดงบทความตามที่ต้องการในวิดเจ๊ด
Flexible Posts Widget แสดงบทความตามที่ต้องการในวิดเจ๊ด
Custom Post Widget แสดงบทความตามที่ต้องการในวิดเจ๊ดของแต่ละบทความ
Related Posts Thumbnails แสดงบทความที่เกี่ยวข้อง
Related Posts By Taxonomy แสดงบทความที่เกี่ยวข้องจาก Taxonomy

ปลั๊กอินระบบตอบลูกค้า & Live Chat

ชื่อตัวเสริม คุณสมบัติตัวเสริม
Awesome Support ระบบ Ticket ตอบปัญหาลูกค้า
WP Support Plus Responsive Ticket System ระบบ Ticket ตอบปัญหาลูกค้า
Simple Ajax Chat ระบบ Live Chat
ClickDesk ระบบ Live Chat (ไม่ฟรี)

ปลั๊กอิน Mail

ชื่อตัวเสริม คุณสมบัติตัวเสริม
Postman SMTP ระบบเมล
Bloom email opt-in ระบบเมล (ไม่ฟรี)
WP Subscribe Pro ระบบเมล (ไม่ฟรี)

ปลั๊กอินอื่นๆ

ชื่อตัวเสริม คุณสมบัติตัวเสริม
AJAX Thumbnail Rebuild สร้างรูป Thumbnail ใหม่
cms-tree-page-view จัดเรียงอันดับ post page
theme-test-drive แยกการแสดงผลธีมในแต่ละอุปกรณ์
Redirection redirect url
Seed Buddhist Year เปลี่ยนปี ค.ศ. เป็นปี พ.ศ.
Seed Fonts เปลี่ยนฟอนต์ภาษาไทย
Ultimate Member ระบบ Member (ฟรี)
Disable Google Fonts ปิด Google Fonts
Hide Admin Bar ซ่อน Admin Bar
LONG URL MAKER แก้ปัญหา url ไทยโดนตัดคำ
WP Pro Quiz สร้างแบบทดสอบ
ขอบคุณข้อมูลดี ๆ จาก คุณ Narongchai Suphiratwanich
https://www.beanthemes.com/knowledge/wordpress-pluins-2016/

11 วิธีทำให้เว็บโหลดเร็วขึ้นราวกับติดจรวด (สำหรับ WordPress)

ความเร็วเป็นต่อ รูปหล่อเป็นรอง! 11 วิธีทำให้เว็บโหลดเร็วขึ้นราวกับติดจรวด (สำหรับ WordPress)

“ความเร็วเป็นต่อ รูปหล่อเป็นรอง”

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

การทำเว็บก็เช่นกัน… (กว่าจะวกกลับมาได้!) ใครที่สามารถหาวิธีทำให้เว็บโหลดเร็วกว่าก็มักจะมีโอกาสมากกว่าคนอื่นๆ

ผมรับรองเลยว่าถ้าคุณอ่านบทความนี้จบ แล้วลองปรับตาม เว็บไซต์ของคุณต้องเร็วขึ้นกว่าเดิมเป็นหลักวินาทีอย่างแน่นอนครับ : )

เว็บโหลดเร็วมันดียังไง?

เหตุผลหลักๆ มีอยู่แค่ 2 ข้อ แต่เป็น 2 ข้อที่สำคัญมากๆ สำหรับใครก็ตามที่จะทำธุรกิจบนโลกออนไลน์ผ่านเว็บของตัวเองเลยล่ะ

1. ทำให้ Search Engine Ranking ของเราบน Google ดีขึ้น

โดยปกติแล้ว Google จะเก็บอัลกอริทึ่ม Search Engine ของตัวเองไว้เป็นความลับสุดยอด ซึ่งบนโลกใบนี้ไม่มีใครสามารถบอกได้เป๊ะๆ ว่าเราต้องทำยังไงถึงจะทำให้ Keyword ของเราติดหน้าแรกของ Google ได้

แต่ถึงอย่างนั้นก็ยังมีผู้เชี่ยวชาญหลายๆ คน พยายามแกะรอยอัลกอริทึ่มของ Google ออกมา ซึ่งเว็บไซต์ Backlinko เองก็เป็นหนึ่งในนั้น และจากการวิเคราะห์ข้อมูลจากผลการค้นหาบน Google กว่า 1 ล้านครั้งBacklinko ก็ได้ค้นพบว่าเว็บที่โหลดเร็วจะมี Search Engine Ranking บน Google สูงกว่าเว็บที่โหลดช้าอย่างเห็นได้ชัด

แต่ถ้าไม่อยากเชื่อผู้เชี่ยวชาญ ก็ลองไปอ่าน Search Engine Guideline ของ “ผู้เชี่ยวชาญกว่า” อย่าง Google ได้นะ

2. ทำให้คนเข้าเว็บของเรามากขึ้น

คุณเคยกินเครปป้าเฉื่อยไหมครับ?

ถ้าใครที่เคยกินก็จะรู้ว่ากว่าเราจะได้กินเครปชิ้นนึงเนี่ย ใช้เวลานานมากกก แต่ถึงอย่างนั้นเราก็ยังยอมรอเพราะว่าเครปของป้าแกอร่อยสุดๆ

แต่สมมุติว่าวันดีคืนดี มีร้านอีกร้านมาเปิดข้างๆ ร้านเครปป้าเฉื่อย ชื่อว่าเครปลุงฉิวที่ทำเร็วกว่าป้าเฉื่อย 5 เท่า แถมรสชาติยังอร่อยพอๆ กันอีกด้วย เป็นคุณ คุณจะเลือกกินร้านไหนครับ?

เคสที่พึ่งยกไปนั้นอาจจะไม่เกินขึ้นบ่อยนักบนโลกออฟไลน์ แต่สำหรับโลกออนไลน์น่าจะมีโอกาสเกิดขึ้นบ่อยมากเลยล่ะ ต่อให้เว็บของเราจะสวยขั้นเทพ หรือเนื้อหาจะน่าเสพสักขนาดไหน ถ้าลูกค้าของเราต้องรอเกิน 5 วินาทีแล้วละก็ เขาอาจจะกดปิดแล้วหันไปหาเว็บอื่นที่มีของคล้ายๆ เราก็เป็นได้ ซึ่ง Kissmetrics ที่เป็นเว็บที่ขาย Software Analytics ชื่อดังนั้นก็ตอกย้ำความเชื่อนี้ด้วยข้อมูลที่ว่า 25% ของลูกค้านั้นพร้อมที่จะกดปิดเว็บของเราถ้าต้องรอนานเกิน 4 วินาที

25% นี่ไม่น้อยเลยนะครับ!

วิธีการเช็คความเร็วเว็บ

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

เว็บที่ผมแนะนำให้ใช้ในการเช็คความเร็วมีอยู่ 3 เว็บคือ GTMetrixPingdom และ WebPageTest

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

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

รูปข้างล่างเป็นตัวอย่างที่ผมเทสความเร็วของ Content Shifu บน GTMetrix กับ Pingdom ก่อนที่จะปรับเว็บให้โหลดเร็วขึ้นครับ

Speed test at GT Metrix (Before optimization)_R2

Speed test at Pingdom (Before optimization)_R2

มาเปลี่ยนป้าเฉื่อยเป็นลุงฉิวกันเถอะ! 11 วิธีทำให้เว็บ WordPress โหลดเร็วขึ้นราวกับติดจรวด

ก่อนเริ่มมีอยู่ 2 เรื่องมีผมอยากจะบอก เรื่องแรกเลยก็คือวิธีส่วนใหญ่ที่จะเขียนถึงนั้นเป็นวิธีที่ใช้ได้กับ WordPress เป็นหลัก แต่ตัวหลักการเองน่าจะเอาไปปรับใช้กับ CMS (Content Management System) หรือเว็บรูปแบบอื่นได้เช่นกัน อย่างที่สองก็คือวิธีเหล่านี้จะเป็นวิธีสำหรับคนที่เขียนโปรแกรมไม่เป็น (เพราะผมเองก็ไม่เขียนโปรแกรมเช่นกัน) สำหรับโปรแกรมเมอร์ทั้งหลาย ถ้ามีวิธีที่ดีกว่า หรือง่ายกว่าก็กรุณาแนะนำผมใน comment ด้วยนะ

1. เลือก Hosting ให้ดี

Siteground Hosting

ถ้าเปรียบการสร้างเว็บเหมือนการสร้างร้านอาหาร การเลือก Hosting ก็เปรียบเสมือนการเลือกสถานที่ตั้งของร้านเรา

ข้อมูลทุกอย่างของเว็บเราไม่ว่าจะเป็นบทความ หรือรูปภาพก็จะถูกเอาไปเก็บไว้บน Hosting ที่เราเลือกถ้าเราเลือกได้ดีก็จะเป็นศรีแก่ตัว แต่ถ้าเลือกได้มั่วก็อาจจะทำให้เราเสียใจภายหลังได้

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

สำหรับใครที่ไม่ได้มีความรู้เรื่องเทคโนโลยีมาก ผมแนะนำให้ใช้ Managed Hosting (มีผู้เชี่ยวชาญคอยดูแลเซอร์เวอร์ให้ตลอด) ดีกว่า จะได้ไม่ต้องมานั่งปวดหัวกับเรื่องที่เราไม่ถนัด

Hosting ของต่างชาติที่ผมชอบและอยากจะแนะนำคือ Synthesis (แพง), WP Engine (แพง) และ Siteground(ไม่แพงมาก – ผมใช้อันนี้อยู่) ส่วนของไทย ตัวที่ผมแนะนำคือของ Hostneverdie (ผมเคยใช้เจ้านี้ – บริการดีเลยครับ)

ถ้าอยากศึกษาว่าปัจจัยในการเลือก Hosting มีอะไรบ้าง ลองอ่านบทความ ‘วิธีการเลือก Web Hosting‘ ดูครับ

2. เลือก Theme ให้ดี

Themeforest

ถ้าใครที่กำลังดูๆ หาวิธีทำเว็บโดยใช้ WordPress อยู่ ผมแนะนำให้ใช้ WordPress.org แทนที่จะเป็น WordPress.com เพราะมันจะยืดหยุ่นกว่า และทำอะไรได้หลากหลายกว่ามาก และเนื่องจากว่า WordPress.org นั้นเป็น Open-source Software ที่ใครจะเอาไปพัฒนาต่อยอดยังไงก็ได้

ซึ่งสิ่งที่คนเอาไปพัฒนาต่อยอดนั้นจะเรียกว่า Theme

และด้วยความที่ว่ามันเป็น Open-source Software นี่เอง เลยทำให้ Theme ที่ถูกสร้างขึ้นมานั้นมีคุณภาพต่างกันไปทั้งดีมาก ดีน้อย ไม่ค่อยดี จนไปถึงขั้นห่วยเลยก็มี

ถ้าอยากได้ Theme ที่ดีมาก และเร็วมาก ผมแนะนำ Genesis Framework ของ Studio Press ครับ (แต่ข้อด้อยคือจะปรับแต่งได้น้อย หรือถ้าจะปรับแต่งก็ต้องมีความรู้เรื่องเขียนโปรแกรม) หรือถ้าอยากปรับแต่งอะไรได้มากขึ้น แต่อาจจะต้องแลกมาด้วยความเร็วที่ช้าลงนิดหน่อย ก็ลองไปดู Divi ของ Elegant Themes และ Theme ของ My Theme Shop ครับ ตัวสุดท้ายที่อยากจะแนะนำคือ Themeforest ที่เป็นแนว Market Place ที่นักพัฒนาคนไหนจะนำ Theme มาขายก็ได้ ซึ่งอันนี้ต้องระวังพอสมควรเลยล่ะ คำแนะนำของผมคือให้เลือก Theme ที่เป็น Popular Theme และมีคะแนนรีวิวมากกว่า 4.5 คะแนนขึ้นไป

นอกจากบริษัทพัฒนา Theme ของต่างชาติแล้ว ประเทศไทยของเราเองก็มี Seed Themes ที่เป็นแหล่งรวม Theme ที่สร้างโดยคนไทยซึ่งความสวยงาม และคุณภาพไม่แพ้เมืองนอกเลยครับ

3. เลือก Plugin ให้ดี และติดตั้ง Plugin เท่าที่จำเป็น

Codecanyon

Plugin WordPress เกือบทั้งหมดบนโลกของ WordPress กว่า 2 แสนตัวนั้นก็เป็น Open-source Software เหมือนกับ Theme เพราะฉะนั้นเราต้องดูให้ดีๆ ก่อนดาวน์โหลด หรือซื้อ Plugin สักตัวมาติดที่เว็บของเรา นอกจากนั้นแล้วอีกเรื่องที่สำคัญมากๆ เลยก็คือ เราควรจะติดตั้ง Plugin ‘เท่าที่จำเป็น’ ถ้าเราติดตั้ง Plugin น้อยเกินไป เว็บก็อาจจะไม่สามารถทำงานได้อย่างที่เราคาดหวัง ถ้าเราติดตั้ง Plugin มากเกินไป เว็บก็อาจจะไม่เร็วดั่งใจ

ผมแนะนำว่า Plugin ที่ควรจะมีติดเว็บไว้ก็คือ Plugin ที่สร้างโดย WordPress อย่าง JetpackAkismetWP Super Cache นอกจากนั้นแล้ว Plugin พื้นฐานอย่างพวก SEO Plugin (ผมชอบ Yoast SEO), Backup Plugin (ผมชอบ UpdraftPlus) และ Social Sharing Plugin (ผมชอบ Easy Social Share Buttons และ Seed Social) ก็ควรจะมีติดไว้ด้วยเช่นกัน ส่วนตัวอื่นนอกเหนือจากนี้ก็ลองเลือกดูตามความเหมาะสมกับการใช้งาน

นอกจาก Plugin ในตัวระบบ WordPress เองแล้ว Codecanyon ก็เป็นอีกหนึ่งสถานที่ที่เป็นแหล่งรวม Plugin เจ๋งๆ อย่าง Visual ComposerSlider Revolution และอื่นๆ มากมาย

ในความเห็นของผม จำนวน Plugin ที่เราติดตั้งและใช้งานควรอยู่ระหว่าง 10-15 ตัวครับ

Shifu แนะนำ

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

4. ลดขนาดไฟล์ด้วยการบีบอัดรูปภาพ

Kraken Image Optimizer

รูปภาพเป็นหนึ่งในปัจจัยที่สำคัญที่สุดที่จะทำให้เว็บโหลดเร็วเป็นจรวด หรือโหลดช้าเป็นเต่าคลาน

วิธีที่ทุกคนน่าจะคุ้นเคยกันดีในการทำรูปภาพมีขนาดเล็กลงซึ่งก็คือการลดขนาดรูป เช่น การลดขนาดรูปจาก 1,500×1,000 pixels เป็น 1,000×500 pixels แต่จริงๆ แล้วมันมีวิธีที่ทำได้มากกว่านั้น โดยที่คุณภาพของรูปภาพไม่เสียด้วย!

วิธีที่ว่านั่นก็คือการบีบอัดรูปภาพ วิธีนี้จะไม่ทำให้ขนาดของรูปเปลี่ยน คือถ้ารูปภาพ Size 1,000×500 pixels ขนาดหลังจากการบีบอัดรูปก็ยังจะคงมีขนาด 1,000×500 pixels เท่าเดิม สิ่งที่จะเปลี่ยนก็คือขนาดของไฟล์นั้นๆ ซึ่งถ้ารูปไม่ได้มีรายละเอียดเยอะเกินไป บางโปรแกรมสามารถบีบอัดรูปให้เหลือขนาดเล็กลงได้กว่า 60% เลย (เช่นถ้ารูปเดิมมีขนาดไฟล์ 500 kb หลังจากที่บีบอัดรูปผ่านโปรแกรมแล้วอาจจะทำให้ขนาดไฟล์เหลือแค่ 200 kb เท่านั้นเอง)

สำหรับโปรแกรมบีบอัดรูปนั้นที่ผมแนะนำก็จะมี TinypngKrakenEwww Image Optimizer และ WP Smush(ตัวนี้เป็น Plugin ใช้ได้กับ WordPress เท่านั้น)

ใช้โปรแกรมใดโปรแกรมหนึ่งข้างบนนี้ทุกครั้งก่อนอัพรูปขึ้นเว็บ รับรองว่าโหลดเร็วขึ้นอีกเยอะแน่นอน

Shifu แนะนำ

โปรแกรมย่อ/ขยายขนาดรูปภาพแบบง่ายๆ ที่ผมชอบใช้มีอยู่ 2 เว็บก็คือ Pixlr Express และ Photoscape ซึ่งเป็นโปรแกรมฟรีทั้ง 2 ตัวเลยครับ

5. ทำ Lazy Load

ถ้าเว็บไหนมีรูป หรือมีพวก Script เยอะมากๆ การทำ Lazy Load จะเป็นสิ่งจำเป็นมากๆ เลยครับ

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

Theme WordPress แบบพรีเมี่ยมหลายๆ Theme จะมี Feature นี้ให้อยู่แล้ว แต่ถ้า Theme ของคุณไม่มี ก็สามารถโหลด Plugin ชื่อว่า Lazy Load มาใช้ได้ครับ

6. พยายามพึ่งพาทรัพยากรภายนอกให้น้อยที่สุด

หลายๆ ครั้งที่เราเขียนบล๊อกหรือทำเว็บ เราอาจจะฝังวีดีโอจาก YouTube, สไลด์จาก Slideshare หรือรูปของเว็บอื่นลงบนเว็บของเรา

ตัว YouTube กับ Slideshare ไม่น่าจะส่งผลกับเว็บของเราเท่าไหร่ แต่รูปของจากแหล่งอื่นมีโอกาสส่งผลเยอะมากครับ เพราะว่าเราจะไม่รู้ว่ารูปของเขาขนาดเท่าไหร่และเว็บของเขาช้าแค่ไหน วิธีที่ผมแนะนำคือโหลดรูปนั้นมาแล้วเอาไปผ่านวิธีที่ 4

Shifu แนะนำ

รูปที่โหลดมาควรจะเป็นรูปที่อนุญาตให้เอามาใช้ได้นะครับ ถ้าใครไม่รู้ว่าจะหารูปฟรีสวยๆ ไม่ติดลิขสิทธิ์จากไหน ผมแนะนำ 2 ที่นี้เลยครับ Pixabay และ Unsplash

7. เก็บ Cache ใน Browser (Leverage Browser Caching)

การเก็บ Cache บน Browser เป็นอีกหนึ่งวิธีที่สำคัญที่สุดที่จะช่วยให้เว็บโหลดเร็วขึ้นมากๆ

เผื่อว่าใครไม่รู้จัก Cache ผมขออธิบายง่ายๆ แบบนี้นะครับ การเก็บ Cache เป็นการฝังข้อมูลชิ้นเล็กๆ ที่เรียกว่า Cookies ลงไปยัง Browser (เช่น Chrome, IE และ Firefox) ของคนที่เข้ามาเยี่ยมชมเว็บของเรา และในครั้งหน้าที่เขากลับมาเยี่ยมชมเว็บของเราอีกครั้ง ข้อมูลส่วนใหญ่ก็จะถูกเรียกจาก Cache แทนที่จะต้องเรียกใหม่ทั้งหมด

วิธีการเก็บ Cache ใน Browser ที่น่าจะง่าย และซับซ้อนน้อยที่สุดก็คือการใส่ Code นิดหน่อยลงไปใน file .htaccess ครับ ใครอ่านแล้วงงก็อย่าพึ่งกลัวนะครับ จริงๆ แล้วทำไม่อยากเลย เดี๋ยวผมจะโชว์ให้ดูทีละสเต๊ป

ขั้นที่ 1: Login เข้า Hosting ของเราแล้วเข้าไปที่ C-Panel จากนั้นลองเลื่อนๆ หา Folder ที่เขียนว่า File Manager ดู (ตัวอย่างที่โชว์ให้ดูนี้เป็นของ Siteground นะครับ Hosting เจ้าอื่นอาจจะมีหน้าตาต่างจากนี้เล็กน้อย)

Siteground File Manager

ขั้นที่ 2: เมื่อ Click Folder File Manager แล้วมันจะมี Pop up เด้งขึ้นมา ให้เราเลือก Show Hidden Files (dotfiles) ด้วยครับ

Siteground File Manager (show hidden file)

ขั้นที่ 3: เปิด file .htaccess เพื่อแก้ไข

File Manager_htaaccess_edit

ขั้นที่ 4: เอา Code ที่อยู่ข้างล่างนี้ไปแปะไว้ในบรรทัดล่างสุดของ file .htaccess

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 year"
ExpiresDefault "access plus 2 days"
</IfModule>
## EXPIRES CACHING ##

ทีนี้ทุกครั้งที่มีคนเข้ามาเว็บของเรา Browser ของเขาก็จะทำการเก็บ Cache บางอย่างไว้ (เช่นพวก Logo, Header หรือ Footer) และครั้งต่อมาที่เขาเข้ามาเว็บของเรา รับรองว่าโหลดลื่นหัวแตกแน่นอน : )

8. ใช้ Gzip Compression

คำว่า Gzip Compression อาจจะฟังดูงงๆ แต่ผมเชื่อว่าหลายๆ คนคงจะคุ้นเคยกับการบีบอัดไฟล์ หรือโฟลเดอร์ด้วยโปรแกรม WinZip หรือ WinRAR แน่ๆ

หลักการของ Gzip Compression ก็คล้ายๆ กันเลย จะต่างกันตรงที่การทำ Gzip Compression นั้นจะทำการย่อไฟล์บนเว็บของเรา ซึ่งจะทำให้เว็บโหลดเร็วขึ้นอีกมาก

วิธีการทำจะคล้ายกับหัวข้อที่แล้วเลยก็คือการใส่ Code ข้างล่างนี้ลงไปที่ file .htaccess ครับ

## ENABLE GZIP COMPRESSION ##
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
## ENABLE GZIP COMPRESSION ##

9. Optimize Database

ถ้าเราใช้ CMS ต่างๆ อย่างเช่น WordPressJoomla หรือ Drupal ในการทำเว็บ ตัว Database ของเว็บเองจะมีการเก็บข้อมูลไว้ตลอดอยู่แล้ว (พวก Auto Draft, Revisions และ Spam Comment ต่างๆ) ซึ่งถ้า Database ของเราเก็บข้อมูลเหล่านี้ไว้เยอะเกินไป ก็อาจจะทำให้เว็บช้าลงได้

ถ้าใครใช้ WordPress อยู่ แนะนำให้ติด Plugin ฟรีชื่อว่า WP Optimize ของ Elegant Themes แล้วก็ให้ตัว Plugin ช่วยจัดการลบสิ่งที่ไม่จำเป็น และ Optimize Database ของเราให้เลยครับ

ส่วนถ้าใครไม่ได้ใช้ WordPress ก็ลองไปดูวิธีการ Optimize Database ด้วยตัวเองได้ที่ลิงก์นี้เลยครับ

10. ใช้ CDN (Content Delivery Network)

Cloudflare

โดยปกติแล้วถ้าคนที่เข้าเว็บของเราอยู่แค่ในประเทศไทย CDN จะไม่จำเป็นเลย แต่ถ้าลูกค้าเรามาจากทั่วโลกล่ะก็ CDN จะทำให้เว็บของเราโหลดเร็วมากขึ้นมากๆ เลยล่ะ

อธิบายง่ายๆ เลยก็คือ CDN จะเป็นบริการที่เก็บ Cache ของเว็บเราไว้ในเซอร์เวอร์ที่อยู่บนที่ต่างๆ ทั่วโลก ถ้าคนเข้าเว็บของเราจากอเมริกา ข้อมูลหน้าเว็บเราก็จะโหลดจาก Server ของ CDN ในแถบอเมริกา ถ้าคนเข้าเว็บของเราจากอังกฤษ ข้อมูลหน้าเว็บเราก็จะโหลดจาก Server ของ CDN ในแถบอังกฤษ

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

ซึ่งบริษัทที่ให้บริการ CDN นั้นมีหลายบริษัทมากๆ แต่ตัวทีผมอยากจะแนะนำก็คือ Cloudflare เพราะว่ามันฟรี (เมี่ยม) ครับ (ลองดูวิธีการติดตั้ง Cloudflare ได้ที่นี่เลย)

11. ติดตั้ง Plugin สำหรับเก็บ Cache

Plugin WordPress สำหรับเก็บ Cache ที่ผมอยากจะแนะนำมีอยู่ 3 ตัวครับ ตัวแรกคือ WP Super Cache – ตัวนี้เป็น Plugin ที่สร้างโดย WordPress จะใช้งานง่ายที่สุด และที่สำคัญคือฟรีตลอดกาล, ตัวที่สองคือ W3 Total Cache – ตัวนี้จะใช้ตั้งค่ายากกว่าเยอะ (ถ้าอยากอ่านเพิ่มเติมเกี่ยวกับวิธีการตั้งค่าสามารถเข้าไปอ่านได้ที่ WPBeginner ครับ) แต่ข้อดีคือมี Feature หลากหลายกว่า และฟรี (เมี่ยม) ตัวสุดท้ายคือ WP Rocket ซึ่งตัวนี้จะเป็นตัวที่เขาว่ากันว่าครบเครื่องที่สุด (ผมไม่เคยใช้เอง) ข้อด้อยคือต้องเสียเงินทันทีครับ ($39)

Shifu แนะนำ

W3 Total Cache นั้นจะครอบคลุมถึงเรื่อง Browser Caching, Gzip Compression และ CDN อยู่แล้ว ถ้าใครใช้ Plugin ตัวนี้ ก็สามารถข้ามวิธีที่ 7, 8 และ 10 ไปได้เลยครับ

ถ้า W3 Total Cache ใช้งานยากเกินไป และคุณยังไม่อยากเสียเงินให้กับ WP Rocket ก็ใช้แค่ Plugin ฟรีอย่าง WP Super Cache ก็ได้ครับ ผมแนะนำให้ติด Plugin ชื่อว่า Autoptimize สำหรับการ Optimize CSS, Javascript และ HTML เข้าไปด้วย และตอนจะเลือก Optimize แนะนำว่าให้อย่า Optimize 3 อย่างนี้พร้อมกันครับ ให้ลองเปิด และเทสทีละอย่าง เพราะว่าบางอย่างมันอาจจะทำให้เว็บเราพังได้ 

สรุป

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

รูปข้างล่างเป็นตัวอย่างของการเทสความเร็วเว็บบน GT Metrix และ Pingdom หลังจากที่ทำการปรับเว็บให้เร็วขึ้นแล้วนะครับ จะเห็นได้ว่าเร็วกว่าก่อนปรับประมาณ 2-3 วินาทีเลย

Speed test at GT Metrix (After optimization)_R2

Speed test at Pingdom (After optimization)_R2

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

เรื่องที่ผมอยากจะเน้นย้ำมากๆ เลยก็คือก่อนที่จะทดลองใช้ 11 วิธีที่บอกไป คุณควรจะเทสความเร็วเว็บของคุณด้วย GTMetrixPingdom หรือ WebPageTest ก่อน เพื่อจะได้รู้ว่าเว็บช้าที่จุดไหน จะได้เกาให้ถูกที่คัน

ถ้าเว็บเราเร็ว และคอนเทนต์เราดี รับรองว่าคนอ่านไม่หนีไปไหนแน่นอน

ขอบคุณข้อมูลดี ๆ จาก

ความเร็วเป็นต่อ รูปหล่อเป็นรอง! 11 วิธีทำให้เว็บโหลดเร็วขึ้นราวกับติดจรวด (สำหรับ WordPress)