วิธีออกแบบรถเข็น WooCommerce ใน Elementor [ไม่มีการเข้ารหัส]

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

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

WooCommerce cart

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

ทำไมคุณควรออกแบบหน้ารถเข็น WooCommerce แบบกำหนดเอง?

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

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

WooCommerce cart

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

ออกแบบรถเข็น WooCommerce แบบมืออาชีพด้วย Addons ที่จำเป็น 5.0

ปี 2021 เป็นปีที่ยอดเยี่ยมสำหรับทีม Essential Addons for Elementor ของเรา เราได้บรรลุเป้าหมายที่ยิ่งใหญ่ที่สุดและเติบโตเร็วกว่าที่เราเคยฝันไว้ และทั้งหมดนี้ต้องขอบคุณคุณ ดังนั้น เพื่อส่งท้ายปีด้วยเสียงสูงแบบเดียวกันและมอบประสบการณ์การสร้างเว็บที่ดีที่สุดให้กับคุณ เราขอนำเสนอการอัปเดต Essential Addons 5.0 ล่าสุดให้กับคุณ

รุ่นล่าสุดมาพร้อมกับการปรับปรุงมากมาย องค์ประกอบใหม่ และส่วนขยายที่จะช่วยปลดปล่อยทักษะการออกแบบเว็บของคุณใน Element ได้อย่างง่ายดาย และเรามีความยินดีที่จะแจ้งให้คุณทราบว่าการอัปเดตนี้ยังมาพร้อมกับวิดเจ็ตพิเศษ – EA Woo Cart

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

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

ตั้งค่ารถเข็น EA Woo ที่ราบรื่นใน Elementor โดยไม่มีการเข้ารหัส

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

ขั้นตอนที่ 1: ตั้งค่าหน้ารถเข็น WooCommerce ที่คุณต้องการ

ก่อนอื่น ให้ไปที่หน้า WooCommerce → การตั้งค่า จากแดชบอร์ด WordPress ของคุณโดยตรง จากนั้นไปที่ แท็บ 'ขั้นสูง' จากที่นี่ คุณสามารถกำหนดหน้าใดก็ได้ที่คุณต้องการให้เป็นหน้าตะกร้าสินค้าใหม่

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

WooCommerce cart

ขั้นตอนที่ 2: แก้ไขรถเข็น WooCommerce ใน Elementor

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

ตรวจสอบให้แน่ใจว่าคุณได้ติดตั้งเวอร์ชันล่าสุดของ Essential Addons 5.0 PRO แล้วตรงไปที่ แท็บ 'องค์ประกอบ' จากส่วนต่อประสานผู้ใช้ Essential Addons สำหรับ Elementor คุณจะพบองค์ประกอบมากกว่า 80+ รายการที่นี่ แต่สิ่งที่คุณต้องทำคือสลับตัวเลือก ' EA Woo Cart ' และกด ' บันทึกการตั้งค่า ' เพื่อเริ่มต้น

WooCommerce cart

ขั้นตอนที่ 3: แก้ไขรถเข็น WooCommerce ใน Elementor

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

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

WooCommerce cart

กำหนดค่าแต่ละส่วนของ EA Woo Cart ได้อย่างง่ายดาย

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

ขั้นตอนที่ 1: กำหนดค่าการตั้งค่าทั่วไปของ EA Woo Cart

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

จาก 'การตั้งค่าทั่วไป' คุณจะพบกับ 2 รูปแบบที่แตกต่างกันของเลย์เอาต์สำหรับ EA Woo Cart ของคุณเพื่อเลือกและปรับแต่งตามที่คุณต้องการ ดังที่แสดงด้านล่าง

WooCommerce cart

ขั้นตอนที่ 2: เปลี่ยนป้ายกำกับจากตัวสร้างตาราง

ถัดไป จาก ' ตัว สร้างตาราง ' คุณสามารถเปลี่ยนป้ายกำกับตารางและลากส่วนต่างๆ เพื่อจัดเรียงตารางราคา EA Woo Cart ของคุณใหม่ สิ่งนี้ให้ความยืดหยุ่นอย่างเต็มที่แก่คุณในการเปลี่ยนฉลากทุกรายการจากคอลัมน์ทั้งหมดที่คุณเพิ่มลงในหน้าตะกร้าสินค้า – 'ผลิตภัณฑ์', 'ราคา', 'ปริมาณ' ฯลฯ

WooCommerce cart

ขั้นตอนที่ 3: ปรับแต่งคุณสมบัติส่วนประกอบรถเข็น

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

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

WooCommerce cart

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

ปรับแต่งสไตล์ของ EA Woo Cart ได้อย่างเต็มที่ในไม่กี่คลิก

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

ขั้นตอนที่ 1: ปรับแต่งการตั้งค่าทั่วไป

จากส่วน 'ทั่วไป' คุณสามารถเปลี่ยนสีพื้นหลังของส่วน EA Woo Cart ทั้งหมดของคุณได้ คุณจะสามารถปรับสีของพื้นหลัง EA Woo Cart ด้วยตนเองหรือเลือกสีสากลก็ได้

WooCommerce cart

ขั้นตอนที่ 2: รับรายละเอียดด้วยส่วนตาราง

จากส่วน 'ตาราง' คุณสามารถเปลี่ยนการเติม ระยะขอบ การพิมพ์ ประเภทของเส้นขอบ และอื่นๆ ของส่วนรถเข็นทั้งหมดได้ ในที่สุดมันจะทำให้หน้า EA Woo Cart ของคุณโดดเด่นกว่าร้าน WooCommerce อื่น ๆ และดูกำหนดเองได้อย่างสมบูรณ์

ขั้นตอนที่ 3: เปลี่ยนด้านการออกแบบอื่นๆ

แต่นั่นไม่ใช่ทั้งหมด ในทำนองเดียวกัน คุณสามารถเปลี่ยนรูปลักษณ์ของ ' Cart Total ', ' Coupon Form' , ' Continue Shopping ', 'Button' และ ' Notice' คุณสามารถเปลี่ยนข้อความภายในได้เช่นกัน

WooCommerce cart

หากต้องการเพิ่มฟังก์ชันการทำงานและทำให้หน้า EA Woo Cart ของคุณดูโต้ตอบและน่าสนใจยิ่งขึ้น คุณสามารถสำรวจ ตัวเลือกการตั้งค่า 'ขั้นสูง' ได้เช่นกัน

WooCommerce cart

หน้า รถเข็น WooCommerce ของนักออกแบบมืออาชีพ

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

ตรวจสอบผลลัพธ์สุดท้ายด้านล่างและดูว่าหน้าตะกร้าสินค้าของนักออกแบบที่ดูเป็นมืออาชีพใน WooCommerce ด้วยความช่วยเหลือจากวิดเจ็ต Essential Addons EA Woo Cart ระดับพรีเมียม

WooCommerce cart

วิดเจ็ตพิเศษอื่นๆ สำหรับร้านค้า WooCommerce ของคุณ

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

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

WooCommerce cart

แกลลอรี่ผลิตภัณฑ์ Woo

ตัวเลื่อนสินค้า Woo

Woo Product Caraosel

Woo Product Grid

เปรียบเทียบผลิตภัณฑ์ Woo

คอลเลกชันผลิตภัณฑ์ Woo

Woo Checkout

ตรวจสอบจากเว็บไซต์ Essential Addons และเพิ่มยอดขายร้านค้า WooCommerce ของคุณได้ทันทีอย่างง่ายดาย

อัปเดตเป็นส่วนเสริมที่สำคัญ 5.0 & เพิ่มยอดขาย WooCommerce

ดังนั้นสิ่งที่คุณรอ? อย่ารอช้า! อัปเดตเป็น Essential Addons 5.0 ทันทีและเข้าร่วมกับเราในการสร้างร้านค้า WooCommerce ที่มีเอกลักษณ์และมีการแปลงสูง หรือตรวจสอบ แพ็คเกจ PRO ของเรา เริ่มต้นในราคาพิเศษ เพียง $39.97 และการเข้าชม การขาย และการแปลงที่พุ่งสูงขึ้นโดยใช้คุณสมบัติระดับพรีเมียมทั้งหมดของเรา!

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