วิธีแก้ไขหน้าชำระเงิน WooCommerce W / O Elementor
เผยแพร่แล้ว: 2022-10-18ไม่ชอบหน้าเช็คเอาต์ WooCommerce เริ่มต้นของคุณเพราะมันดูน่าเบื่อ และกระบวนการเช็คเอาต์ก็ยาวด้วยใช่หรือไม่ นี่อาจเป็นเวลาที่เหมาะสมในการแก้ไขเพจของคุณ ด้วยวิธีนี้ ลูกค้าของคุณสามารถสั่งซื้อได้อย่างรวดเร็ว ซึ่งอาจช่วยเพิ่ม Conversion ได้เช่นกัน
แต่คุณจะปรับแต่งหน้าชำระเงิน WooCommerce ของคุณได้อย่างไร? ตามที่ปรากฏ มี 3 วิธีที่มีประสิทธิภาพ ได้แก่ การแก้ไขด้วยตนเอง การใช้ปลั๊กอิน และตัวสร้างหน้า Elementor อย่างไรก็ตาม วิธีที่ดีที่สุดขึ้นอยู่กับวิธีที่คุณพบว่าใช้งานได้ง่าย
ในตอนนี้ โดยไม่ต้องกังวลใจอีกต่อไป เรามาค้นหาสาเหตุที่คุณอาจต้องการปรับแต่งหน้าการชำระเงินของคุณก่อน หลังจากนั้น เราสามารถดูวิธีแก้ไขหน้าชำระเงิน WooCommerce ของคุณโดยใช้ Elementor & Shopready ร่วม กัน
สารบัญ
ทำไมคุณอาจต้องการแก้ไขหน้าชำระเงิน WooCommerce ของคุณ

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

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

ไม่ชอบหน้าเช็คเอาต์ WooCommerce เริ่มต้นของคุณเพราะมันดูน่าเบื่อ และกระบวนการเช็คเอาต์ก็ยาวด้วยใช่หรือไม่
วิธีนี้เกี่ยวข้องกับการใช้รหัสเพื่อแก้ไข เทมเพลตหน้าชำระเงิน ของคุณ ด้วยเหตุนี้ คุณจึงควบคุมการปรับแต่งได้มากกว่าเมื่อเทียบกับการใช้วิธีการแก้ไขอื่นๆ ด้านล่างนี้เป็นขั้นตอนง่ายๆ ในการทำ
ขั้นตอนที่ 1: เลือกตัวกรองสำหรับปรับแต่งช่องการชำระเงิน
ในการแก้ไขช่องการชำระเงิน คุณจะต้องใช้ไฟล์ functions.php บน เว็บไซต์อีคอมเมิร์ซของ คุณ สิ่งนี้น่าจะง่ายเพราะ WooCommerce มีรายการตัวกรองเพื่อให้คุณปรับแต่งช่องการชำระเงินได้ ตัวอย่างเช่นมี:
- WooCommerce_shipping_fields
- WooCommerce_after_checkout_form
- WooCommerce_billing_fields
- WooCommerce_checkout_after_terms_and_conditions
ขั้นตอนที่ 2: แก้ไขข้อความตัวแทน
ถัดไป เริ่มต้นด้วยการกำหนดข้อความตัวยึดตำแหน่งใน order_comments_fields คุณสามารถทำได้โดยการเพิ่มข้อมูลโค้ดต่อไปนี้ในไฟล์ functions.php ของคุณ
ขั้นตอนที่ 3: การลบฟิลด์
หากคุณต้องการลบฟิลด์ คุณเพียงแค่เพิ่มโค้ดด้านล่างลงในไฟล์ functions.php ของคุณ
ขั้นตอนที่ 4: เพิ่มฟิลด์ที่จำเป็น
หากต้องการเพิ่มฟิลด์ลงในหน้าชำระเงิน WooCommerce คุณเพียงแค่ใส่โค้ดด้านล่างลงในไฟล์ function.php ของคุณ
หลังจากใส่รหัสแล้ว คุณจะสังเกตเห็นว่าจะมีฟิลด์พิเศษปรากฏขึ้น ไม่มีอะไรต้องกังวลแม้ว่า คุณเพียงแค่คัดลอกรหัสต่อไปนี้เพื่อตรวจสอบความถูกต้องของข้อมูล
ขั้นตอนสุดท้าย: บันทึกข้อมูลของคุณ
สุดท้าย ป้อนรหัสต่อไปนี้เพื่อให้แน่ใจว่าทุกรายละเอียดที่ลูกค้าของคุณป้อนในหน้าชำระเงินจะได้รับการบันทึกไว้

วิธีที่ 2: การใช้ Elementor Page Builder

ไม่ชอบหน้าเช็คเอาต์ WooCommerce เริ่มต้นของคุณเพราะมันดูน่าเบื่อ และกระบวนการเช็คเอาต์ก็ยาวด้วยใช่หรือไม่
คุณต้องมีประสบการณ์ในการเขียนโค้ดในการแก้ไขหน้าชำระเงินด้วยตนเอง โชคดี ถ้าคุณไม่ใช่คนที่เชี่ยวชาญด้านเทคโนโลยี คุณสามารถใช้ elementor ซึ่งเป็นหนึ่งในเครื่องมือสร้างเพจ WordPress ที่ดีที่สุด ต่อไปนี้เป็นขั้นตอนเกี่ยวกับวิธีการแก้ไขโดยใช้ elementor
ขั้นตอนที่ 1: ค้นหาหน้าชำระเงิน
ขั้นแรก ไปที่แดชบอร์ด WordPress ของคุณและค้นหารายการหน้า ใต้รายการเพจ คุณจะพบหน้าชำระเงินเริ่มต้น เพียงคลิกปุ่มแก้ไขเพื่อเปิดตัวแก้ไข WordPress จากนั้นเลือกตัวเลือก Edit With Elementor เพื่อเปิดใช้งาน Elementor จากนั้นเปิดตัวแก้ไขของ Elementor
ขั้นตอนที่ 2: เพิ่มวิดเจ็ตการชำระเงิน Elementor
ถัดไป เปิดหน้าชำระเงินเริ่มต้นใน elementor และลบวิดเจ็ตการชำระเงิน WooCommerce หรือรหัสย่อที่มีอยู่ จากนั้น เพิ่มวิดเจ็ตการชำระเงินใน Elementor Editor คุณควรจะสามารถดูตัวอย่างสดของหน้าการชำระเงินของคุณได้
ขั้นตอนที่ 3: แก้ไขเนื้อหาในหน้าชำระเงิน
ใต้แท็บเนื้อหาที่อยู่บนแถบด้านข้างของ Elementor ให้คลิกที่การตั้งค่าทั่วไป จากการตั้งค่า คุณสามารถเลือกรูปแบบหนึ่งหรือสองคอลัมน์เพื่อ แก้ไขและปรับแต่งเนื้อหา
นอกจากนี้ คุณสามารถแก้ไขรายละเอียดการเรียกเก็บเงินและการจัดส่ง ข้อมูลเพิ่มเติม คำสั่งซื้อ คูปอง และรายละเอียดการชำระเงิน และถ้าคุณต้องการ เพิ่มกล่องคูปอง ก็สามารถทำได้เช่นกัน
ขั้นตอนที่ 4: แก้ไขรูปแบบหน้าชำระเงินของคุณ
ถัดจากแท็บเนื้อหา ให้คลิกที่แท็บสไตล์เพื่อปรับแต่งสไตล์ของหน้าชำระเงินของคุณเพิ่มเติม คุณต้องการให้แน่ใจว่าการออกแบบ หน้าชำระเงินแบบกำหนดเอง ของคุณตรงกับของร้านค้าของคุณ
ภายใต้แท็บ สไตล์ คุณสามารถเลือกตัวเลือกการออกแบบต่างๆ ได้ รวมถึงปุ่ม ส่วน การพิมพ์ แบบฟอร์ม สรุปคำสั่งซื้อ และการซื้อ เพียงปรับแต่งและลองใช้ตัวเลือกต่างๆ เพื่อค้นหาสไตล์ที่ทำให้หน้าการชำระเงินของคุณโดดเด่น
ขั้นตอนที่ 5: บันทึกการเปลี่ยนแปลงของคุณ
เมื่อคุณปรับแต่งสไตล์ของ เทมเพลตหน้าเช็คเอาต์ เสร็จแล้ว ให้บันทึกการเปลี่ยนแปลงทั้งหมด ถัดไป ดูตัวอย่างการเปลี่ยนแปลงก่อนที่คุณจะสามารถเผยแพร่เพจของคุณได้ในที่สุด
วิธีที่ 3: การใช้ปลั๊กอิน

ไม่ชอบหน้าเช็คเอาต์ WooCommerce เริ่มต้นของคุณเพราะมันดูน่าเบื่อ และกระบวนการเช็คเอาต์ก็ยาวด้วยใช่หรือไม่
อีกวิธีที่ง่ายและรวดเร็วในการแก้ไขหน้าชำระเงิน WooCommerce ของคุณคือการใช้ปลั๊กอิน ตอนนี้มีตัวเลือกปลั๊กอินให้เลือกไม่กี่ตัว อย่างไรก็ตาม ในบทความนี้ เราจะเน้นการใช้ Elementor และ Shopready ร่วม กัน
ขั้นตอนที่ 1: ติดตั้งโปรแกรมเสริม Shopready สำหรับ elementor
ก่อนติดตั้งปลั๊กอินนี้ ตรวจสอบให้แน่ใจว่า WordPress ของคุณมีตัวสร้างเพจ Elementor เนื่องจาก Shopready ไม่สามารถทำงานคนเดียวได้ จากนั้นบนแดชบอร์ด WordPress ให้คลิกที่ปลั๊กอินและเลือกเพิ่มใหม่ ถัดไป ค้นหา Shopready ในช่องค้นหาและคลิกปุ่มเปิดใช้งาน
ขั้นตอนที่ 2: ปรับแต่งเนื้อหาของหน้าการชำระเงิน Shopready ของคุณ
บนแดชบอร์ด WordPress ให้เลือกเปิด Shopready คุณจะถูกนำไปยังแดชบอร์ดของ Shopready ใต้แดชบอร์ดจะมีตัวเลือกวิดเจ็ต โมดูล และเทมเพลตเพื่อช่วยคุณปรับแต่งเพจของคุณ คุณสามารถเลือกตัวเลือกใดก็ได้เพื่อ แก้ไขและปรับแต่งเนื้อหา
ขั้นตอนที่ 3: เปิดใช้งานวิดเจ็ต
คลิกที่ตัวเลือกวิดเจ็ตและเลือกแท็บเปิดใช้งานทั้งหมด จากนั้นเลือก บันทึกการเปลี่ยนแปลง แต่ถ้าคุณไม่ต้องการเปิดใช้งานทุกฟิลด์ คุณเพียงแค่เลือกตัวเลือกที่ต้องการและบันทึกการเปลี่ยนแปลง
ขั้นตอนที่ 4: เปิดใช้งานโมดูล
จากนั้นเลือกตัวเลือกโมดูลและคลิกที่เปิดใช้งานทั้งหมด คุณยังสามารถเลือกตัวเลือก ปิดใช้งานทั้งหมด หรือเลือกเปิดใช้งานเพียงไม่กี่อย่าง เสร็จแล้วคลิกที่ปุ่ม บันทึกการเปลี่ยนแปลง
ขั้นตอนที่ 5: เปิดใช้งานเทมเพลต
ในส่วนนี้ คุณจะพบตัวเลือกต่างๆ เช่น ร้านค้า หน้าชำระเงิน ตะกร้าสินค้า หน้ารายละเอียดสินค้า และอื่นๆ คลิกแท็บ เปิดใช้งาน บนตัวเลือกเทมเพลตที่คุณต้องการ จากนั้นบันทึก
ขั้นตอนที่ 6: เปิดใช้งานสกุลเงิน API
คลิกที่แท็บ API และป้อนรหัสสกุลเงิน API ของคุณในช่องว่างที่ให้ไว้ จากนั้นเลือกตัวเลือก บันทึกการเปลี่ยนแปลง เพื่อดำเนินการให้เสร็จสิ้น
เหตุใดจึงต้องใช้ Shopready เพื่อแก้ไขหน้าชำระเงิน WooCommerce

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

ไม่ชอบหน้าเช็คเอาต์ WooCommerce เริ่มต้นของคุณเพราะมันดูน่าเบื่อ และกระบวนการเช็คเอาต์ก็ยาวด้วยใช่หรือไม่
โดยรวมแล้ว มีเหตุผลมากมายที่คุณอาจต้องการแก้ไขหน้าชำระเงิน WooCommerce ของคุณ อาจเป็นเพราะคุณต้องการปรับปรุงประสบการณ์ผู้ใช้ของลูกค้า ทำให้หน้าปลอดภัย หรือปรับปรุงตราสินค้าของคุณ ไม่ว่าในกรณีใด คุณสามารถเลือกแก้ไขโดยใช้ปลั๊กอิน องค์ประกอบหรือแก้ไขด้วยตนเอง
แน่นอน การใช้ปลั๊กอินหรือการ รวมกันของ elementor & Shopready เป็นวิธีที่ง่ายที่สุด เนื่องจาก Shopready มีวิดเจ็ตให้เลือกมากมาย ดังนั้น คุณสามารถแก้ไขหน้าชำระเงินของคุณและทำให้เป็นแบบส่วนตัวได้ตามที่คุณต้องการ อย่างไรก็ตาม หากคุณมีประสบการณ์ในการเขียนโค้ด คุณสามารถแก้ไขเพจด้วยตนเองได้ตลอดเวลา
วิธีเพิ่ม Wishlist ใน WooCommerce W/O Plugin