← ผลงานทั้งหมด CASE STUDY

Thai Polymer — เว็บสินค้าอุตสาหกรรม

เว็บไซต์ไทยโพลิเมอร์ ซัพพลาย ย้ายจาก MakeWebEasy มา WordPress พร้อมแคตตาล็อกสินค้าอุตสาหกรรม 165 รายการ ระบบสาขา กิจกรรม และ Knowledge Center

เว็บไซต์ไทยโพลิเมอร์ ซัพพลาย บนโน้ตบุ๊กและมือถือ

ไทยโพลิเมอร์ ซัพพลาย ขายสินค้าให้โรงงานมากว่า 40 ปี มีสาขา 13 แห่งทั่วประเทศ สินค้ามีตั้งแต่พลาสติกวิศวกรรม สายพานลำเลียง กล้อง Machine Vision เครื่องพิมพ์วันผลิต ไปจนถึงปั๊ม ซีล และฉนวนกันความร้อน รวมแล้ว 8 กลุ่ม หลายร้อยรุ่น จากแบรนด์ต่างประเทศกว่า 20 แบรนด์

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

หน้าแรกเว็บไซต์ไทยโพลิเมอร์ ซัพพลาย บนจอ desktop
หน้าแรกบอกตั้งแต่ส่วนบนว่าบริษัททำอะไร มีกี่สาขา และมีทีม Technical Support

สินค้าเป็นร้อยรุ่น ต้องเจอในไม่กี่คลิก

คนที่เข้าเว็บนี้ส่วนใหญ่คือฝ่ายจัดซื้อกับวิศวกรโรงงาน เขามักรู้อยู่แล้วว่าต้องการของประเภทไหน แค่ต้องการเห็นรุ่น สเปก และแบรนด์ให้เร็วที่สุด เมนูสินค้าจึงแบ่งเป็น 8 กลุ่มแบบมีเลขกำกับ 01–08 เปิดเมนูเดียวเห็นทุกกลุ่มพร้อมหน้าย่อยในกลุ่มนั้น ไม่ต้องกดเข้าออกหลายชั้น

ข้างในแยกเป็น 41 หมวดย่อย และ 27 แบรนด์ เช่น Hitachi, Wilo, Teadit, Ensinger, Röchling, Forbo และ TOYOX หน้าสินค้าทุกรายการใช้เทมเพลตเดียวกัน มีแกลเลอรีรูป แบรนด์ รุ่นหรือรหัส รายละเอียดสเปก และสินค้าที่เกี่ยวข้องในกลุ่มเดียวกันต่อท้าย เผื่อรุ่นแรกที่เปิดยังไม่ใช่ตัวที่ต้องการ

ย้ายสินค้า 165 รายการ โดยไม่ต้องก๊อปทีละหน้า

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

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

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

บางคนเริ่มจากอุตสาหกรรม ไม่ใช่ชื่อสินค้า

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

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

ข้อมูลที่เปลี่ยนบ่อย ลูกค้าแก้เองได้

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

  • สาขา 15 จุดใน 6 ภาค รวมสำนักงานใหญ่และโรงงาน แต่ละสาขามีที่อยู่ เบอร์โทร อีเมล และลิงก์ Google Maps หน้าติดต่อเราดึงไปแสดงและจัดกลุ่มตามภาคให้เอง
  • กิจกรรมและงานแสดงสินค้า 11 รายการ แบ่ง 5 ประเภท เช่น ProPak Asia และ TDIA Roadshow มีปฏิทินกิจกรรมและหน้ารายละเอียดของแต่ละงาน
  • Knowledge Center บทความความรู้ 20 เรื่องใน 4 หัวข้อ มีช่องค้นหา ตัวกรองตามหัวข้อ และเวลาอ่านของแต่ละบทความ
  • แคตตาล็อก Product Guide และ Company Profile เป็น PDF ดาวน์โหลดได้จากหน้าแรก
หน้ารายชื่อสาขาไทยโพลิเมอร์ ซัพพลาย แยกตามภาค
สาขาทั้งหมดดึงจากข้อมูลชุดเดียว เพิ่มหรือแก้สาขาในหลังบ้าน หน้าเว็บเปลี่ยนตามทันที

ก่อนย้ายขึ้นโดเมนจริง

เว็บสร้างและทดสอบบนเซิร์ฟเวอร์ staging ก่อน แล้วค่อยย้ายขึ้น thaipolymer.co.th ช่วงย้ายเป็นช่วงที่พลาดกันบ่อยที่สุด เพราะมีค่าที่ตั้งไว้ตอนทดสอบติดมาด้วย หลังย้ายเสร็จผมเลยไล่ตรวจทุกหน้า 236 URL รอบนี้เจอและแก้ไปหลายจุด

  • ค่า “ห้ามเครื่องมือค้นหาเก็บข้อมูล” ที่เปิดไว้ตอนทดสอบยังติดมา ถ้าไม่เจอ Google จะไม่เก็บหน้าไหนของเว็บเลย
  • ข้อมูลโครงสร้าง (schema) บางส่วนยังชี้กลับไปที่โดเมน staging
  • ลิงก์เสียที่พาไปหน้า 404 และสินค้าที่ชื่อซ้ำกัน 28 รายการ เปลี่ยนชื่อให้ระบุรุ่นชัดเจน
  • เขียน title และ meta description ให้หน้าหลักและบทความทุกเรื่องด้วย Rank Math และตั้งข้อมูลบริษัทให้ Google รู้จักในฐานะองค์กร

หน้าตาบนมือถือ

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

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

โหลดเร็วแค่ไหน

หน้าแรกมีรูปสินค้า โลโก้แบรนด์ และไอคอนรวมแล้วเกือบ 50 รูป ตอนย้ายขึ้นโดเมนจริงใหม่ๆ คะแนน Performance บนมือถืออยู่ที่ 79 ต้นเหตุหลักคือไฟล์ CSS และ JavaScript ที่ต้องโหลดก่อนหน้าจะขึ้น ฟอนต์ที่ดึงจาก Google Fonts และรูปหลักของหน้าแรกที่เบราว์เซอร์เจอช้า

ทางแก้คือรวมและย่อไฟล์ CSS ให้เบราว์เซอร์โหลดก่อนแค่ที่จำเป็น เลื่อน JavaScript ไปโหลดทีหลัง ย้ายฟอนต์ Anuphan มาโหลดจากเซิร์ฟเวอร์ของเว็บเอง และสั่งให้รูปหลักกับไฟล์ฟอนต์โหลดก่อนอย่างอื่น ผลทดสอบหน้าแรกด้วย PageSpeed Insights เมื่อ 24 ต.ค. 2569

มือถือDesktop
Performance9698
Accessibility100100
Best Practices100100
SEO100100
LCP2.4 วินาที (เดิม 4.4)0.5 วินาที
Total Blocking Time0 ms20 ms
CLS0.040.001
ผล PageSpeed Insights หน้าแรกไทยโพลิเมอร์ ซัพพลาย บนมือถือ คะแนนประสิทธิภาพ 96
คะแนน Performance บนมือถือขึ้นจาก 79 เป็น 96 โดยไม่ได้ตัดรูปหรือเนื้อหาออกจากหน้าแรก

LCP บนมือถือลงมาอยู่ที่ 2.4 วินาที ผ่านเกณฑ์สีเขียวของ Google (ไม่เกิน 2.5 วินาที) แล้ว ตัวที่ยังเป็นสีส้มคือ Speed Index 3.7 วินาที เพราะหน้าแรกยาวและมีรูปหลายชุดที่ต้องทยอยแสดง ส่วนหมวดใหม่ “การท่องเว็บด้วย Agent” ที่วัดว่า AI เข้าใจและใช้งานหน้าเว็บได้ดีแค่ไหน ผ่านครบ 2/2 ทั้งสองจอ

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

รายละเอียดงาน

ประเภทเว็บเว็บไซต์บริษัท และแคตตาล็อกสินค้าอุตสาหกรรม (B2B)
เครื่องมือWordPress, Elementor Pro, ACF, Rank Math, Custom PHP / JavaScript
ระยะเวลาเริ่มวางโครงเดือนกรกฎาคม 2569 ย้ายขึ้นโดเมนจริงเดือนตุลาคม 2569
สินค้า165 รายการ ใน 8 กลุ่ม 41 หมวดย่อย 27 แบรนด์ ย้ายมาจากเว็บเดิมด้วยสคริปต์
หน้าอื่นๆหน้าอุตสาหกรรม 7 หน้า บทความความรู้ 20 เรื่อง กิจกรรม 11 รายการ สาขา 15 จุด
เว็บไซต์thaipolymer.co.th

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

อยากได้เว็บไซต์แบบนี้ให้ธุรกิจของคุณ?

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

@ehowme จ้างงานผ่าน Fastwork เบอร์โทร Facebook