วิธีสร้างสภาพแวดล้อม Staging สำหรับ WordPress: คู่มือขั้นตอนต่อขั้นตอน

เคยทำการเปลี่ยนแปลงเว็บไซต์แล้วหลังจากนั้นเห็นว่าไม่ควรทำหรือไม่?

ทำการแก้ไขบนเว็บไซต์แล้วพบภายหลังว่าไม่พอดี หรือทำให้เว็บไซต์เสียหาย เป็นฝันร้าย

ไม่เพียงแต่ต้องหาวิธีกู้คืนเว็บไซต์ไปยังจุดก่อนการแก้ไข อาจต้องซ่อมเว็บที่เสียด้วย

เพิ่มเติม เราสมมติว่าคุณใช้เวลาพอสมควรทำการแก้ไข และตอนนี้ต้องใช้เวลาเพิ่มอีกในการย้อนกลับ

เราเข้าใจความรู้สึกนี้ เราทุกคนเคยผ่านมา

จะดีมากถ้าคุณทดสอบการแก้ไขก่อนนำไปใช้บน Live site เรื่องนี้คือสิ่งที่ Staging Environment จะช่วยคุณทำได้

Staging site คือสำเนาของ Live site มันให้พื้นที่ทดสอบโดยไม่เสี่ยง Live site

ในบทความนี้ เราจะแสดงวิธีสร้าง Staging site สำหรับเว็บไซต์ WordPress อย่างแน่ชัด

TL;DR: มีหลายวิธีสร้าง Staging แต่วิธีง่ายที่สุดคือดาวน์โหลดและติดตั้งปลั๊กอินอย่าง BlogVault Staging จะช่วยสร้างเว็บไซต์ได้เพียงคลิกปุ่มเดียว ไม่ chỉนั้น หลังแก้ไขบน Staging ยังช่วย Push การเปลี่ยนแปลงจาก Staging ไป Live site ด้วยคลิกปุ่มเดียว

WordPress Staging Environment คืออะไร?

สภาพแวดล้อม Staging site คือสำเนาของ Live website Staging environments ใช้สำหรับรันการทดสอบและทดลองการเปลี่ยนแปลง

WordPress Staging site มีประโยชน์เมื่อ:

1. ต้องการอัปเดตเว็บไซต์ บางครั้งอัปเดตเว็บ หรือเพียงปลั๊กอินเดียว อาจก่อปัญหาความเข้ากันได้ ทำให้เว็บไซต์เสีย
2. ต้องการลองธีมใหม่หรือปลั๊กอินใหม่
3. ต้องการทำการเปลี่ยนแปลงใหญ่ เช่น เปลี่ยนเลย์เอาต์, รูปภาพ, และการออกแบบ
4. ต้องการ Troubleshoot (แก้ไขปัญหา) บน Live site หาก Troubleshoot บน Live site อาจก่อปัญหาเพิ่ม และส่งผลต่อประสบการณ์ผู้เยี่ยมชม

WordPress Staging environments มีประโยชน์มาก แต่ก็มีข้อเสีย ในส่วนต่อไป เราจะสำรวจ Pros และ Cons

ข้อดีของการใช้ Staging Environment

1. Staging site ช่วยทดลองบนเว็บไซต์โดยไม่เสี่ยงทำให้ Live site เสีย
2. ช่วย รันอัปเดต ตรวจสอบว่าก่อปัญหาความเข้ากันได้หรือไม่ โดยไม่เสี่ยง Live site หรือเว็บไซต์ต้นฉบับ
3. ใช้ Staging environment สามารถ ค้นหาสาเหตุปัญหาสำคัญ ที่ทำร้ายเว็บไซต์ โดยไม่ต้องปิดเว็บ Maintenance mode
4. Staging websites ช่วย ตรวจสอบสำเนาสำรอง (Backup copies) เมื่อต้องการกู้คืนสำเนาเฉพาะ Staging site ช่วยระบุสำเนา และตรวจสอบว่าสำเนานั้นทำงานได้จริง

ข้อเสียของการใช้ Staging Environment

1. การสร้าง Staging site ต้อง ลงทุนเงินเพิ่ม โฮสติ้งอาจเสนอ Staging services ค่าใช้จ่ายเพิ่ม บางปลั๊กอิน Staging เป็นบริการเสียเงิน
2. การตั้งค่า Staging environment อาจ ซับซ้อนและใช้เวลานาน
3. 而且 การจำลองการเปลี่ยนแปลงจาก Staging ไป Live site ก็อาจใช้เวลานาน หากทำการเปลี่ยนแปลงมากหรือซับซ้อน มีโอกาสสูงว่าคุณจะลืมว่าทำอะไรบน Staging site ไปบ้าง

สำคัญ: มีความท้าทายกับ Staging websites แต่เอาชนะได้ ตัวอย่างปลั๊กอินอย่าง BlogVault ให้บริการ Staging ฟรี มีวิธีง่ายสร้าง Staging environment และ Replicate การเปลี่ยนแปลงจาก Staging ไป Live site แค่คลิกปุ่ม

A staging site environment is basically a replica of your live website. Staging environments are used to run tests and experiment with changes.

วิธีสร้าง Staging Environment ใน WordPress?

มี 3 วิธีสร้าง Staging Environment ใน WordPress:

i. Staging ด้วยปลั๊กอิน WordPress (ง่าย)
ii. Staging ด้วย Web Host (ง่าย)
iii. Staging ด้วยตนเอง (ยาก)

เราจะแนะนำทุกวิธี เพื่อให้คุณเลือกวิธีที่สะดวก

i. Staging ด้วยปลั๊กอิน WordPress

ก่อนหน้าเราพูดถึงปลั๊กอิน Staging บางตัวเป็นบริการพรีเมียม ในขณะที่ BlogVault ให้ฟรี ในส่วนนี้ เราจะแสดงวิธี Staging ด้วยปลั๊กอิน BlogVault แต่ก่อนไปขั้นตอน มีเหตุผลอีกมากมายว่า BlogVault เป็นตัวเลือกดี:

• ปลั๊กอิน Staging หลายตัวใช้เซิร์ฟเวอร์ของเว็บไซต์คุณจัดเก็บ Staging site เซิร์ฟเวอร์ทำงานหนักเกินไป เว็บช้า BlogVault จัดเก็บ Staging site บนเซิร์ฟเวอร์ของตัวเอง
• ปลั๊กอิน Staging หลายตัวไม่เข้ากันได้กับ Cache plugins การล้าง Cache สำคัญบน Staging เพราะช่วย Preview การเปลี่ยนแปลง BlogVault ไม่มีปัญหากับ Cache plugins
• ปลั๊กอิน Staging บางตัวไม่รองรับ Multisite แต BlogVault รองรับ Multisite ได้เต็มที่

ไปสร้าง Staging ด้วยปลั๊กอินกันเลย

1. ดาวน์โหลดและติดตั้ง ปลั๊กอิน BlogVault จะเริ่มสำรองข้อมูลเว็บไซต์ทันที
2. เมื่อเสร็จสิ้น คลิกตัวเลือก – View Site Details

3. จะนำไปหน้าใหม่ ที่มีส่วน Staging ภายใน ส่วนนั้น คลิกตัวเลือก Add Staging

ใช้เวลานานกี่นาที BlogVault จะสร้าง Staging site

4. เพื่อเข้าถึง BlogVault Staging site ต้องคลิกตัวเลือก Visit Staging Site

5. Staging sites ทั้งหมดมีการป้องกันด้วยรหัสผ่าน (Password-protected) เพื่อไม่ให้คนอื่นเข้าถึง นอกจากคุณหรือคนที่คุณแชร์ข้อมูล ต้องใช้ Username และ Password เข้าสู่ Staging environment จะหา Username และ Password ได้ที่หน้าเดียวกับตัวเลือก Visit Staging Site

หลังใช้ Staging site แล้ว คุณจะอยาก Replicate การเปลี่ยนแปลงที่ทำบน Staging ไป Live site ไม่ต้องทำด้วยตนเอง แค่ Merge Staging site กับ Live site ด้วย BlogVault คุณ Push การเปลี่ยนแปลงไป Live ได้ ประหยัดความยุ่งยากและเวลา!

ในส่วนต่อไป เราจะแสดงวิธีทำอย่างแน่ชัด –

→ การ Merge (รวม) Staging Site กับ Live Site

การ Merge Staging site กับ Live site ง่ายมากด้วย BlogVault ต้องทำแค่:

1. ล็อกอินแดชบอร์ด BlogVault ไปที่ส่วน Staging
2. เลือก Merge Staging site จะ Merge กับ Live site BlogVault ยังให้เลือกว่าจะ Push การเปลี่ยนแปลงไหนไป Live site

ภายในไม่กี่นาที การแก้ไขทั้งหมดที่ทำบน Staging site จะปรากฏบน Live site

อยากเรียนรู้เพิ่มเติมเกี่ยวกับ WordPress Staging plugins? ดูคู่มือ Best WordPress Staging Plugins ที่เราเลือกมา เพื่อให้เลือกปลั๊กอินที่เหมาะกับคุณง่ายขึ้น

ii. Staging ด้วย Web Host

บริการโฮสติ้งส่วนใหญ่เสนอ Staging facilities หากสมัครแผนระดับสูงของผู้ให้บริการอย่าง SiteGround และ Bluehost เริ่มต้น $20/เดือน จะเข้าถึง Staging sites ได้ โฮสติ้งยอดนิยมอื่นๆ เช่น WP Engine, FlyWheel, และ Kinsta ให้ Staging facilities ทุกแผน

ในส่วนนี้ เราจะแสดงวิธีเข้าถึง Staging กับ 2 โฮสติ้ง WordPress ยอดนิยม –

1. การสร้าง Staging Site บน Bluehost
2. การสร้าง Staging Site บน Kinsta

หมายเหตุ: อาจคุณไม่ได้ใช้โฮสติ้งข้างต้น แตหากทำตามขั้นตอนด้านล่าง จะได้ไอเดียวิธีสร้าง Staging site กับโฮสติ้งของตัวเอง

1. การสร้าง Staging Site บน BlueHost

หากเว็บโฮสต์อยู่บน Bluehost ขั้นตอนต่อไปนี้จะเปิดใช้งาน Bluehost staging:

• ล็อกอินเข้าสู่เว็บไซต์ WordPress
• จากเมนูบนแดชบอร์ด เลือกตัวเลือก Staging
• หน้าถัดไป เลือก Create Staging Site Bluehost จะสร้าง WordPress staging site ที่ใช้งานได้

• เพื่อเข้าถึง Staging WordPress sites ต้องเลือกตัวเลือก Go to Staging Site ตอนนี้ใช้ข้อมูลประจำตัว WordPress ล็อกอินเข้าสู่ Staging environment

การ Merge Bluehost Staging Site กับ Live Site

หลังแก้ไข Staging site แล้ว อยาก Push การเปลี่ยนแปลงไป Live site ทำตามขั้นตอน:

• จาก WordPress Dashboard เลือก Staging
• หน้าถัดไป จะเสนอให้ Merge Files หรือ Database หรือ Both

หลังเลือกตัวเลือกหนึ่ง Bluehost จะเริ่ม Merge Staging site กับ Live site

2. การสร้าง Staging Site บน Kinsta

หากเว็บโฮสต์อยู่บน Kinsta ขั้นตอนต่อไปนี้จะเปิดใช้งาน Kinsta staging:

• ล็อกอินบัญชีโฮสติ้ง Kinsta แล้วเลือกเว็บไซต์ที่ต้องการ Stage
• หาตัวเลือก Staging Environment คลิกเข้าไป
• หน้าถัดไป เลือก Staging > Create A Staging Environment

• เมื่อ Staging site พร้อม จะหา URL ของ Environment ได้โดยไปที่ Domain

การ Merge Kinsta Staging Site กับ Live Site

ตอนนี้ Merge การเปลี่ยนแปลงจาก Staging ไป Live ทำตามขั้นตอน:

• ล็อกอินแดชบอร์ด Kinsta และ เลือก Staging site
• จากนั้นเลือก Staging Environment > Push Staging to Live

แค่นี้ Kinsta จะ Merge Staging site กับ Live site

iii. Staging WordPress Site ด้วยตนเอง (Manual)

การสร้าง Staging site ด้วยตนเองเป็นกระบวนการ ใช้เวลานานและซับซ้อนมาก นั่นคือเหตุผลที่ เราไม่แนะนำ Staging ด้วยตนเอง ไม่ chỉนั้น ไม่มีวิธีง่าย Push การเปลี่ยนแปลงจาก Staging ไป Live site คุณต้อง Replicate ด้วยตนเอง

สำคัญ: หากยังต้องการลองวิธี Manual เราขอแนะนำอย่างยิ่งให้สำรองข้อมูลเว็บไซต์เต็มรูปแบบ กระบวนการ Manual เกี่ยวข้องกับไฟล์และฐานข้อมูล WordPress ขณะที่คุณจัดการกับมัน อาจพลาดทำให้เว็บไซต์เสีย

กระบวนการ Manual ประกอบด้วยขั้นตอน:

1. สร้าง Subdomain ซึ่งจะทำหน้าที่เป็น Staging site
2. ดาวน์โหลดไฟล์และฐานข้อมูลจาก Live site
3. อัปโหลดไฟล์และฐานข้อมูลเดียวกันไป Subdomain หรือ Staging site

1. สร้าง Staging Subdomain

สามารถสร้าง Subdomain ผ่านผู้ให้บริการโฮสติ้ง

• ล็อกอินบัญชีโฮสติ้ง ไปที่ cPanel และเลือก Subdomain
• หน้าถัดไป สร้าง Subdomain และตั้งชื่อ Staging หากไม่รู้วิธีสร้าง Subdomain ต้องหาเอกสารช่วยเหลือจากโฮสติ้ง

คู่มือจาก Bluehost – How to Create a Subdomain?
และจาก Kinsta – How Do I Add a Domain to a Site?

2. ดาวน์โหลดไฟล์และฐานข้อมูลจาก Live Site

เว็บไซต์ WordPress ประกอบด้วยไฟล์และฐานข้อมูล คุณต้องดาวน์โหลดทั้งคู่ วัตถุประสงค์คืออัปโหลดไป Subdomain เพื่อให้ Replicate เว็บไซต์และทำหน้าที่เป็น WordPress Staging Environment

i. ดาวน์โหลดไฟล์:

• ติดตั้งและเปิดใช้งานซอฟต์แวร์ FTP เช่น FileZilla หรือ CyberDuck ซอฟต์แวร์ช่วยเข้าถึงไฟล์ WordPress และดาวน์โหลดลงคอมพิวเตอร์
• หลังติดตั้งบนคอมพิวเตอร์ เปิดซอฟต์แวร์ จะขอ Hostname, Username, และ Password เพื่อเชื่อมต่อเว็บไซต์และดึงไฟล์ WordPress
• หากไม่มีข้อมูลประจำตัว ติดต่อโฮสติ้ง ขอข้อมูลประจำตัว

• เมื่อเชื่อมต่อสำเร็จ คุณจะพบไฟล์ WordPress ในส่วน Remote site
• ในส่วน Remote site หาโฟลเดอร์ public_html คลิกขวาโฟลเดอร์ และเลือก Download ไฟล์ WordPress จะดาวน์โหลดลงคอมพิวเตอร์

ii. ดาวน์โหลดฐานข้อมูล:

• ล็อกอินบัญชีโฮสติ้ง ไปที่ cPanel และเลือก phpMyAdmin
• เลือกตัวเลือก Export ภายใต้ Export Method เลือก Quick แล้วกด Go

ฐานข้อมูล WordPress จะดาวน์โหลดลงคอมพิวเตอร์

3. อัปโหลดไฟล์และฐานข้อมูลไป Subdomain

ตอนนี้มีไฟล์และฐานข้อมูลเก็บอยู่บนคอมพิวเตอร์ ต้องอัปโหลดไป Subdomain – Staging

Subdomain ตามที่กล่าว จะทำหน้าที่เป็น Staging site ที่ทดสอบและแก้ไขได้

• เปิดซอฟต์แวร์ FTP ตรวจสอบว่าเชื่อมต่อกับเว็บไซต์แล้ว ตามที่แสดงก่อนหน้า ด้านขวา มีส่วน Remote site แสดงไฟล์จากเว็บไซต์ ด้านซ้าย มีส่วน Local site แสดงไฟล์เก็บบนคอมพิวเตอร์
• Custom domain (Staging) อยู่ในส่วน Remote site และไฟล์/ฐานข้อมูลที่ดาวน์โหลด อยู่ในส่วน Local site
• สิ่งที่ต้องทำคือ อัปโหลดไฟล์และฐานข้อมูลไปโฟลเดอร์ Subdomain

i. อัปโหลดไฟล์ (Uploading the Files)

• เก็บไฟล์และฐานข้อมูลไว้ในโฟลเดอร์เดียวบนคอมพิวเตอร์ เราตั้งชื่อโฟลเดอร์ว่า Live site files
• จากนั้น เลือกโฟลเดอร์ Subdomain – Staging
• ต่อไป ไปที่ส่วน Local site คลิกขวาโฟลเดอร์ Live site files เลือก Upload จะอัปโหลดโฟลเดอร์ไป Staging (Subdomain)

• URL ของ Staging site ใหม่ หาได้ที่บัญชีโฮสติ้ง ล็อกอิน ไป cPanel เลือก Domain > Subdomains

ii. อัปโหลดฐานข้อมูล (Uploading the Database)

เพื่ออัปโหลดฐานข้อมูล ต้องสร้างฐานข้อมูลสำหรับ Subdomain – Staging ก่อน

• ล็อกอินบัญชีโฮสติ้ง ไป cPanel ไปที่ Databases เลือก MySQL Databases
• เขียนชื่อฐานข้อมูลในส่วน Create New Database แล้วกด Create Database

• ตอนนี้สร้าง User ใหม่เพื่อใช้ฐานข้อมูล หน้าที่สร้างฐานข้อมูล เลื่อนลง จะพบส่วนสร้าง MySQL user

• เมื่อฐานข้อมูลและ Username พร้อม ต้องแน่ใจว่า ฐานข้อมูลใหม่เชื่อมต่อกับ Subdomain เปิดซอฟต์แวร์ FTP ที่ Remote site ไป public_html > Staging ภายในโฟลเดอร์ Staging จะพบ wp-config file คลิกขวาเลือก Edit

• ไฟล์จะมีข้อมูลฐานข้อมูลเก่า (ชื่อฐานข้อมูล, username, password) แทนที่ด้วยฐานข้อมูลที่เพิ่งสร้าง

• ต่อมา อัปโหลดฐานข้อมูลที่ดาวน์โหลดในขั้นตอน 2 ไปฐานข้อมูลใหม่
• กลับไป cPanel เลือก phpMyAdmin ควรเห็นฐานข้อมูลใหม่ เลือกแล้วไปส่วน Import
• อัปโหลดฐานข้อมูลจากคอมพิวเตอร์ และพร้อมใช้งาน

• เหมือนที่กล่าว Link ของ Staging site ใหม่ หาได้ที่บัญชีโฮสติ้ง ล็อกอิน ไป cPanel เลือก Domain > Subdomains

การ Merge Staging Site กับ Live WordPress Site

หลังแก้ไข Staging environment ใหม่ ไม่มีวิธีง่าย Merge Staging site กับ Live site ต้อง Replicate การเปลี่ยนแปลงบน Live site ด้วยตนเอง

แค่นี้ เรื่องราวการสร้าง WordPress Staging environment จบแล้ว

Created a WordPress staging site for the first time with the help of this guide by MalCare.

ข้อความสุดท้าย

แม้มีหลายวิธี Stage เว็บไซต์ การใช้ปลั๊กอินเป็นวิธีง่ายและคุ้มค่าที่สุด ไม่เหมือนวิธี Manual มีความเสี่ยงทำให้เว็บเสีย หากใช้ปลั๊กอินอย่าง BlogVault ในการ Stage

ลอง BlogVault Staging ตอนนี้!