จะเพิ่ม Expires Headers ใน WordPress ได้อย่างไร? (2 วิธี)
เผยแพร่แล้ว: 2022-04-08คุณกำลังมองหา วิธีเพิ่มส่วนหัว Expires ใน WordPress หรือไม่? จากนั้น คุณต้องเรียกใช้ไซต์ WordPress ของคุณผ่านเครื่องมือทดสอบความเร็วที่แนะนำให้คุณเพิ่มส่วนหัว Expires
ซึ่งหมายความว่าเว็บไซต์ของคุณมีปัญหากับเวลาในการโหลดที่ไม่ดี และคุณยังไม่ได้ปรับแคชของเบราว์เซอร์ให้เหมาะสม ซึ่งมีจุดประสงค์หลักในการช่วยให้เว็บไซต์ของคุณบอกเบราว์เซอร์ของผู้เยี่ยมชมให้จัดเก็บไฟล์บางไฟล์ในคอมพิวเตอร์ของตนและโหลดไฟล์เหล่านั้นเมื่อใดก็ตามที่ผู้เยี่ยมชมเข้าชมเว็บไซต์อีกครั้ง แทนที่จะดาวน์โหลดไฟล์เดิมจากเซิร์ฟเวอร์อีกครั้งในการเยี่ยมชมแต่ละครั้ง และช่วยเพิ่มความเร็วของเว็บไซต์
ดังนั้น ในบทความนี้ เราจะพยายามครอบคลุมทุกแง่มุมของส่วนหัว Expires เช่น ความหมายเหล่านี้หมายถึงอะไรและจะช่วยเพิ่ม SEO ของคุณได้อย่างไร หลังจากนั้น เราจะอธิบายวิธีที่คุณสามารถเพิ่มลงในเว็บไซต์ของคุณได้อย่างง่ายดายอย่างครอบคลุม
แต่ก่อนอื่น ให้เราเข้าใจว่าส่วนหัว Expires หมายถึงอะไร
ส่วนหัวหมดอายุคืออะไร
ส่วนหัวหมดอายุคือส่วนหัว HTTP ที่มีจุดประสงค์หลักเพื่อบอกเบราว์เซอร์เว็บไซต์ของผู้เยี่ยมชมว่าควรโหลดทรัพยากรจากแคชของเบราว์เซอร์หรือควรโหลดทรัพยากรใหม่จากเว็บเซิร์ฟเวอร์
ด้วยเหตุนี้ จึงช่วยเพิ่มความเร็วเว็บไซต์ของคุณโดยการโหลดองค์ประกอบจากแคชของเบราว์เซอร์ในเครื่อง แทนที่จะดาวน์โหลดจากเซิร์ฟเวอร์
ในการทำให้สิ่งนี้เกิดขึ้น คุณต้องเพิ่ม Expires Headers ในไซต์ WordPress ของคุณ และหลังจากนั้น เว็บเบราว์เซอร์จะเริ่มการแคชของเบราว์เซอร์ในช่วงเวลาหนึ่งที่คุณได้ตั้งค่าไว้แล้วในส่วนหัว Expires
ให้เราเข้าใจด้วยตัวอย่าง สมมติว่าคุณใช้ Expires headers ในไฟล์ JPEG เป็นเวลาหนึ่งเดือน ซึ่งหมายความว่าเบราว์เซอร์ของผู้เยี่ยมชมของคุณจะโหลดทรัพยากรจากการแคชของเบราว์เซอร์ที่เก็บไว้แล้วเป็นเวลาหนึ่งเดือน หลังจากระยะเวลาหนึ่งเดือน เบราว์เซอร์ของผู้เยี่ยมชมจะเริ่มโหลดทรัพยากรเวอร์ชันใหม่กว่าจากเซิร์ฟเวอร์
ในทำนองเดียวกัน คุณเพิ่มส่วนหัวการหมดอายุที่แตกต่างกันสำหรับไฟล์ประเภทต่างๆ และลดคำขอ HTTP จำนวนมาก ซึ่งโดยรวมแล้วช่วยเพิ่มความเร็วเว็บไซต์ของคุณ
คุณจะตรวจสอบส่วนหัวที่หมดอายุบนเว็บไซต์ของคุณได้อย่างไร
มีเครื่องมือออนไลน์มากมาย เช่น ซึ่งคุณสามารถตรวจสอบประสิทธิภาพเว็บไซต์ของคุณและวิเคราะห์ Web Vitals หลักได้ เครื่องมือที่ดีที่สุดในการทดสอบความเร็ว ได้แก่ เครื่องมือตรวจสอบความเร็วเว็บไซต์โดย Bitcatcha และเครื่องมือยอดนิยมอีกอย่างหนึ่งคือ GTmetrix เครื่องมือเหล่านี้ให้ผลลัพธ์ในรูปแบบของเกรด คะแนน และคำเตือนเกี่ยวกับปัญหาบางอย่างที่เว็บไซต์ของคุณอาจเผชิญ
ในทำนองเดียวกัน คุณสามารถตรวจสอบ Expires Headers บนเว็บไซต์ของคุณได้โดยใช้เครื่องมือนี้ และหากพบว่าไม่มี คุณสามารถเพิ่มได้ในภายหลัง
โดยไปที่เว็บไซต์ GTmetrix ก่อน แล้วป้อน URL เว็บไซต์ของคุณดังที่แสดงด้านล่าง

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

ตอนนี้ให้ตรวจสอบ Expires Headers ในไซต์ WordPress คลิกที่แท็บ Waterfall > Headers และดูผลลัพธ์ที่แสดงด้านล่าง:

จะเพิ่ม Expires Headers ใน WordPress ได้อย่างไร?
ตอนนี้ให้เราดูว่าคุณจะเพิ่ม Expires Headers ใน WordPress ได้อย่างไรโดยใช้สองวิธีที่แตกต่างกันนี้ วิธีปลั๊กอินค่อนข้างง่ายและแนะนำเป็นอย่างยิ่งหากคุณเป็นมือใหม่ และแนะนำให้ใช้วิธีการแบบ manual สำหรับผู้ที่มีความเชี่ยวชาญด้านเทคนิคอยู่บ้าง
แต่ถ้าคุณเป็นไคลเอนต์ WPOven คุณไม่ต้องกังวลเกี่ยวกับความเร็วในการโหลดเว็บไซต์ของคุณ และทำตามขั้นตอนพิเศษทั้งหมดเหล่านี้เพื่อเพิ่มความเร็วเว็บไซต์
เพราะที่ WPOven เราขอเสนอโซลูชันเว็บโฮสติ้งที่มีการจัดการเต็มรูปแบบพร้อมเซิร์ฟเวอร์เฉพาะที่เร็วที่สุดที่มีศูนย์ข้อมูล CDN ทั่วโลกและการรักษาความปลอดภัยที่ทันสมัย นั่นหมายความว่าเราจะไม่ทิ้งหินใดๆ ทิ้งไว้เพื่อมอบประสบการณ์ที่รวดเร็วและปลอดภัยที่สุดเท่าที่เคยมีมาให้กับคุณ
A. เพิ่ม Expires Headers ใน WordPress โดยใช้ WordPress Plugins
แม้ว่าจะมีปลั๊กอิน WordPress มากมายซึ่งคุณสามารถเพิ่ม Expires Headers ใน WordPress ได้อย่างง่ายดาย แต่เราจะเลือกอันที่เหมาะสมที่สุดซึ่งฟรีและมีส่วนต่อประสานผู้ใช้ที่ดีกว่า
Hummingbird และ WP Super Cache เป็นปลั๊กอินยอดนิยมที่มีการดาวน์โหลดจำนวนมากในที่เก็บ WordPress
1. นกฮัมมิ่งเบิร์ด

Humming Bird เป็นปลั๊กอินเพิ่มประสิทธิภาพความเร็วเว็บไซต์ที่ใช้งานได้ฟรีจากที่เก็บ WordPress และมีตัวเลือกการแคชที่ดีอื่น ๆ อีกมากมาย
ซึ่งมีคุณสมบัติบางอย่างที่นอกกรอบเช่น:
- สแกนเว็บไซต์ของคุณอย่างสมบูรณ์และชี้ให้เห็นข้อผิดพลาดที่ทำให้ประสิทธิภาพของเว็บไซต์ช้าลง
- โซลูชันแคชที่สมบูรณ์เพื่อโหลดหน้าเว็บได้เร็วขึ้นโดยไม่มีการประนีประนอม Gravatar และเครื่องมือแคชของเบราว์เซอร์
- จัดทำรายงานประสิทธิภาพและเคล็ดลับในการเพิ่มประสิทธิภาพความเร็วเว็บไซต์ของคุณ
- เพิ่มความเร็วเว็บไซต์ของคุณจึงเพิ่มอัตราการแปลงของคุณ
- เพิ่ม SEO และปรับปรุงอันดับ
- HTML ความเร็วเทอร์โบ, JavaScript และการถ่ายโอน CSS สไตล์ชีต
- ช่วยในการเพิ่มประสิทธิภาพ เช่น CSS, ไฟล์ฟอนต์ Googe, รวม JavaScript ฯลฯ และอื่นๆ อีกมากมาย
ให้เราดูว่าคุณสามารถเพิ่มประสิทธิภาพเว็บไซต์ของคุณได้อย่างไรโดยการเพิ่ม Expires Headers ใน WordPress โดยใช้ Hummingbird Plugin
ขั้นแรก คุณต้องติดตั้งปลั๊กอิน Hummingbird บนเว็บไซต์ของคุณ และไปที่ แดชบอร์ดเว็บไซต์ WordPress > Plugins > Add new

พิมพ์ “ Hummingbird ” ในแถบค้นหา เมื่อเสร็จแล้วปลั๊กอินจะปรากฏดังที่แสดงด้านบน คลิกที่ปุ่มติดตั้งทันทีโดยคลิกที่ปุ่ม เปิดใช้งาน หลังจากเปิดใช้งานปลั๊กอินสำเร็จแล้ว คุณจะพบปลั๊กอินนี้อยู่ในเมนูแดชบอร์ดของ WordPress คลิกที่มันและเลือกแคชดังที่แสดงด้านล่าง:

เมื่อคุณไปถึงหน้าแคชของปลั๊กอิน คุณจะเห็น 6 ตัวเลือก คุณต้องคลิกที่ Browser Caching และดำเนินการต่อไป

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

ตอนนี้ในหน้าการกำหนดค่าการแคชเบราว์เซอร์ คุณจะถูกขอให้เลือกประเภทเซิร์ฟเวอร์ เลือกประเภทเซิร์ฟเวอร์ Apache, NGNIX, IIS หรือ OpenLiteSpeed โดยคลิกที่ปุ่ม Next

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

เพิ่มรหัสไปยัง HTTP หรือภายในส่วนเซิร์ฟเวอร์ในไฟล์ เมื่อเสร็จแล้ว ให้โหลดซ้ำและรีสตาร์ท NGINX
ปลั๊กอินอื่นที่คุณสามารถลองได้คือจรวด WP ให้เราตรวจสอบว่าสามารถช่วยคุณเพิ่มส่วนหัวที่หมดอายุใน WordPress ได้อย่างไร
2. จรวด WP

หากคุณคิดว่านกฮัมมิงเบิร์ดไม่ง่าย คุณสามารถลองใช้ปลั๊กอินแคชยอดนิยมตัวอื่น WP-rocket ทันทีที่คุณติดตั้งและเปิดใช้งานปลั๊กอินนี้ ปลั๊กอินจะเริ่มแคชของเบราว์เซอร์โดยอัตโนมัติโดยไม่ต้องทำตามขั้นตอนเพิ่มเติมและกำหนดการตั้งค่า
แต่หากต้องการใช้ปลั๊กอินนี้ คุณต้องซื้อแผนบริการรายปีตั้งแต่ 49 ถึง 249 ดอลลาร์ต่อปี อย่างไรก็ตาม หากงบประมาณของคุณไม่อนุญาตให้คุณใช้ปลั๊กอินนี้ คุณสามารถเลือกตัวเลือกอื่น (นกฮัมมิงเบิร์ด) ที่เราได้กล่าวไปแล้วได้เสมอ และใช้งานได้ฟรี
B. เพิ่ม Expires Headers ใน WordPress ด้วยตนเอง
หากคุณมีความเชี่ยวชาญด้านเทคนิคและความรู้ในการจัดการและจัดการไฟล์ WordPress คุณสามารถใช้วิธีการแบบแมนนวลได้เสมอ วิธีการเพิ่ม Expires Headers ใน WordPress ส่วนใหญ่เกี่ยวข้องกับการเพิ่มโค้ดบางโค้ดลงในไฟล์ .htaccess ของคุณ
เนื่องจากเราได้กล่าวไปแล้วว่าวิธีนี้เหมาะที่สุดสำหรับผู้ใช้ที่มีความเชี่ยวชาญในไฟล์ WordPress เท่านั้น ผู้เริ่มต้นต้องงดใช้วิธีนี้เพราะในกรณีที่โค้ดมีข้อผิดพลาดเกิดขึ้น เว็บไซต์ทั้งหมดอาจเสียหายหรือเสียหายได้
ดังนั้นจึงขอแนะนำอย่างยิ่งให้คุณทำการสำรองข้อมูล WordPress ให้สมบูรณ์ก่อนที่จะดำเนินการตามขั้นตอนต่อไป คุณยังสามารถอ่านบทความโดยละเอียดเกี่ยวกับ “วิธีสำรองข้อมูลไซต์ WordPress ใน 5 นาที” สำหรับคำแนะนำของคุณ
แต่ก่อนที่จะดำเนินการตามขั้นตอนหลัก สิ่งแรกที่คุณต้องทำคือกำหนดเซิร์ฟเวอร์เว็บไซต์ของคุณ ว่าเป็น Apache หรือ NGINX?
ในการทำเช่นนั้น วิธีหนึ่งที่ง่ายและสะดวกที่สุดที่คุณสามารถลองได้คือ เปิดเว็บไซต์ของคุณในเบราว์เซอร์ใดก็ได้ > คลิกขวาที่หน้า > เลือกตรวจสอบองค์ประกอบ ตัวเลือก

หลังจากนั้นให้กดที่ Network Tab ดังรูปด้านล่าง ในบางกรณี คุณจะต้องโหลดหน้าซ้ำเพื่อโหลดผลลัพธ์

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

ตอนนี้ คุณสามารถระบุได้สำเร็จแล้วว่าเว็บเซิร์ฟเวอร์ใดที่เว็บไซต์ของคุณใช้อยู่ ให้เราดูว่าคุณสามารถเพิ่มส่วนหัวหมดอายุใน WordPress บนเว็บเซิร์ฟเวอร์ทั้งสองประเภทได้อย่างไร
1. เพิ่ม Expires Headers ใน WordPress (Apache)
หากไซต์ WordPress ของคุณอยู่บนเซิร์ฟเวอร์ Apache คุณต้องเพิ่มส่วนหัวหมดอายุในไฟล์ WordPress .htaccess ซึ่งคุณจะพบในโฟลเดอร์รูทของเว็บเซิร์ฟเวอร์ของคุณ ให้เราตรวจสอบขั้นตอนที่คุณต้องปฏิบัติตาม:
ขั้นตอนที่ 1: ในการเข้าถึงและแก้ไขไฟล์นี้ คุณต้องใช้ cPanel ที่ผู้ให้บริการโฮสต์เว็บของคุณให้มา หรือเชื่อมต่อบัญชีโฮสติ้งของคุณกับไคลเอนต์ FTP (FileZilla)
ขั้นตอนที่ 2: เมื่อคุณสามารถเข้าถึงโฟลเดอร์รูทของคุณได้ ให้ค้นหาไฟล์ . htaccess
ขั้นตอนที่ 3: ดาวน์โหลดสำเนาสำรองของไฟล์ .htaccess เพื่อที่ว่าหากมีสิ่งใดเกิดขึ้น คุณสามารถอัปโหลดไฟล์สำรองอีกครั้งและแก้ไขปัญหาโดยเร็วที่สุด
ขั้นตอนที่ 4: ตอนนี้ คุณต้องเพิ่ม Expires Headers ในการแคชเบราว์เซอร์ของคุณ
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
## EXPIRES HEADER CACHING ## < IfModule mod_expires . c > ExpiresActive On ExpiresByType image / jpg "access 1 year" ExpiresByType image / jpeg "access 1 year" ExpiresByType image / gif "access 1 year" ExpiresByType image / png "access 1 year" ExpiresByType image / svg "access 1 year" ExpiresByType text / css "access 1 month" ExpiresByType application / pdf "access 1 month" ExpiresByType application / javascript "access 1 month" ExpiresByType application / x - javascript "access 1 month" ExpiresByType application / x - shockwave - flash "access 1 month" ExpiresByType image / x - icon "access 1 year" ExpiresDefault "access 4 days" < / IfModule > ## EXPIRES HEADER CACHING ## |
ค่าที่กล่าวถึงในข้อมูลโค้ดจะใช้ได้กับเว็บไซต์ส่วนใหญ่ แต่คุณสามารถเปลี่ยนแปลงหรือปรับเปลี่ยนค่าเวลาสำหรับไฟล์ประเภทต่างๆ ได้

2. เพิ่มส่วนหัวหมดอายุใน WordPress (NGINX)
หากเว็บไซต์ของคุณใช้เซิร์ฟเวอร์ NGINX คุณต้องเพิ่มการเข้าถึงไฟล์การกำหนดค่าเซิร์ฟเวอร์และเพิ่มส่วนหัวหมดอายุลงไป แต่วิธีเข้าถึงและแก้ไขไฟล์เหล่านี้อาจแตกต่างกันไปในแต่ละโฮสต์ ดังนั้นคุณควรติดต่อผู้ให้บริการโฮสต์ของคุณเพื่อขอความช่วยเหลือ
หลังจากนั้น คุณจะต้องเพิ่มโค้ด Expires Headers ต่อไปนี้ในไฟล์การกำหนดค่าเว็บเซิร์ฟเวอร์ของคุณ:
1 2 3 4 5 6 7 |
location ~ * \ . ( jpg | jpeg | gif | png | svg ) $ { expires 365d ; } location ~ * \ . ( pdf | css | html | js | swf ) $ { expires 4d ; } |
หมายเหตุ: คุณสามารถเปลี่ยนค่าการหมดอายุได้ตามความต้องการหรือประเภทไฟล์ของคุณ คุณต้องสังเกตว่ารูปภาพมีเวลาหมดอายุนานกว่า เนื่องจากรูปภาพเหล่านั้นจะคงสภาพเดิมเป็นระยะเวลานานกว่า HTML, CSS, JS และไฟล์ประเภทอื่นๆ ทั่วไป
3. เพิ่ม Expires Headers ใน WordPress (ระบบ CDN)
หากคุณกำลังใช้ระบบ CDN เช่น Cloudflare เพื่อส่งเนื้อหา คุณจะต้องใช้วันหมดอายุที่แตกต่างกันสำหรับทรัพยากรของคุณ แต่ทางเลือกที่ดีที่สุดที่จะหลีกเลี่ยงสิ่งนี้คือการทำให้ ETags ของคุณไม่เสถียรจากเซิร์ฟเวอร์ CDN
และในการทำเช่นนี้ คุณต้องเพิ่มข้อมูลโค้ดต่อไปนี้ในไฟล์ .htaccess ของคุณ
1 2 3 4 5 |
# Disable ETags < IfModule mod_headers . c > Header unset ETag < / IfModule > FileETag None |
สรุป
เพื่อสรุปบทความทั้งหมด การเพิ่ม Expires Headers ใน WordPress ช่วยให้คุณควบคุมพฤติกรรมการแคชของเบราว์เซอร์ได้ในระดับหนึ่ง และช่วยเพิ่มความเร็วในการโหลดเว็บไซต์ของคุณโดยรวม แม้ว่าวิธีนี้จะไม่ทำให้ความเร็วเว็บไซต์ของคุณเปลี่ยนแปลงไปอย่างเห็นได้ชัด แต่เทคนิคนี้แสดงให้เห็นถึงการปรับปรุงประสบการณ์ผู้ใช้ที่ยอดเยี่ยม
นอกจากนั้น ผู้ใช้ทุกคนจำเป็นต้องรู้วิธีเพิ่มส่วนหัว Expires ในเว็บไซต์ WordPress อย่างถูกต้อง เพราะหากคุณทำผิด ผลที่ตามมาอาจเป็นอันตรายต่อเว็บไซต์ของคุณ และแทนที่จะเพิ่มความเร็วของเว็บไซต์ เว็บไซต์ของคุณจะช้าลง
ยิ่งไปกว่านั้น หากคุณมีข้อเสนอแนะหรือจุดที่มีค่าที่จะเพิ่มในโพสต์นี้โดยที่เรายังไม่ได้กล่าวถึง โปรดแจ้งให้เราทราบในส่วนความคิดเห็นด้านล่าง:
คำถามที่พบบ่อย
คุณจะแก้ไขส่วนหัวที่หมดอายุได้อย่างไร
คุณแก้ไขส่วนหัวการหมดอายุได้โดยใช้สามวิธี:
1. การใช้ปลั๊กอิน Caching WordPress เช่น Hummingbird หรือ WProcket
2. โดยการเข้าถึงไฟล์ .Htaccess ของคุณและเพิ่มข้อมูลโค้ดลงไป
ส่วนหัวหมดอายุใน WordPress คืออะไร?
ส่วนหัวหมดอายุคือส่วนหัว HTTP ที่มีจุดประสงค์หลักเพื่อบอกเบราว์เซอร์เว็บไซต์ของผู้เยี่ยมชมว่าควรโหลดทรัพยากรจากแคชของเบราว์เซอร์หรือควรโหลดทรัพยากรใหม่จากเว็บเซิร์ฟเวอร์ ด้วยเหตุนี้ จึงช่วยเพิ่มความเร็วเว็บไซต์ของคุณโดยการโหลดองค์ประกอบจากแคชของเบราว์เซอร์ในเครื่อง แทนที่จะดาวน์โหลดจากเซิร์ฟเวอร์
ฉันจะเพิ่มส่วนหัวที่หมดอายุใน cPanel ได้อย่างไร
ในการเพิ่มส่วนหัวที่หมดอายุใน cPanel ให้ทำตามขั้นตอนง่าย ๆ เหล่านี้:
1. เข้าสู่ระบบ cPanel ของเว็บไซต์ของคุณ
2. ไปที่ส่วนไฟล์และเลือกไอคอนตัวจัดการไฟล์
3. ไปที่โฟลเดอร์ public_html แล้วเปิดขึ้นมา
4. นำทางผ่านไฟล์ .htaccess และดาวน์โหลดสำเนาสำรองก่อน
5. คลิกขวาที่ไฟล์ .htaccess เพื่อดูตัวเลือก
6. คลิกที่ตัวเลือก แก้ไข เพิ่มข้อมูลโค้ดและบันทึก