โลโก้
  • ผลิตภัณฑ์
    • รูปภาพเมนู
      เกี่ยวกับเรา
    • รูปภาพเมนู
      ทัวร์ชมสินค้า
    • รูปภาพเมนู
      ตัวอย่าง
    • รูปภาพเมนู
      ภาษา
    • รูปภาพเมนู
      กรณีการใช้งาน
      • งานพิมพ์สถาปัตยกรรม
      • ผู้ค้นหารัง
      • เบรย์ตันลอว์
      • สาระสําคัญของฟลอริดา การประกันภัย
      • การเจริญพันธุ์ของเนวาดา สถาบัน
  • โซลูชั่น
    • รูปภาพเมนู
      จาวาสคริปต์
    • รูปภาพเมนู
      Shopify
    • รูปภาพเมนู
      เว็บโฟลว์
    • รูปภาพเมนู
      BigCommerce
    • รูปภาพเมนู
      เวิร์ดเพรส
    • รูปภาพเมนู
      พื้นที่สี่เหลี่ยม
    • รูปภาพเมนู
      ดูการบูรณาการทั้งหมด
  • คำแนะนำ
    • รูปภาพเมนู
      แปลเว็บไซต์
    • รูปภาพเมนู
      ข้ามพรมแดนได้อย่างมีประสิทธิภาพ
    • รูปภาพเมนู
      ปลดล็อคตลาดโลก
    • รูปภาพเมนู
      แปลด้วยความมั่นใจ
    • รูปภาพเมนู
      พลังแห่งภาษา
    • รูปภาพเมนู
      เอกสารประกอบ API
    • รูปภาพเมนู
      เครื่องมือแปลอันทรงพลัง
    • รูปภาพเมนู
      ไว้วางใจการแปลของเรา
  • การกำหนดราคา
  • สนับสนุน
    • รูปภาพเมนู
      ศูนย์ช่วยเหลือ
    • รูปภาพเมนู
      คำถามที่ถามบ่อย
    • รูปภาพเมนู
      บล็อก
เริ่ม
  • ผลิตภัณฑ์
      รูปภาพเมนู
      เกี่ยวกับเรา
      เกี่ยวกับ ConveyThis: ค้นพบโซลูชันการแปลของเรา
      รูปภาพเมนู
      ทัวร์ชมสินค้า
      ทัวร์ ConveyThis: สำรวจคุณลักษณะการแปลของเรา
      รูปภาพเมนู
      ตัวอย่าง
      ConveyThis กรณีผู้ใช้ การแปลเว็บไซต์ใดๆ เป็นเรื่องง่ายอย่างเหลือเชื่อ
      รูปภาพเมนู
      ภาษาที่มีให้บริการ
      ภาษาที่รองรับโดย ConveyThis สื่อสารได้ทั่วโลก
      รูปภาพเมนู
      กรณีการใช้งาน
      • งานพิมพ์สถาปัตยกรรม
      • ผู้ค้นหารัง
      • เบรย์ตันลอว์
      • สาระสำคัญของการประกันภัยฟลอริดา
      • สถาบันการเจริญพันธุ์เนวาดา
  • โซลูชั่น
      รูปภาพเมนู
      จาวาสคริปต์
      การรวม ConveyThis แปลเข้ากับเว็บไซต์ใดๆ เป็นเรื่องง่ายอย่างเหลือเชื่อ และเฟรมเวิร์ก JavaScript ก็ไม่มีข้อยกเว้น
      รูปภาพเมนู
      เว็บโฟลว์
      การรวมปลั๊กอิน Webflow ConveyThis เข้ากับไซต์ของคุณเป็นเรื่องง่ายและรวดเร็ว และ WebFlow ก็ไม่มีข้อยกเว้น
      รูปภาพเมนู
      พื้นที่สี่เหลี่ยม
      การรวม ConveyThis แปลเข้ากับเว็บไซต์ใดๆ เป็นเรื่องง่ายอย่างเหลือเชื่อ และเฟรมเวิร์ก SquareSpace ก็ไม่มีข้อยกเว้น
      รูปภาพเมนู
      Shopify
      การรวม ConveyThis เข้ากับไซต์ของคุณทำได้รวดเร็วและง่ายดาย และ Shopify ก็ไม่มีข้อยกเว้น
      รูปภาพเมนู
      BigCommerce
      การรวม ConveyThis แปลเข้ากับเว็บไซต์ใดๆ เป็นเรื่องง่ายอย่างเหลือเชื่อ และกรอบการทำงาน BigCommerce ก็ไม่มีข้อยกเว้น
      รูปภาพเมนู
      เวิร์ดเพรส
      การรวมปลั๊กอิน WordPress ConveyThis เข้ากับไซต์ของคุณเป็นเรื่องง่ายและรวดเร็ว และ WordPress ก็ไม่มีข้อยกเว้น
      ไม่เห็นการรวมของคุณใช่ไหม? รูปภาพเมนู
      ConveyThis เข้ากันได้กับระบบรวม CMS มากกว่า 20 ระบบ
      ดูการบูรณาการทั้งหมด
  • คำแนะนำ
      รูปภาพเมนู
      แปลเว็บไซต์
      ปรับแต่งเว็บไซต์ของคุณให้เหมาะกับผู้ชมทั่วโลก
      รูปภาพเมนู
      ข้ามพรมแดนได้อย่างมีประสิทธิภาพ
      การค้นพบโซลูชันการแปลของคุณ
      รูปภาพเมนู
      ปลดล็อคตลาดโลก
      ทำความเข้าใจความแตกต่างระหว่างการแปลและการปรับท้องถิ่น
      รูปภาพเมนู
      แปลด้วยความมั่นใจ
      กลยุทธ์ในการดึงดูดผู้ชมต่างประเทศด้วยเนื้อหาที่น่าสนใจ
      รูปภาพเมนู
      พลังแห่งภาษา
      ConveyThis ช่วยได้อย่างไร
      รูปภาพเมนู
      เอกสารประกอบ API
      คู่มือที่ครอบคลุมสำหรับนักพัฒนา
      รูปภาพเมนู
      เครื่องมือแปลอันทรงพลัง
      กุญแจสู่ความสำเร็จในการโลคัลไลเซชันด้วย ConveyThis
      รูปภาพเมนู
      ไว้วางใจการแปลของเรา
      แนวทางเชิงกลยุทธ์ในการขยายแบรนด์
  • การกำหนดราคา
  • สนับสนุน
      รูปภาพเมนู
      ศูนย์ช่วยเหลือ
      เรายินดีที่จะช่วยให้คุณได้รับคำตอบสำหรับคำถามทั้งหมดของคุณ
      รูปภาพเมนู
      คำถามที่ถามบ่อย
      รับคำตอบสำหรับคำถาม ConveyThis ของคุณ
      รูปภาพเมนู
      บล็อก
      เคล็ดลับการแปลเว็บไซต์ล่าสุดและข่าวสาร ConveyThis
เข้าสู่ระบบ
ลงทะเบียน

เหตุใดเราจึงสร้างเว็บไซต์ใหม่ตั้งแต่ต้น: วิวัฒนาการที่จำเป็น

ทำให้เว็บไซต์ของคุณเป็นหลายภาษาใน 5 นาที
เริ่ม
เรียนรู้เพิ่มเติม
✔ ไม่มีรายละเอียดบัตร ✔ ไม่มีข้อผูกมัด
  • โลโก้(1)
  • โลโก้(2)
  • โลโก้(3)
  • โลโก้(4)
  • โลโก้(5)
  • โลโก้(6)
  • โลโก้(7)
  • โลโก้(8)
  • โลโก้(9)
  • โลโก้(11)
  • โลโก้(12)
  • โลโก้(13)
  • โลโก้(14)
  • โลโก้(15)
  • โลโก้(16)
  • โลโก้(17)
  • โลโก้(18)
  • โลโก้(19)
  • โลโก้(20)
  • โลโก้(21)
  • โลโก้(22)
  • โลโก้(23)
  • โลโก้(25)
  • โลโก้(26)
  • โลโก้(27)
  • โลโก้(28)
  • โลโก้(29)
  • โลโก้(30)
  • โลโก้(31)
  • โลโก้(1)
  • โลโก้(2)
  • โลโก้(3)
  • โลโก้(4)
  • โลโก้(5)
  • โลโก้(6)
  • โลโก้(7)
  • โลโก้(8)
  • โลโก้(9)
  • โลโก้(11)
  • โลโก้(12)
  • โลโก้(13)
  • โลโก้(14)
  • โลโก้(15)
  • โลโก้(16)
  • โลโก้(17)
  • โลโก้(18)
  • โลโก้(19)
  • โลโก้(20)
  • โลโก้(21)
  • โลโก้(22)
  • โลโก้(23)
  • โลโก้(25)
  • โลโก้(26)
  • โลโก้(27)
  • โลโก้(28)
  • โลโก้(29)
  • โลโก้(30)
  • โลโก้(31)
badge 2023
badge 2024
badge 2025
เผยแพร่เมื่อ 18 ต.ค. 2567
เนสเตอร์ ฮิลล์

1) ทำไมเราจึงสร้างเว็บไซต์ใหม่และไม่สามารถ "เปลี่ยนธีม" ได้

เมื่อเราพบเห็นความจำเป็นในการเปลี่ยนแปลงเป็นครั้งแรก ดูเหมือนว่างานนี้จะง่าย: “เปลี่ยนบล็อกด้านบนและทำให้การเรียกร้องให้ดำเนินการมีประสิทธิภาพมากขึ้น” หากดูเผินๆ อาจดูเหมือนเป็นการแก้ไขปัญหาอย่างรวดเร็ว แต่ในไม่ช้า เราก็ตระหนักได้ว่างานเล็กๆ น้อยๆ นี้เผยให้เห็นปัญหาพื้นฐานที่ใหญ่กว่ามากเกี่ยวกับโครงสร้างและการออกแบบของไซต์ ปัญหาไม่ได้อยู่ที่บล็อกเดียว แต่เป็นสถาปัตยกรรมทั้งหมดของไซต์ที่จำเป็นต้องได้รับการปรับปรุง

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

บีพี3

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

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

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

2) เหตุใดเราจึงตัดสินใจไม่ใช้ Elementor

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

ข้อจำกัดและความท้าทายของ Elementor:

  1. ข้อบกพร่องและข้อผิดพลาด : แม้ว่า Elementor จะมีคุณสมบัติที่มีประโยชน์มากมาย แต่ก็ใช่ว่าจะไม่มีปัญหาทางเทคนิค ตัวอย่างเช่น เมื่อเราคัดลอกหน้าและพยายามแก้ไข หน้าใหม่มักจะดูแตกต่างจากหน้าเดิม แม้ว่าจะยังไม่ได้ทำการเปลี่ยนแปลงใดๆ ก็ตาม มีข้อบกพร่องบ่อยครั้งเกี่ยวกับวิธีการแสดงองค์ประกอบ เช่น คุณสมบัติ "ความกว้างสูงสุดของรูปภาพ" ไม่ทำงานอย่างถูกต้อง ข้อผิดพลาดเหล่านี้ทำให้ยากที่จะรับรองรูปแบบที่สอดคล้องกันในทุกหน้า
  2. อิสระในการสร้างสรรค์มากเกินไป นำไปสู่ความไม่สอดคล้องกัน : จุดขายสำคัญประการหนึ่งของ Elementor คือความสามารถในการปรับแต่งทุกอย่าง อย่างไรก็ตาม ความยืดหยุ่นนี้สามารถเป็นดาบสองคมได้ โดยเฉพาะอย่างยิ่งเมื่อมีบรรณาธิการหลายคนทำงานบนไซต์ เป็นเรื่องง่ายสำหรับผู้ที่ไม่ได้เป็นมืออาชีพที่จะสร้างหน้าที่มีการออกแบบที่ไม่สอดคล้องกันโดยไม่ได้ตั้งใจ ตัวอย่างเช่น เราพบตัวอย่างที่บรรณาธิการใช้ข้อความสีชมพูบนปุ่มสีชมพูหรือเพิ่มสามเหลี่ยมสีส้มที่บินไปมาในพื้นหลัง ส่งผลให้การออกแบบดูยุ่งเหยิงและสับสน หากไม่มีระบบการออกแบบที่เข้มงวด ก็เป็นไปไม่ได้ที่จะรักษาเอกลักษณ์ภาพที่สอดคล้องกัน
  3. การปรับแต่งที่จำกัดสำหรับฟังก์ชันขั้นสูง : แม้ว่า Elementor จะโดดเด่นในด้านการสร้างหน้าพื้นฐานด้วยข้อความและรูปภาพ แต่การเพิ่มฟังก์ชันแบบกำหนดเองกลับกลายเป็นเรื่องท้าทายมากขึ้น เรามักพบว่าเราถูกจำกัดให้ใช้เฉพาะบล็อกในตัวเท่านั้น ซึ่งยากต่อการปรับแต่งสำหรับฟีเจอร์ที่ซับซ้อนมากขึ้น เมื่อความต้องการของเราขยายออกไปเกินเค้าโครงพื้นฐาน ข้อจำกัดของ Elementor ก็เริ่มชัดเจนมากขึ้น
  4. โค้ดที่ใหญ่โตและปัญหาประสิทธิภาพการทำงาน : วิธีการสร้างหน้าของ Elementor ทำให้เกิดการซ้อนกันขององค์ประกอบมากเกินไป ตัวอย่างเช่น Elementor จะสร้างองค์ประกอบหลายรายการโดยอัตโนมัติ
    ภาชนะภายในอื่น ๆ
    องค์ประกอบแต่ละองค์ประกอบมีรูปแบบของตัวเอง ส่งผลให้โครงสร้างมีขนาดใหญ่เกินไป ซึ่งส่งผลเสียต่อความเร็วในการโหลด ประสิทธิภาพของหน้าเว็บ และอันดับ SEO ของเว็บไซต์ในที่สุด เมื่อเราทำการทดสอบความเร็ว ผลลัพธ์ที่ได้มักจะออกมาแย่ และโค้ดขนาดใหญ่ที่สร้างโดย Elementor เป็นสาเหตุหลัก
  5. ไม่มีความสามารถในการทดสอบ A/B : ในโลกดิจิทัลของปัจจุบัน การทดสอบ A/B ถือเป็นสิ่งสำคัญสำหรับการเพิ่มประสิทธิภาพประสบการณ์ของผู้ใช้ อย่างไรก็ตาม Elementor ไม่มีความสามารถในการแสดงเวอร์ชันต่างๆ ของไซต์ให้กับผู้ใช้ที่แตกต่างกัน ทุกคนจะเห็นไซต์เดียวกัน ซึ่งจำกัดความสามารถของเราในการทดสอบและปรับแต่งองค์ประกอบการออกแบบ เช่น สี รูปร่างของปุ่ม และภาพพื้นหลัง หากไม่มีฟังก์ชันนี้ เราจะไม่สามารถปรับแต่งไซต์ตามพฤติกรรมของผู้ใช้จริงได้
  6. ฐานข้อมูลที่บวม : ข้อเสียที่สำคัญที่สุดประการหนึ่งของ Elementor ก็คือวิธีการจัดการสไตล์และเนื้อหา Elementor จะจัดเก็บสไตล์ โครงสร้างที่ซ้อนกัน และแท็กที่ไม่จำเป็นอื่นๆ รวมกับเนื้อหาในฐานข้อมูล ซึ่งจะทำให้ฐานข้อมูลบวมและไม่ได้รับการทำความสะอาดแม้ว่าจะปิดใช้งานหรือถอนการติดตั้ง Elementor ไปแล้วก็ตาม ดังนั้นการเปลี่ยนไปใช้ธีมหรือเฟรมเวิร์กใหม่จึงไม่สามารถแก้ปัญหาได้ เนื่องจากสไตล์เหล่านั้นยังคงฝังอยู่ในหน้าต่างๆ และยังคงก่อให้เกิดปัญหาต่อไป

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

3) วิธีการสร้างหน้าบนเว็บไซต์ใหม่

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

  1. เข้าสู่ระบบแผงควบคุมผู้ดูแลระบบ WordPress และคลิก หน้า -> เพิ่มหน้าใหม่
  2. คุณจะเห็นตัวแก้ไข WordPress มาตรฐานซึ่งคุณสามารถเขียนหรือวางข้อความ เพิ่มลิงก์ และอัปโหลดรูปภาพได้

บีพี1 1

กระบวนการนี้เรียบง่ายแต่ยืดหยุ่นได้ แทนที่จะพึ่งพาระบบบล็อกที่ซับซ้อนของ Elementor ตัวแก้ไขเนื้อหาใน WordPress จะสะอาดกว่ามาก ทำให้อัปเดตได้รวดเร็วและปรับแต่งได้ง่าย ด้านล่างตัวแก้ไขมีการตั้งค่าสำหรับ Advanced Custom Fields (ACF) ซึ่งได้รับการกำหนดค่าไว้แล้วเพื่อรักษาความสม่ำเสมอทั่วทั้งไซต์

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

บีพี2

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

ระบบนี้ช่วยลดความซับซ้อนในการจัดการเนื้อหาในขณะที่ยังคงความสอดคล้องของการออกแบบในทุกหน้า

4) วิธีการสร้างโพสต์ใหม่

การสร้างโพสต์บนไซต์ใหม่จะปฏิบัติตามกระบวนการเดียวกันกับการสร้างเพจ โดยมีความแตกต่างที่สำคัญบางประการดังนี้:

  • โพสต์จะมี URL ที่รวมถึง ../blog/.. ซึ่งจะทำให้แตกต่างจากหน้าอื่นๆ
  • ในแถบด้านข้างทางขวา บล็อกจะแสดงบทความสามบทความล่าสุดโดยอัตโนมัติ ช่วยให้บล็อกมีชีวิตชีวาและน่าสนใจ

เทมเพลตสำหรับโพสต์ทั้งหมดอยู่ในไฟล์ template-parts/content/content-single.php ซึ่งจัดการโครงสร้างและเค้าโครงของโพสต์บล็อกแต่ละโพสต์ เทมเพลตที่สอดคล้องกันนี้ช่วยให้อัปเดตได้ง่ายและรับรองว่าโพสต์ทั้งหมดปฏิบัติตามแนวทางการออกแบบเดียวกัน

5) ฟิลด์ที่กำหนดเองขั้นสูง (ACF)

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

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

6) การทดสอบ A/B

การปรับปรุงที่สำคัญที่สุดอย่างหนึ่งที่เราทำกับไซต์ใหม่คือการใช้การทดสอบ A/B การทดสอบ A/B ช่วยให้เราเปรียบเทียบไซต์สองเวอร์ชันเพื่อดูว่าเวอร์ชันใดทำงานได้ดีกว่ากับผู้ใช้ ซึ่งอาจรวมถึงการทดสอบสี รูปร่างปุ่ม พื้นหลัง หรือแม้แต่เลย์เอาต์ที่แตกต่างกัน

เราใช้งานฟังก์ชันนี้โดยใช้ พารามิเตอร์ GET ใน URL ตัวอย่างเช่น สามารถสร้างแคมเปญโฆษณาที่เหมือนกันสองแคมเปญได้ แต่มี URL ที่แตกต่างกัน:

  • https://www.conveythis.com/?param=1

บีพี4

  • https://www.conveythis.com/?param=2

บีพี5

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

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

7) ไฟล์ functions.php

ไฟล์ functions.php ใน WordPress มักถูกเข้าใจผิดว่าจำกัดไว้สำหรับงานที่เกี่ยวข้องกับบล็อก อย่างไรก็ตาม ไฟล์นี้เป็นมากกว่ายูทิลิตี้สำหรับจัดการโพสต์หรือฟีเจอร์ของบล็อกเท่านั้น แต่ยังทำหน้าที่เป็นแกนหลักสำหรับฟังก์ชันที่กำหนดเองทั้งหมดบนเว็บไซต์ ในกรณีของเรา เราใช้ไฟล์ functions.php เพื่อเพิ่มฟีเจอร์ขั้นสูง เพิ่มประสิทธิภาพการทำงาน และจัดการสคริปต์และการตั้งค่าทั่วทั้งเว็บไซต์
นี่คือภาพรวมของวิธีการ ฟังก์ชั่น.php ไฟล์มีบทบาทสำคัญในการพัฒนาของเรา:
  • ประเภทโพสต์ที่กำหนดเองและอนุกรมวิธาน

การใช้งานที่สำคัญอย่างหนึ่งของไฟล์ functions.php คือการสร้างประเภทโพสต์และอนุกรมวิธานแบบกำหนดเอง ซึ่งช่วยให้เราจัดระเบียบเนื้อหาได้อย่างมีประสิทธิภาพมากขึ้น แทนที่จะพึ่งพาโครงสร้าง WordPress เริ่มต้นเพียงอย่างเดียว (หน้าและโพสต์) เราได้แนะนำประเภทแบบกำหนดเองสำหรับเนื้อหาเฉพาะ เช่น กรณีศึกษา คำรับรอง หรือคุณลักษณะของผลิตภัณฑ์ ซึ่งไม่เพียงแต่ทำให้เนื้อหาของเราจัดระเบียบได้ดีขึ้นเท่านั้น แต่ยังปรับปรุงประสบการณ์ของผู้ใช้ด้วยการทำให้การนำทางและค้นหาข้อมูลที่เกี่ยวข้องง่ายขึ้นอีกด้วย

ตัวอย่างเช่น หากต้องการสร้างประเภทโพสต์แบบกำหนดเองสำหรับกรณีศึกษา เราได้เพิ่มโค้ดต่อไปนี้ใน functions.php :

ฟังก์ชัน create_case_study_post_type() {

  register_post_type('กรณีศึกษา',
    อาร์เรย์(
           'ป้ายกำกับ' =>อาร์เรย์(
              'ชื่อ' => __( 'กรณีศึกษา' ),
          'singular_name' => __( 'กรณีศึกษา' )
        ),
            'สาธารณะ' => จริง,
           'has_archive' => จริง,
           'เขียนใหม่' => อาร์เรย์('slug' => 'กรณีศึกษา')
       )
  );
}
add_action('init', 'สร้าง_กรณีศึกษา_โพสต์_ประเภท');
ซึ่งจะสร้างประเภทโพสต์ใหม่ที่เรียกว่า "Case Studies" ซึ่งมีลักษณะคล้ายคลึงกับโพสต์ทั่วไป แต่มีโครงสร้างไฟล์เก็บถาวรและอนุกรมวิธานของตัวเอง
  • การโหลดสคริปต์และรูปแบบภายนอก

การใช้งานที่สำคัญอีกประการหนึ่งของ functions.php คือการโหลดสคริปต์และรูปแบบภายนอก เพื่อให้แน่ใจว่าเว็บไซต์ของเรามีไลบรารีและเฟรมเวิร์กที่จำเป็นทั้งหมด ตัวอย่างเช่น เราได้รวมไลบรารีอย่าง Slick.js สำหรับสไลเดอร์และ AOS (Animate on Scroll) เพื่อสร้างแอนิเมชั่นที่ราบรื่น โดยการโหลดทรัพยากรเหล่านี้เฉพาะเมื่อจำเป็นเท่านั้น (เช่น บนหน้าหรือเทมเพลตเฉพาะ) เราลดความไม่จำเป็นและเพิ่มความเร็วในการโหลดหน้า

นี่คือวิธีที่เราจัดการการโหลดสไตล์และสคริปต์:

ฟังก์ชัน load_custom_scripts() {

  // โหลดสไลเดอร์ Slick สำหรับเทมเพลตเฉพาะ
   ถ้า( is_page_template('template-slider.php') ) {
    wp_enqueue_style('slick-css', get_template_directory_uri() . '/css/slick.css' );
        wp_enqueue_script('slick-js', get_template_directory_uri() . '/js/slick.min.js', array('jquery'), '', true );
   }
   // โหลดแอนิเมชั่น AOS ทั่วทั้งไซต์
   wp_enqueue_style('aos-css', get_template_directory_uri() . '/css/aos.css' );
   wp_enqueue_script('aos-js', get_template_directory_uri() . '/js/aos.js', array('jquery'), '', true );
}
เพิ่มการดำเนินการ('wp_enqueue_scripts', 'load_custom_scripts');
โดยใช้การตรวจสอบแบบมีเงื่อนไข (เช่น เป็นเทมเพลตหน้าเพจ()) เรามั่นใจว่าสคริปต์ที่ไม่จำเป็นจะไม่ถูกโหลดลงทั่วทั้งไซต์ จึงทำให้ประสิทธิภาพการทำงานดีขึ้น
  • รหัสย่อที่กำหนดเอง

เพื่อปรับปรุงความยืดหยุ่นให้กับผู้ใช้ที่ไม่ใช่ช่างเทคนิคในการจัดการเนื้อหาไซต์ เราได้เพิ่มรหัสย่อแบบกำหนดเองผ่าน functions.php รหัสย่อเหล่านี้ช่วยให้ผู้ใช้สามารถแทรกฟังก์ชันที่ซับซ้อนหรือองค์ประกอบที่มีรูปแบบต่างๆ ได้อย่างง่ายดายโดยไม่ต้องแตะต้องรหัส ตัวอย่างเช่น เราได้สร้างรหัสย่อสำหรับเพิ่มปุ่มแบบกำหนดเองที่ใดก็ได้ในไซต์:

 

[ข้อมูลปกปิด]

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

8) การจัดการ SEO และความเร็วของเว็บไซต์

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

การปรับปรุง SEO

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

  • HTML แบบความหมาย : เราจัดโครงสร้าง HTML ของเว็บไซต์อย่างรอบคอบด้วยการใช้แท็กส่วนหัวอย่างเหมาะสม (

    -

    ฯลฯ) เพื่อให้แน่ใจว่าเครื่องมือค้นหาสามารถวิเคราะห์และทำความเข้าใจลำดับชั้นของเนื้อหาได้อย่างง่ายดาย ซึ่งถือเป็นสิ่งสำคัญโดยเฉพาะอย่างยิ่งสำหรับการจัดอันดับ SEO และการเข้าถึง
  • เมตาแท็กและข้อมูลโอเพ่นกราฟ : เราใช้ประโยชน์จากปลั๊กอิน Yoast SEO เพื่อจัดการเมตาไตเติล คำอธิบาย และข้อมูลโอเพ่นกราฟสำหรับการแชร์บนโซเชียล ด้วยการใช้ Yoast เรามั่นใจได้ว่าแต่ละเพจและโพสต์มีเมตาเดตาที่ปรับให้เหมาะสม ซึ่งมีความสำคัญต่อการมองเห็นในเครื่องมือค้นหาและอัตราการคลิกผ่านจากแพลตฟอร์มโซเชียลมีเดีย
  • มาร์กอัปโครงร่าง : เราใช้ไฟล์ functions.php เพื่อเพิ่มมาร์กอัปโครงร่างแบบกำหนดเองสำหรับข้อมูลที่มีโครงสร้าง ซึ่งช่วยปรับปรุงวิธีที่เครื่องมือค้นหาแสดงหน้าต่างๆ ของเราในผลการค้นหา ตัวอย่างเช่น เราได้รวมโครงร่างสำหรับบทความ กรณีศึกษา และผลิตภัณฑ์ ซึ่งช่วยให้เครื่องมือค้นหาจัดหมวดหมู่เนื้อหาของเราได้ดีขึ้น

ฟังก์ชัน add_schema_markup() {
  เสียงสะท้อน '
  {
    "@บริบท": "http://schema.org",
    "@type": "องค์กร",
    "ชื่อ": "ConveyThis",
    "url": "https://www.conveythis.com",
"โลโก้": "https://www.conveythis.com/logo.png",
"เหมือนกับ": [
"https://www.facebook.com/conveythis",
"https://twitter.com/conveythis"
]
}
';
}
add_action( 'wp_head', 'add_schema_markup' );

การเพิ่มประสิทธิภาพความเร็วไซต์

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

  • การเพิ่มประสิทธิภาพรูปภาพ : เราใช้รูปแบบรูปภาพสมัยใหม่ เช่น WebP ซึ่งมีอัตราการบีบอัดที่ดีกว่ารูปแบบดั้งเดิม เช่น PNG และ JPEG รูปภาพทั้งหมดมีขนาดที่เหมาะสมตามความละเอียดหน้าจอของผู้ใช้ ทำให้โหลดได้เร็วแม้ในอุปกรณ์พกพา
  • การโหลด แบบ Lazy Loading : การโหลดแบบ Lazy Loading สำหรับรูปภาพช่วยให้มั่นใจได้ว่าจะโหลดเฉพาะรูปภาพที่มองเห็นได้บนหน้าจอของผู้ใช้เท่านั้นในตอนแรก รูปภาพเพิ่มเติมจะโหลดขึ้นเมื่อผู้ใช้เลื่อนหน้าจอ ทำให้เวลาในการโหลดหน้าเริ่มต้นลดลง
  • การแคชและการย่อขนาด : เราใช้ WP Rocket สำหรับการแคช การย่อขนาด และการบีบอัดไฟล์ HTML, CSS และ JavaScript WP Rocket ช่วยให้เราโหลดได้เร็วขึ้นโดยลดขนาดไฟล์โดยรวมและให้บริการเวอร์ชันแคชคงที่ของหน้าเว็บสำหรับผู้เยี่ยมชมซ้ำ

9) การเพิ่มประสิทธิภาพและการล้างฐานข้อมูล

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

  • การลบข้อมูล Elementor เก่า

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

  • การจัดทำดัชนีฐานข้อมูล

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

บทสรุป

การตัดสินใจสร้างเว็บไซต์ใหม่ตั้งแต่ต้นนั้นเกิดจากข้อจำกัดและความไม่มีประสิทธิภาพของเว็บไซต์เดิม การเปลี่ยนธีมเพียงอย่างเดียวไม่ใช่ทางเลือกที่เหมาะสม เนื่องจากการออกแบบไม่สม่ำเสมอ สไตล์ที่มากเกินไป และปัญหาด้านประสิทธิภาพที่เกิดจาก Elementor การสร้างเว็บไซต์ใหม่โดยใช้การพัฒนาแบบกำหนดเองและฟิลด์กำหนดเองขั้นสูง ทำให้เราสามารถสร้างเว็บไซต์ที่มีประสิทธิภาพมากขึ้น เชื่อมโยงกัน และเป็นมืออาชีพมากขึ้น ซึ่งช่วยยกระดับประสบการณ์ของผู้ใช้ ขณะเดียวกันก็เปิดใช้งานการอัปเดตที่คล่องตัวและฟังก์ชันการทดสอบ A/B เว็บไซต์ใหม่นี้สร้างรากฐานที่มั่นคงสำหรับการเติบโตและการปรับปรุงในอนาคต

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

การแปลเป็นมากกว่าแค่การรู้ภาษา แต่เป็นกระบวนการที่ซับซ้อน

หากปฏิบัติตามเคล็ดลับของเราและใช้ ConveyThis หน้าที่คุณแปลแล้วจะเข้าถึงกลุ่มเป้าหมายและให้ความรู้สึกเหมือนเป็นภาษาเป้าหมายจริงๆ

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

ทดลองใช้ ConveyThis ฟรี 3 วัน!

เริ่มต้นใช้งานฟรี
CONVEYTHIS
ผลิตในประเทศสหรัฐอเมริกา
ConveyThis เป็นเครื่องหมายการค้าจดทะเบียนของ ConveyThis LLC
เริ่ม
บริษัท
  • เกี่ยวกับเรา
  • กด
  • พันธมิตร
  • พันธมิตรพันธมิตร
  • การกำหนดราคา
  • อาชีพ
ถูกกฎหมาย
  • ความเป็นส่วนตัว
  • เงื่อนไข
  • การปฏิบัติตาม
  • อีอีโอพี
  • คุกกี้
  • แถลงการณ์ด้านความปลอดภัย
ภาษา
ภาษาอังกฤษ
ติดตามเราได้ที่

Ⓒ 2025 สงวนลิขสิทธิ์โดย ConveyThis LLC
Français Português Deutsch Español Tiếng Việt Русский العربية Italiano Türkçe 繁體 ภาษาไทย Polski Українська Tagalog Română 한국어 日本語 Bahasa Indonesia Magyar हिन्दी עברית Nederlands Dansk Čeština 简体
English