สลับเมนู

โมดูล North Commerce สำหรับ Beaver Builder

เผยแพร่แล้ว: 2024-08-24

ส่วนลด 25% สำหรับผลิตภัณฑ์ Beaver Builder ทั้งหมด... รีบเลย การลดราคาจะสิ้นสุดเร็วๆ นี้! เรียนรู้เพิ่มเติม

Beaver Builder North Commerce module
  • บีเวอร์ บิลเดอร์
  • WooCommerce

โมดูล North Commerce สำหรับ Beaver Builder

ด้วยความตื่นเต้นรอบตัว Beaver Builder 2.8 และ Box Module ใหม่ของเรา คุณอาจพลาดการประกาศของ North Commerce Module การเพิ่มนี้เปิดประตูใหม่สำหรับการแสดงองค์ประกอบ North Commerce ภายในเค้าโครง Beaver Builder ของคุณ ซึ่งมอบประสบการณ์ที่ราบรื่นสำหรับทั้งคุณและลูกค้าของคุณ

โมดูล North Commerce เป็นโมดูล Beaver Builder ที่ให้คุณแสดงองค์ประกอบ North Commerce บนเว็บไซต์ของคุณ โมดูลจะพร้อมใช้งานใน Beaver Builder UI เมื่อคุณติดตั้งปลั๊กอิน North Commerce

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

นอร์ทคอมเมิร์ซคืออะไร?

ก่อนที่จะเจาะลึกรายละเอียดของโมดูล North Commerce สิ่งสำคัญคือต้องเข้าใจว่า North Commerce คืออะไร และสามารถช่วยกลยุทธ์อีคอมเมิร์ซของคุณได้อย่างไร:

North Commerce เป็นปลั๊กอินอีคอมเมิร์ซแบบครบวงจรใหม่สำหรับ WordPress ออกแบบมาเพื่อช่วยให้ผู้ใช้สร้างร้านค้าออนไลน์ที่มีประสิทธิภาพสูงและช่องทางการขาย

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

คุณสมบัติที่สำคัญของการค้าภาคเหนือ:

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

North Commerce มุ่งหวังที่จะมอบประสบการณ์อีคอมเมิร์ซที่ราบรื่นและมีประสิทธิภาพภายใน WordPress ช่วยให้การสร้าง จัดการ และเพิ่มประสิทธิภาพร้านค้าออนไลน์ง่ายขึ้น

ขอแนะนำโมดูล North Commerce ของ Beaver Builder

การเพิ่ม โมดูล North Commerce ช่วยให้คุณสามารถแสดงองค์ประกอบ North Commerce ได้โดยตรงภายในเค้าโครง Beaver Builder ของคุณ ซึ่งนำเสนอวิธีที่ง่ายกว่าในการสร้างหน้าอีคอมเมิร์ซ:

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

ประโยชน์ของโมดูลการค้าภาคเหนือ:

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

วิธีใช้โมดูล Beaver Builder North Commerce

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

ขั้นตอนที่ 1: ติดตั้งปลั๊กอินที่จำเป็น

ก่อนเริ่มต้น ตรวจสอบให้แน่ใจว่าคุณได้ติดตั้งและเปิดใช้งานปลั๊กอินต่อไปนี้บนเว็บไซต์ WordPress ของคุณ:

ติดตั้งปลั๊กอินที่จำเป็น Beaver Builder ตัวสร้างเพจ + North Commerce
  • Beaver Builder Page Builder : เครื่องมือสร้างเพจแบบลากและวางที่ยืดหยุ่นสำหรับ WordPress ที่ช่วยให้ผู้ใช้สามารถสร้างเลย์เอาต์และการออกแบบที่กำหนดเองโดยไม่ต้องเขียนโค้ด
  • ปลั๊กอิน North Commerce : ปลั๊กอินอีคอมเมิร์ซ WordPress แบบครบวงจรที่ออกแบบมาเพื่อช่วยให้ผู้ใช้สร้างร้านค้าออนไลน์ที่มีประสิทธิภาพสูงโดยเน้นที่ความเร็วและความสะดวกในการใช้งาน
  • Beaver Themer (เป็นทางเลือก) : ตัวสร้างธีมสำหรับ Beaver Builder ที่อนุญาตให้ผู้ใช้สร้างส่วนหัว ส่วนท้าย หน้าผลิตภัณฑ์ และเค้าโครงเนื้อหาแบบไดนามิกสำหรับไซต์ WordPress ทั้งหมดของตน

เมื่อติดตั้งปลั๊กอินเหล่านี้แล้ว คุณก็พร้อมที่จะเริ่มสร้างไซต์อีคอมเมิร์ซของคุณ

ขั้นตอนที่ 2: เพิ่มโมดูล North Commerce ลงในเพจของคุณ

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

ในแถบค้นหา ให้พิมพ์ “ North Commerce ” เพื่อค้นหาโมดูลอย่างรวดเร็ว เมื่อคุณพบแล้ว เพียงลากและวางโมดูล North Commerce ไปยังตำแหน่งที่คุณต้องการบนหน้า:

โมดูล North Commerce ของ Beaver Builder

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

ขั้นตอนที่ 3: กำหนดค่าโมดูล North Commerce

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

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

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

ต่อไป เราจะสำรวจตัวเลือกเค้าโครงแต่ละรายการและให้คำแนะนำในการกำหนดค่าสำหรับร้านค้าของคุณ

หน้าสินค้า

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

เลือก หน้าผลิตภัณฑ์ จากดรอปดาวน์เค้าโครง จากนั้นป้อน Product Slug เพื่อแสดงรายการเฉพาะ:

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

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

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

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

หากต้องการแสดงผลิตภัณฑ์หลายรายการในหน้าเดียว ให้ใช้ตัวเลือก แกลเลอรีผลิตภัณฑ์ ในโมดูล North Commerce คุณลักษณะนี้เหมาะอย่างยิ่งสำหรับการสร้างหน้าหมวดหมู่หรือภาพรวมผลิตภัณฑ์ที่ดึงดูดสายตา

เลือก แกลเลอรีผลิตภัณฑ์ จากฟิลด์ เค้าโครง :

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

เค้าโครงแกลเลอรีผลิตภัณฑ์ดึงดูดลูกค้าด้วยการแสดงผลิตภัณฑ์หลายรายการพร้อมกัน ช่วยให้พวกเขาค้นหาสิ่งที่ต้องการได้ง่ายขึ้น

สไลเดอร์สินค้า

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

หากต้องการสร้างตัวเลื่อนผลิตภัณฑ์ ให้เลือก ตัวเลื่อนผลิตภัณฑ์ จากเมนูแบบเลื่อนลงช่อง เค้าโครง :

เค้าโครงตัวเลื่อนผลิตภัณฑ์โมดูล North Commerce

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

ชำระเงิน

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

หากต้องการใช้คุณลักษณะนี้ เพียงเลือก ชำระเงิน ในช่อง เค้าโครง :

เค้าโครงการชำระเงินผลิตภัณฑ์ของโมดูล North Commerce

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

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

รถเข็น

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

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

โครงร่างตะกร้าสินค้าของโมดูล North Commerce

อ่านต่อเพื่อเรียนรู้วิธีปรับแต่งค่าเริ่มต้นของตะกร้าสินค้า North Commerce และหน้าชำระเงินให้เหมาะกับความต้องการของคุณมากขึ้น

ขั้นตอนที่ 4: ปรับแต่งเค้าโครงของคุณ

หลังจากเลือกเค้าโครงแล้ว คุณสามารถปรับแต่งลักษณะที่ปรากฏขององค์ประกอบอีคอมเมิร์ซของคุณเพิ่มเติมได้

ในป๊อปอัปการตั้งค่า คลิกแท็บ สไตล์ :

การตั้งค่าสไตล์โมดูล North Commerce

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

สไตล์ปุ่ม

  • รูปแบบเริ่มต้น : ตั้งค่าลักษณะของปุ่มให้อยู่ในสถานะปกติ
  • สไตล์การวางเมาส์ : ปรับแต่งลักษณะของปุ่มเมื่อวางเมาส์เหนือ

ตัวเลือกสี

  • สีข้อความ : เลือกสีสำหรับข้อความของปุ่ม
  • Icon Color : กำหนดสีสำหรับไอคอนปุ่ม
  • สีพื้นหลัง : เลือกสีพื้นหลังของปุ่ม

ขอบปุ่ม

  • การจัดรูปแบบเส้นขอบ : ปรับแต่งเส้นขอบของปุ่ม
  • Hover Border : จัดรูปแบบเส้นขอบของปุ่มสำหรับสถานะโฮเวอร์

จากนั้นไปที่แท็บ ขั้นสูง :

การตั้งค่าขั้นสูงของโมดูล North Commerce

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

บทสรุป

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

จดหมายข่าวของเรา

จดหมายข่าวของเราเขียนและส่งออกเป็นการส่วนตัวประมาณเดือนละครั้ง มันไม่ได้น่ารำคาญหรือสแปมแม้แต่น้อย
เราสัญญา

เข้าร่วมจดหมายข่าว

ลองใช้ Beaver Builder วันนี้

Beaver Builder