วิธีสร้างรายการราคาใน WordPress (ไม่ต้องใช้รหัส)
เผยแพร่แล้ว: 2023-01-19คุณกำลังมองหาบทช่วยสอนง่ายๆ เกี่ยวกับวิธีสร้างรายการราคาใน WordPress หรือไม่?
การแสดงราคาที่ชัดเจนและรัดกุมบนเว็บไซต์ WordPress ของคุณจะช่วยให้ผู้เยี่ยมชมค้นหาราคาของคุณและตัดสินใจซื้อได้ง่าย
มีหลายวิธีในการแสดงราคาสินค้าและบริการบนเว็บไซต์ WordPress ของคุณ คุณสามารถใช้โค้ดที่กำหนดเอง ปลั๊กอิน WordPress หรือธีม WordPress แบบพรีเมียม
แต่ในบทความนี้ เราจะแสดงวิธีทำรายการราคาใน WordPress โดยไม่ต้องแตะโค้ดแม้แต่บรรทัดเดียว
ทำไมเว็บไซต์ของคุณควรมีรายการราคา?
ผู้ซื้อส่วนใหญ่จะศึกษาราคาก่อนที่จะมีงบประมาณ ดังนั้นการแสดงรายการราคาฟรีแลนซ์ ต้นทุนเมนูร้านอาหาร หรืออัตราค่าร้านเสริมสวยจะช่วยให้ผู้มีโอกาสเป็นลูกค้าเปรียบเทียบค่าใช้จ่ายก่อนตัดสินใจเลือกทางออกที่ดีที่สุด
นอกจากนี้ การแสดงรายการราคาสำหรับธุรกิจขนาดเล็กของคุณนั้นยอดเยี่ยมสำหรับประสบการณ์ของลูกค้า
หากผู้ใช้จำเป็นต้องคลิกผ่านหน้าเว็บจำนวนนับไม่ถ้วนเพื่อค้นหาข้อมูลราคา มีโอกาสสูงที่ผู้ใช้จะยอมแพ้และเลิกใช้ อย่างไรก็ตาม หากราคาของคุณหาได้ง่าย ผู้ซื้อสามารถตัดสินใจซื้อได้อย่างรวดเร็ว หลีกเลี่ยงการเสียเวลาในขณะที่ลดอัตราตีกลับเว็บไซต์ของคุณ
สุดท้าย หากคุณกังวลว่าคู่แข่งทราบรายละเอียดราคาของคุณ ก็ไม่ต้องกังวล เป็นไปได้ว่าพวกเขารู้อัตราของคุณแล้ว นอกจากนี้ หากผลิตภัณฑ์หรือบริการของคุณมีคุณภาพสูงและตอบสนองความต้องการของกลุ่มเป้าหมาย คุณจะยังคงดึงดูดลูกค้าที่เหมาะสมได้
เมื่อทราบแล้ว คุณจะสร้างรายการราคาใน WordPress ได้อย่างไร เราจะพูดต่อไป
วิธีสร้างรายการราคาใน WordPress
ก่อนที่เราจะเริ่ม เรามาอธิบายความแตกต่างระหว่างรายการราคาและตารางราคากันก่อน
ตารางราคาเป็นวิธีที่ได้รับความนิยมสำหรับบริษัท SaaS และธุรกิจที่คล้ายคลึงกันในการแสดงแผนการกำหนดราคาที่แตกต่างกัน คุณคงคุ้นเคยกับรูปลักษณ์ของมัน:

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

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

SeedProd เป็นปลั๊กอินตัวสร้างเพจแบบลากและวางที่เป็นมิตรต่อผู้เริ่มต้นมากที่สุดสำหรับ WordPress มันทำให้การสร้างการออกแบบและเลย์เอาต์หน้า WordPress แบบกำหนดเองเป็นเรื่องง่ายด้วยอินเทอร์เฟซแบบลากและวางที่ใช้งานง่าย (ไม่จำเป็นต้องเขียนโค้ด)
ด้วยเครื่องมือสร้างบล็อกเชิงโต้ตอบและเทมเพลตที่สร้างไว้ล่วงหน้า คุณสามารถเพิ่มรายการราคาที่มีสไตล์ให้กับเว็บไซต์ของคุณได้ภายในไม่กี่นาที
SeedProd ยังมีคุณสมบัติดังต่อไปนี้:
- เครื่องมือสร้างธีม WordPress
- WooCommerce รองรับร้านค้าออนไลน์ของคุณ
- เทมเพลตเว็บไซต์อีคอมเมิร์ซ
- เร็ว ๆ นี้และโหมดการบำรุงรักษา
- แดชบอร์ดการจัดการสมาชิก
- ตัวเลือกการปรับแต่งที่กว้างขวาง
- การผสานรวมการตลาดผ่านอีเมล
- รองรับปลั๊กอิน SEO
- และอีกมากมาย
ทำตามขั้นตอนง่าย ๆ ด้านล่างเพื่อเรียนรู้วิธีสร้างรายการราคาใน WordPress ด้วย SeedProd
- ขั้นตอนที่ 1 ติดตั้งและเปิดใช้งาน SeedProd
- ขั้นตอนที่ 2 เลือก The Theme หรือ Landing Page Builder
- ขั้นตอนที่ 3 เลือกเทมเพลตที่กำหนดเอง
- ขั้นตอนที่ 4 ปรับแต่งหน้ารายการราคาของคุณ
- ขั้นตอนที่ 5 เผยแพร่หน้ารายการราคาของคุณ
ขั้นตอนที่ 1 ติดตั้งและเปิดใช้งาน SeedProd
ขั้นตอนแรกคือไปที่เว็บไซต์ SeedProd และดาวน์โหลดปลั๊กอิน คุณสามารถเลือกแผนการกำหนดราคาได้หลายแบบเพื่อให้เหมาะกับงบประมาณของคุณ แต่เราใช้รุ่น SeedProd Pro สำหรับบทช่วยสอนนี้
จากนั้น ติดตั้งและเปิดใช้งานไฟล์ zip ของปลั๊กอินบนเว็บไซต์ WordPress ของคุณ คุณสามารถติดตามโพสต์นี้เกี่ยวกับวิธีติดตั้งปลั๊กอิน WordPress หากนี่เป็นครั้งแรกที่คุณทำเช่นนี้
เมื่อเปิดใช้งานปลั๊กอิน ให้ไปที่หน้า SeedProd » การตั้งค่า และวางรหัสใบอนุญาตของคุณ คุณสามารถค้นหารหัสใบอนุญาตได้ในบัญชี SeedProd ของคุณภายใต้ส่วนดาวน์โหลด

ดำเนินการต่อและคลิกปุ่ม ยืนยันรหัส
ขั้นตอนที่ 2 เลือก The Theme หรือ Landing Page Builder
มีหลายวิธีในการปรับแต่งไซต์ WordPress ของคุณด้วยปลั๊กอินตัวสร้างเพจของ SeedProd
คุณสามารถแทนที่การออกแบบไซต์ที่มีอยู่ด้วยการออกแบบใหม่โดยสร้างธีม WordPress แบบกำหนดเอง หรือคุณสามารถคงการออกแบบปัจจุบันของคุณไว้และสร้างหน้า Landing Page แบบสแตนด์อโลนด้วยเครื่องมือสร้างหน้า Landing Page
ไม่ว่าคุณจะเลือกโซลูชันใด คุณยังคงสามารถใช้บล็อกรายการราคาของ SeedProd เพื่อแสดงรายการราคาที่กำหนดเองบนเว็บไซต์ของคุณได้ เนื่องจากใช้อินเทอร์เฟซตัวสร้างเพจเดียวกัน
สำหรับคำแนะนำนี้ เราจะเลือกตัวเลือก Theme Builder ดังนั้นให้ไปที่ SeedProd » Theme Builder แล้วคลิกปุ่ม Theme Template Kits

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

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

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

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

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


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

เราจะปรับแต่งหน้า "การรับประทานอาหาร" เพื่อแสดงวิธีใช้คุณลักษณะรายการราคาของ SeedProd วางเมาส์เหนือหน้าแล้วคลิกลิงก์ แก้ไขด้วย SeedProd
ขั้นตอนที่ 4 ปรับแต่งหน้ารายการราคาของคุณ
เมื่อคุณเปิดหน้าใด ๆ ด้วย SeedProd คุณจะเห็นเลย์เอาต์ดังนี้:

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

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

บล็อกจะเพิ่มเนื้อหาบางส่วนเพื่อให้คุณเห็นภาพว่าสิ่งต่างๆ จะเป็นอย่างไร ดังนั้นเรามาเพิ่มรายการราคาในรายการกัน

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

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

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

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

คุณยังสามารถปรับระยะห่าง เส้นขอบ สีพื้นหลัง และการมองเห็นบนเดสก์ท็อปและอุปกรณ์มือถือ และคุณไม่จำเป็นต้องเขียน CSS หรือ HTML ที่กำหนดเอง

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

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

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

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

แค่นั้นแหละ!
เราหวังว่าบทความนี้จะช่วยให้คุณเรียนรู้วิธีสร้างรายการราคาใน WordPress
SeedProd เป็นปลั๊กอิน WordPress ที่ดีที่สุดสำหรับปรับแต่งเว็บไซต์ของคุณ คุณไม่จำเป็นต้องมีรหัสย่อ วิดเจ็ต หรือส่วนเสริมใดๆ เพิ่มเติม เพียงแค่เครื่องมือสร้างเพจที่ตรงไปตรงมาและใช้งานง่าย ซึ่งช่วยให้คุณเริ่มต้นใช้งานได้อย่างรวดเร็ว
พร้อมที่จะสร้างรายการราคา WordPress แบบกำหนดเองแล้วหรือยัง
คุณอาจชอบรีวิว Elementor vs WPBakery vs SeedProd นี้ด้วย เพื่อดูว่าพวกเขาเปรียบเทียบกันอย่างไร
ขอบคุณที่อ่าน. โปรดติดตามเราบน YouTube, Twitter และ Facebook สำหรับเนื้อหาที่เป็นประโยชน์เพิ่มเติมในการขยายธุรกิจของคุณ