การตรวจสอบหน้าการชำระเงิน: ยอมรับการชำระเงินได้อย่างง่ายดายโดยใช้ WordPress และ Elementor

เผยแพร่แล้ว: 2022-04-04

ต้องการรับการชำระเงินในไซต์ WordPress ของคุณหรือไม่?

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

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

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

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

ในการตรวจสอบหน้าการชำระเงินแบบลงมือปฏิบัติ เราจะดูที่ปลั๊กอินการชำระเงิน WordPress ฟรีนี้และแสดงวิธีการทำงาน

การตรวจสอบหน้าการชำระเงิน: ปลั๊กอินทำอะไรได้บ้าง

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

แล้วมันช่วยคุณได้อย่างไร?

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

เหมาะอย่างยิ่งสำหรับการสร้างฟอร์มที่มีสไตล์เพราะช่วยให้คุณควบคุมการออกแบบได้อย่างเต็มที่โดยไม่ต้องใช้ CSS ที่กำหนดเอง คุณยังได้รับเทมเพลตหน้าการชำระเงินเต็มจำนวน 11 แบบที่ขับเคลื่อนโดย Elementor เพื่อการปรับแต่งภาพที่ง่ายดาย

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

ปลั๊กอิน WordPress หน้าชำระเงิน

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

  • Apple Pay
  • Google Pay
  • ลายสก๊อต
  • AliPay
  • Microsoft Pay
  • เป็นต้น

คุณยังได้รับความยืดหยุ่นในการชำระเงินเพื่อรวบรวมสิ่งต่อไปนี้:

  • จ่ายครั้งเดียว
  • ชำระเงินค่าสมัครรับข้อมูลอัตโนมัติตามกำหนดเวลา

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

นี่คือคุณสมบัติเด่นอื่นๆ บางส่วน:

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

วิธีใช้หน้าการชำระเงินเพื่อยอมรับการชำระเงิน

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

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

1. เชื่อมต่อเกตเวย์การชำระเงินของคุณ

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

ในขณะที่ตรวจสอบหน้าการชำระเงิน ตัวเลือกเหล่านั้นคือ Stripe หรือ PayPal:

ตั้งค่าเกตเวย์การชำระเงิน

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

หากคุณต้องการใช้ Stripe หน้าการชำระเงินรองรับอินเทอร์เฟซการเชื่อมต่อ Stripe อย่างง่าย ซึ่งช่วยให้คุณตั้งค่าทุกอย่างได้โดยไม่ต้องวุ่นวายกับคีย์ API และอื่นๆ

หรือหากคุณกำลังทดสอบอยู่ คุณสามารถคลิกปุ่มเพื่อดำเนินการต่อในโหมดทดสอบโดยไม่ต้องทำการตั้งค่าขั้นสูงเพิ่มเติม:

เชื่อมต่อกับ Stripe

เมื่อคุณตั้งค่าแล้ว คุณจะเห็นตัวบ่งชี้ในหน้าแดชบอร์ด WordPress ที่แจ้งว่าคุณเชื่อมต่อแล้ว

สำหรับ PayPal คุณจะต้องป้อนคีย์ API ของคุณ ซึ่งซับซ้อนกว่าเล็กน้อย แต่ก็ไม่ได้แย่เกินไป ( และนี่ไม่ใช่ความผิดของหน้าการชำระเงิน – กล่าวโทษ PayPal ที่ไม่ได้เสนอการตั้งค่าการเชื่อมต่อที่ลื่นไหลเช่น Stripe ):

การตั้งค่าเกตเวย์ PayPal

2. กำหนดค่าเกตเวย์การชำระเงิน

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

สำหรับ Stripe คุณสามารถเปิดใช้งานเกตเวย์เพิ่มเติม เช่น Apple Pay และ Google Pay ได้ง่ายๆ เพียงคลิกปุ่มสลับ:

ช่องทางการชำระเงินเพิ่มเติม

3. เลือกเทมเพลตของคุณ

ถัดไป คุณสามารถเลือกเทมเพลตสำหรับหน้าการชำระเงินของคุณ คุณยังสามารถใช้ Elementor เพื่อออกแบบหน้าการชำระเงินตั้งแต่ต้นได้หากต้องการ

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

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

การนำเข้าเทมเพลตหน้าการชำระเงิน

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

4. ปรับแต่งฟังก์ชันแบบฟอร์มการชำระเงินของคุณ

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

ในการเริ่มต้น ให้เปิดตัวแก้ไข Elementor หากคุณนำเข้าเทมเพลตหน้าการชำระเงิน คุณจะแก้ไขหน้าเทมเพลตนั้น หากคุณไม่ต้องการใช้หน้าเทมเพลต คุณสามารถสร้างหน้าใหม่ด้วย Elementor ได้

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

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

วิดเจ็ตองค์ประกอบหน้าการชำระเงิน

ต่อไปนี้คือบางสิ่งที่คุณปรับแต่งได้:

  • เลือกระหว่างการใช้แบบฟอร์มการชำระเงินแบบอินไลน์หรือแบบฟอร์มป๊อปอัป
  • เพิ่มแผนการชำระเงินแบบไม่จำกัดที่ผู้คนสามารถเลือกได้ แต่ละแผนสามารถมีราคาที่แตกต่างกัน ความถี่ในการชำระเงิน (สำหรับการชำระเงินแบบเป็นงวด) และแม้แต่สกุลเงิน (สำหรับตัวเลือกการชำระเงินหลายสกุลเงิน)
  • เปิดใช้งานวิธีการชำระเงินตามแบบฟอร์ม ตัวอย่างเช่น บัตรเครดิต บัตรเดบิต Google Pay, Apple Pay เป็นต้น
  • เลือกช่องแบบฟอร์มที่จะแสดงเพื่อรวบรวมข้อมูลที่ไม่ชำระเงินจากลูกค้า ตัวอย่างเช่น ชื่อ ที่อยู่อีเมล และอื่นๆ
  • ปรับตัวเลือกสกุลเงิน เช่น อนุญาตให้ผู้ใช้กรองตามสกุลเงินหรือไม่
  • เพิ่มตัวกรองการสมัครเพื่อให้ผู้ใช้สามารถสลับระหว่างตัวเลือกการชำระเงินแบบครั้งเดียวหรือแบบประจำ
  • ปรับแต่งปุ่มส่ง คุณยังสามารถรวมข้อมูลไดนามิก ตัวอย่างเช่น “ชำระเงิน [สัญลักษณ์สกุลเงิน] [จำนวนเงิน] ทันที”
  • เลือกหลังจากส่งการดำเนินการ คุณสามารถส่งอีเมล เปลี่ยนเส้นทางผู้ใช้ไปยังเพจ และ/หรือแสดงข้อความไดนามิก

มาดูการตั้งค่าที่สำคัญที่สุดสองประการกัน

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

การปรับแต่งตัวเลือกการชำระเงิน

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

การปรับแต่งช่องแบบฟอร์ม

การตั้งค่าอื่นๆ ทั้งหมดมีรายละเอียดใกล้เคียงกัน – วิดเจ็ต Elementor นี้เป็นส่วนสำคัญของปลั๊กอิน

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

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

5. ปรับแต่งการออกแบบแบบฟอร์มการชำระเงินของคุณ

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

คุณจะได้รับตัวเลือกในการปรับแต่งฟอร์มระดับสูง ฟิลด์แต่ละฟอร์ม และอื่นๆ:

ปรับแต่งการออกแบบหน้าการชำระเงิน

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

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

6. จัดการการชำระเงิน

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

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

ราคาหน้าชำระเงิน

หน้าการชำระเงินใช้รูปแบบการเรียกเก็บเงิน freemium

นั่นหมายความว่ามีปลั๊กอินเวอร์ชันฟรีที่ WordPress.org พร้อมด้วยเวอร์ชันพรีเมียมสำหรับผู้ที่ต้องการเข้าถึงคุณลักษณะเพิ่มเติม

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

  • แผนการสมัครสมาชิกที่เกิดซ้ำ
  • วิธีพิเศษของ Stripe และ PayPal ตัวอย่างเช่น รุ่นฟรีให้คุณรับชำระเงินด้วยบัตรเครดิต/เดบิตผ่าน Stripe ได้ แต่คุณต้องใช้รุ่นพรีเมียมเพื่อใช้ตัวเลือกต่างๆ เช่น Apple Pay, Google Pay, Plaid และอื่นๆ
  • จำนวนเงินที่ชำระเองเพื่อให้ผู้คนสามารถป้อนจำนวนเงินของตนเองได้ ( เหมาะสำหรับการบริจาค/ผู้สนับสนุน )
  • การสมัครสมาชิกและตัวกรองสกุลเงิน
  • เทมเพลตหน้าการชำระเงิน Elementor ทั้งหมด – เวอร์ชันฟรีให้คุณเข้าถึงเทมเพลตได้สามแบบ ในขณะที่เวอร์ชันแบบชำระเงินจะปลดล็อกเทมเพลตทั้งหมด 11 แบบ

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

  • ไซต์ เดียว - 99 เหรียญ
  • สามไซต์ – $179
  • 25 ไซต์ – $599
การตรวจสอบราคาหน้าชำระเงิน

นักพัฒนายังเสนอส่วนลดพิเศษ 15% สำหรับผู้อ่าน WP Mayor ที่ทำให้ราคาเหล่านั้นถูกกว่า:

ลด 15%
หน้าชำระเงิน
หน้าชำระเงิน
ลด 15% ในหน้าชำระเงิน
ลด 15% ในหน้าชำระเงิน แสดงน้อยลง

แผนทั้งหมดยังมาพร้อมกับการ รับประกันคืนเงินภายใน 30 วัน ดังนั้นจึงไม่มีความเสี่ยงในการซื้อของคุณ

ความคิดสุดท้ายเกี่ยวกับหน้าการชำระเงิน

โดยรวมแล้วหน้าการชำระเงินทำให้ง่ายต่อการเริ่มต้นใช้งานอย่างรวดเร็วด้วยหน้าการชำระเงินที่ดูดี

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

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

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

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

เว็บไซต์หน้าชำระเงิน
WordPress.org Page