วิธีใช้ปุ่มซื้อ Shopify เปลี่ยนเว็บไซต์เป็นร้านออนไลน์

คุณสามารถใช้ Shopify เพื่อขายสินค้าออนไลน์ได้ แม้คุณจะไม่ต้องการสร้างร้านค้าออนไลน์เต็มรูปแบบก็ตาม

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

ด้านล่างนี้คือวิธีฝังปุ่มซื้อ Shopify ลงในเว็บไซต์ เพื่อให้ผู้เข้าชมสามารถเลือกซื้อสินค้าของคุณได้ทันที

ปุ่มซื้อ Shopify คืออะไร

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

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

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

เรียนรู้เพิ่มเติมเกี่ยวกับปุ่มซื้อ Shopify

วิธีใช้ปุ่มซื้อ Shopify เริ่มง่ายๆ ใน 3 ขั้นตอน

1. เพิ่มช่องทางการขายปุ่มซื้อ Shopify ลงในร้าน Shopify ของคุณ
2. สร้างปุ่มซื้อ Shopify
3. เพิ่มโค้ดฝังปุ่มซื้อ Shopify ลงใน HTML ของเว็บไซต์คุณ

1. เพิ่มช่องทางการขายปุ่มซื้อ Shopify ลงในร้าน Shopify ของคุณ

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

สร้างปุ่มซื้อบนเดสก์ท็อป

1. วิธีใช้ปุ่มซื้อ Shopify บนเดสก์ท็อป ให้ไปที่ หน้าช่องทางการขาย Buy Button ใน Shopify App Store

2. ติดตั้งแอป

3. ปักหมุดแอปในเมนูการนำทางของแอดมิน (ไม่บังคับ)

ถ้าคุณไม่ปักหมุดปุ่มซื้อ คุณยังสามารถหาได้อีกครั้งโดยคลิกที่ "Sales channels" จากนั้นเลือก "Buy Button" ใต้หัวข้อ Installed channels

สร้างปุ่มซื้อบนมือถือ

• เปิดแอป Shopify บนอุปกรณ์มือถือของคุณ แล้วเลือก "Store" จากเมนูด้านล่าง
• ถัดจาก "Sales channels" ให้เลือก "Add channel" บน iPhone หรือกดปุ่ม "+" บน Android
• เลือก "Buy Button" แล้วแตะ "Add Buy Button"

2. สร้างปุ่มซื้อ Shopify

เมื่อคุณเพิ่มช่องทางการขาย Buy Button แล้ว คุณก็พร้อมที่จะสร้างปุ่มซื้อ Shopify ของคุณได้เลย

ที่แท็บ Buy Button ให้คลิก "Create a Buy Button"

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

เลือกตัวเลือกที่ต้องการ จากนั้นเลือกสินค้าที่คุณต้องการสร้างปุ่มซื้อ Shopify ให้

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

วิธีปรับแต่งปุ่มซื้อ Shopify

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

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

นี่คือรายละเอียดของตัวเลือกที่คุณสามารถปรับแต่งได้

• ตัวเลือกสินค้าแบบแปรผัน: เลือกว่าสินค้าแบบแปรผันใดบ้างที่คุณต้องการให้สามารถซื้อผ่านปุ่มซื้อ Shopify ได้ โดยค่าเริ่มต้นจะเลือกสินค้าทุกแบบแปรผันไว้ทั้งหมด
• รูปแบบการแสดงผล: เลือกระหว่าง “Basic” “Classic” และ “Full view” ทางด้านขวาคุณจะเห็นตัวอย่างของแต่ละรูปแบบเมื่อเลือกจากเมนูดรอปดาวน์ “Layout”
• การทำงานเมื่อผู้ใช้คลิก: เลือกระหว่าง “Add product to cart” “Direct to checkout” หรือ “Open product details” ตัวเลือก “Add product to cart” จะสร้างวิดเจ็ตตะกร้าสินค้าอยู่ทางด้านขวาของหน้าจอ ตัวเลือก “Direct to checkout” จะสร้างปุ่ม Buy Now ที่พาผู้ใช้ไปยังหน้าชำระเงินโดยตรง (แต่ลูกค้าจะไม่สามารถเพิ่มสินค้ามากกว่าหนึ่งชิ้นในตะกร้าด้วยตัวเลือกนี้ได้) ตัวเลือก “Open product details” จะสร้างปุ่ม View Product ที่เปิดหน้าต่างป๊อปอัปแสดงข้อมูลสินค้าและปุ่มเพิ่มสินค้าลงตะกร้า
• สไตล์ปุ่ม: คุณสามารถปรับสี ตัวอักษร ขนาด และรูปทรงมุมของปุ่มซื้อ Shopify ได้ที่นี่
• รูปแบบการจัดวาง: เมนู Layout จะช่วยให้คุณปรับแต่งรายละเอียดเล็กๆ น้อยๆ ของการจัดวางปุ่มซื้อ Shopify ได้ คุณสามารถปรับสีตัวอักษร ข้อความบนปุ่ม และการตั้งค่าด้านตัวอักษรได้ตามต้องการ
• ตะกร้าสินค้า: คุณสามารถปรับตั้งค่าของวิดเจ็ตตะกร้าสินค้าได้ที่นี่ รวมถึงข้อความและสีต่างๆ โดยตัวเลือกนี้จะเป็นสีเทาและไม่สามารถแก้ไขได้หากคุณเลือกใช้รูปแบบ “Direct to checkout” เพราะจะไม่มีวิดเจ็ตตะกร้าแสดงผล
• หน้าต่างป๊อปอัปรายละเอียดสินค้า: หากคุณเลือก “Open product details” ในหัวข้อ “Action when people click” คุณจะสามารถปรับแต่งข้อความ สี และตัวเลือกด้านตัวอักษรของหน้าต่างป๊อปอัปได้ในส่วนนี้
• การตั้งค่าขั้นสูง: ที่นี่คุณสามารถปรับวิธีการแสดงหน้าชำระเงินให้กับลูกค้าได้ โดยเลือกได้ระหว่าง “Open pop-up window” ซึ่งจะสร้างหน้าชำระเงินแบบป๊อปอัปที่ปิดเองเมื่อทำรายการเสร็จสมบูรณ์ หรือ “Redirect in the same tab” ซึ่งจะพาผู้ใช้ไปยังหน้าชำระเงินของ Shopify และกลับมาที่หน้าของคุณเมื่อทำธุรกรรมเสร็จเรียบร้อยแล้ว

โปรดทราบว่าการปรับตั้งค่าเหล่านี้จะไม่ส่งผลกับปุ่มซื้อ Shopify ที่คุณฝังไว้ก่อนหน้านี้แล้ว

เมื่อคุณพอใจกับการออกแบบของคุณแล้ว ให้คลิกปุ่ม "Next" ที่มุมขวาบน

3. เพิ่มโค้ดฝังปุ่มซื้อ Shopify ลงใน HTML ของเว็บไซต์คุณ

เมื่อคุณคลิก "Next" โค้ดฝังปุ่มซื้อ Shopify จะถูกสร้างให้อัตโนมัติ คลิกปุ่ม "Copy Code" หากคุณพร้อมฝังปุ่มซื้อในหน้าเว็บ

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

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

การเพิ่มแท็กสคริปต์สำหรับปุ่มซื้อ Shopify

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

ถ้าจะทำแบบนี้ คุณต้องแยกแท็ก script (script element) ออกจากแท็ก div ในโค้ดฝังปุ่มซื้อ Shopify ของคุณ

คุณจะเห็นแท็ก div อยู่ส่วนบนของโค้ด มีลักษณะประมาณนี้

<div id="product-component-1655929612938"></div> 

ส่วนแท็กสคริปต์ (script element) จะเป็นส่วนที่เหลือของโค้ดฝัง เริ่มต้นด้วย script type="text/javascript" และจบด้วย /script

คัดลอกและวางแท็ก script ทั้งหมดลงในส่วนหัวของหน้าเว็บคุณ

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

เพิ่มฟีเจอร์อีคอมเมิร์ซให้กับเว็บไซต์ไหนก็ได้ด้วยปุ่มซื้อ Shopify

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

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