Visual Composer เทียบกับ Beaver Builder

เผยแพร่แล้ว: 2015-08-30

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

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

Visual Composer เป็นปลั๊กอิน WordPress ที่กำหนดว่าเครื่องมือสร้างเพจแบบลากและวางคืออะไร และยังคงเป็นเครื่องมือสร้างเพจแบบลากและวางที่ขายดีที่สุดสำหรับ WordPress Beaver Builder เป็นโซลูชันใหม่ที่พัฒนาจากจุดแข็งไปสู่จุดแข็งตั้งแต่เปิดตัวในปี 2014 และกำลังสร้างชื่อให้กับตัวเองในปีนี้

วิธีแก้ปัญหาที่ยอดเยี่ยมเหล่านี้เปรียบเทียบได้อย่างไร มาดูกันดีกว่าว่า

นักแต่งเพลงภาพ

Visual Composer ไม่เพียง แต่เป็นปลั๊กอิน WordPress ที่ขายดีที่สุดบน CodeCanyon เท่านั้น แต่ยังรวมอยู่ในธีม WordPress จำนวนมากบน ThemeForest สิ่งนี้ช่วยอธิบายได้ว่าทำไมจึงมีการใช้ปลั๊กอินนี้ในเว็บไซต์กว่า 500,000 แห่ง

Visual Composer ช่วยให้คุณสร้างเลย์เอาต์ที่ตอบสนองได้ภายในไม่กี่นาทีโดยใช้อินเทอร์เฟซที่ใช้งานง่าย ช่วยให้คุณสร้างเค้าโครงในแบ็กเอนด์หรือส่วนหน้าของเว็บไซต์ของคุณ ใช้งานได้กับธีม WordPress และรองรับ WordPress Multisite และ WooCommerce

ชุดภาษามากกว่าสิบชุดรวมอยู่ในปลั๊กอินและรองรับปลั๊กอิน WordPress Multilingual องค์ประกอบเนื้อหาและเค้าโครงที่กำหนดไว้ล่วงหน้าจำนวนมากถูกรวมเข้ากับปลั๊กอินด้วย

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

หนึ่งในคุณสมบัติที่ยอดเยี่ยมที่สุดของ Visual Composer คือความยืดหยุ่น มีตัวเลือกนักพัฒนามากมายในปลั๊กอินและมีโปรแกรมเสริมมากกว่าหนึ่งร้อยรายการใน CodeCanyon

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

การใช้ Visual Composer

เมื่อติดตั้ง Visual Composer แล้ว คุณจะเห็นแถบ Visual Composer ใหม่ในหน้าจอการแก้ไขของคุณ ตัวหนึ่งโหลดตัวแก้ไขแบ็กเอนด์ อีกตัวโหลดตัวแก้ไขส่วนหน้า (แถบนี้จะปรากฏขึ้นแม้ว่าคุณจะปิดการใช้งานตัวแก้ไขภาพ WordPress ไว้)

ปุ่ม Visual Composer Editor

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

ที่ด้านบนของอินเทอร์เฟซมีปุ่มห้าปุ่ม: สามปุ่มทางด้านซ้ายและสองปุ่มทางด้านขวา

ทางด้านซ้าย ไอคอน Visual Composer จะนำคุณไปยังเว็บไซต์ปลั๊กอินอย่างเป็นทางการ สัญลักษณ์บวกช่วยให้คุณเพิ่มองค์ประกอบในหน้าของคุณ และไอคอน T จะเปิดกล่องเทมเพลตขึ้นมา ทางด้านขวาจะมีไอคอนการกำหนดค่าที่เปิดกล่องสำหรับเพิ่มโค้ด CSS ที่กำหนดเองและปุ่มเพื่อสลับไปยังตัวแก้ไขส่วนหน้า

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

ตัวแก้ไขแบ็กเอนด์

ในบทความเปรียบเทียบเครื่องมือสร้างหน้าลากและวางของ WordPress ฉันสังเกตว่าโมดูลเนื้อหามีหลายชื่อ นักพัฒนาบางคนเรียกมันว่าโมดูล บางคนเรียกมันว่าบล็อค คนอื่นเรียกมันว่าวิดเจ็ต Visual Composer เรียกพวกมันว่าองค์ประกอบ พวกเขาทั้งหมดอ้างถึงกลุ่มเนื้อหาเล็กๆ ที่ช่วยคุณสร้างเลย์เอาต์ของคุณ

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

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

รายการองค์ประกอบ Visual Composer

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

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

ตัวอย่างการจัดวางเลย์เอาต์

มีการตั้งค่ามากมายสำหรับทั้งคอลัมน์และแถว

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

การตั้งค่าแถว Visual Composer

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

การตั้งค่าตัวเลื่อนโพสต์

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

กล่องเทมเพลต Visual Composer

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

แก้ไขด้วย Visual Composer

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

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

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

ตัวแก้ไขส่วนหน้าของ Visual Composer

ฉันพบว่าตัวแก้ไขแบ็กเอนด์ของ Visual Composer นั้นใช้งานง่ายกว่าตัวแก้ไขส่วนหน้าเสมอ ฉันสามารถสร้างงานออกแบบระดับมืออาชีพได้ในเวลาไม่กี่นาทีโดยใช้ตัวแก้ไขแบ็กเอนด์ แต่ด้วยตัวแก้ไขส่วนหน้า ฉันรู้สึกว่าการย้ายสิ่งต่าง ๆ ไปรอบๆ นั้นเกะกะและลื่นไหลน้อยลง มันยังคงใช้งานได้ตามปกติ แต่ก็ไม่รู้สึกว่าเป็นมิตรกับผู้ใช้เลย

อย่างไรก็ตาม ฉันรู้จากการอ่านความคิดเห็นของผู้ใช้ Visual Composer คนอื่น ๆ ที่หลายคนชอบใช้ตัวแก้ไขส่วนหน้าไปยังตัวแก้ไขส่วนหลัง ดังนั้นอาจเป็นเรื่องว่าคุณเคยใช้อินเทอร์เฟซใด (ตัวแก้ไขส่วนหน้าได้รับการแนะนำใน Visual Composer ในภายหลัง ดังนั้นฉันจึงมีประสบการณ์กับตัวแก้ไขแบ็กเอนด์มากขึ้น)

การตั้งค่า Visual Composer

พื้นที่ Visual Composer Settings ช่วยให้คุณสามารถปรับเปลี่ยนคุณลักษณะและตัวเลือกต่างๆ มากมาย

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

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

การตั้งค่าทั่วไปของ Visual Composer

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

ตัวเลือกการออกแบบ Visual Composer

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

Visual Composer CSS ที่กำหนดเอง

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

ใบอนุญาตผลิตภัณฑ์ Visual Composer

รหัสย่อที่ปลั๊กอินของบุคคลที่สามให้มาสามารถจับคู่กับองค์ประกอบเนื้อหา Visual Composer ได้

Visual Composer รหัสย่อของฉัน

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

ยินดีต้อนรับสู่ Visual Composer

ตัวสร้างกริดขั้นสูง

Visual Composer ให้คุณเพิ่มองค์ประกอบกริดใหม่สำหรับองค์ประกอบเนื้อหาต่อไปนี้: โพสต์กริด, โพสต์ตารางการก่ออิฐ, กริดสื่อ และกริดสื่อสำหรับก่ออิฐ สิ่งเหล่านี้คือองค์ประกอบเนื้อหาที่สามารถใช้เพื่อแสดงโพสต์บล็อก แกลเลอรี่ และเนื้อหาอื่นๆ ในเว็บไซต์ของคุณ

ตัวสร้างกริดขั้นสูง

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

ราคา Visual Composer

Visual Composer ขายปลีกในราคาเพียง $34 ไม่มีค่าธรรมเนียมการต่ออายุรายปี เมื่อคุณซื้อปลั๊กอินแล้ว คุณสามารถรับการสนับสนุนและอัปเดตได้อย่างไม่มีกำหนด

โปรดทราบว่าเพื่อให้มีคุณสมบัติรับการสนับสนุนและการอัปเดตอัตโนมัติ คุณต้องป้อนรหัสใบอนุญาตในพื้นที่การตั้งค่า

ในทางเทคนิค Visual Composer ไม่เป็นมิตรกับ GPL แม้ว่าที่จริงแล้ว WordPress จะไม่อนุญาตให้มีการจำกัดการใช้งาน แต่นักพัฒนาขอให้ลูกค้าทุกคนซื้อใบอนุญาตปกติสำหรับแต่ละเว็บไซต์ที่พวกเขาใช้ Visual Composer

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

ตัวสร้างบีเวอร์ ตัวสร้างหน้าลากและวาง

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

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

Beaver มีการสนับสนุนที่ดีสำหรับ WooCommerce และ WordPress Multilingual Plugin และควรใช้งานได้กับธีม WordPress เกือบทุกแบบ นอกจากนี้ยังรองรับ WordPress Multisite แต่น่าเสียดายที่ฟีเจอร์นี้ไม่รวมอยู่ในใบอนุญาตมาตรฐานของ Beaver Builder (เพิ่มเติมเกี่ยวกับตัวเลือกราคาในภายหลัง)

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

ใบอนุญาตราคาสูงกว่าของ Beaver Builder ยังมาพร้อมกับธีม Beaver Builder WordPress

การใช้ตัวสร้างบีเวอร์

Beaver Builder ทำงานร่วมกับ WordPress ในลักษณะเดียวกับ Visual Composer เมื่อเปิดใช้งานปลั๊กอินแล้ว คุณสามารถโหลดตัวแก้ไขได้โดยคลิกที่แท็บ "ตัวสร้างหน้า" ในเครื่องมือแก้ไขบทความของคุณ

ปุ่มตัวแก้ไขตัวสร้างบีเวอร์

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

แก้ไขด้วย Page Builder

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

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

แม่แบบสร้างบ้านบีเวอร์

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

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

เทมเพลตเนื้อหาตัวสร้างบีเวอร์

Beaver Builder มีอินเทอร์เฟซที่ใช้งานง่ายซึ่งใช้เวลาทำความเข้าใจไม่นาน

ในแถบผู้ดูแลระบบจะมีลิงก์ที่ด้านบนขวา: เทมเพลต เครื่องมือ เสร็จสิ้น และไอคอนวิธีใช้ ทางด้านขวามือจะมีเมนูแบบเลื่อนลงสำหรับเค้าโครงแถว โมดูลพื้นฐาน โมดูลขั้นสูง และวิดเจ็ต WordPress

อินเทอร์เฟซตัวสร้างบีเวอร์

ปุ่มเทมเพลตจะโหลดกล่องเทมเพลตเลย์เอาต์ที่ฉันไฮไลต์ไว้ก่อนหน้านี้

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

ปุ่มเครื่องมือสร้างบีเวอร์

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

การตั้งค่าตัวสร้างเพจ

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

ปุ่มเสร็จสิ้นตัวสร้างบีเวอร์

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

ไอคอนวิธีใช้ตัวสร้างบีเวอร์

ฉันแนะนำให้คุณไปทัวร์เมื่อคุณโหลด Beaver Builder ขึ้นเป็นครั้งแรก จะให้ภาพรวมที่ดีว่าทุกอย่างทำงานอย่างไร

ตัวอย่างทัวร์ Beaver Builder

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

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

เค้าโครงแถวตัวสร้างบีเวอร์

คุณสามารถลบ ทำซ้ำ หรือย้ายแถวได้ คุณยังสามารถแก้ไขการตั้งค่าแถวได้อีกด้วย

การลบคอลัมน์จะลดจำนวนแถวในแถวนั้นโดยอัตโนมัติ ตัวอย่างเช่น ลดขนาดจากสามคอลัมน์เป็นสองคอลัมน์ เป็นต้น

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

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

การตั้งค่าคอลัมน์ตัวสร้างบีเวอร์

โมดูลเนื้อหาพื้นฐานมีห้าโมดูล: หัวเรื่อง ภาพถ่าย ตัวคั่น โปรแกรมแก้ไขข้อความ และวิดีโอ

โมดูลพื้นฐานของตัวสร้างบีเวอร์

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

การตั้งค่าภาพถ่ายตัวสร้างบีเวอร์

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

เพิ่มเนื้อหาไปยัง Beaver Builder

มีโมดูลขั้นสูงยี่สิบสองโมดูล ซึ่งรวมถึงโพสต์ accordion ตัวเลื่อน ตารางราคา และแบบฟอร์มการสมัครใช้งาน

โมดูลขั้นสูงของ Beaver Builder

วิดเจ็ต WordPress เริ่มต้นสิบสองรายการก็มีให้เช่นกัน ทำให้จำนวนโมดูลเนื้อหาทั้งหมดเป็น 39 โมดูล

วิดเจ็ต WordPress ตัวสร้างบีเวอร์

เมื่อคุณสร้างเพจแล้ว คุณควรบันทึกฉบับร่างหรือเผยแพร่หน้า ฉันยังแนะนำให้บันทึกเค้าโครงของคุณเป็นเทมเพลต

บันทึกเทมเพลตตัวสร้างบีเวอร์ของคุณ

ธีมตัวสร้างบีเวอร์

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

ในช่วงไม่กี่ปีที่ผ่านมา WordPress ได้สนับสนุนให้นักพัฒนาธีมรวมตัวปรับแต่งธีม WordPress เข้ากับการออกแบบของพวกเขา อัตราการนำไปใช้นั้นช้า โดยผู้พัฒนาธีมส่วนใหญ่ยังคงใช้หน้าการตั้งค่าธีมของตนเอง

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

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

ธีมตัวสร้างบีเวอร์

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

สไตล์ส่วนหัว

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

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

ธีมที่ตั้งไว้ล่วงหน้า

แม้ว่าธีม Beaver Builder จะเป็นส่วนเสริมที่ดี แต่ก็ขาดคุณสมบัติและความพิเศษที่ธีม WordPress สมัยใหม่ส่วนใหญ่มีให้ สำหรับเงินพิเศษที่ Beaver Builder ต้องการสำหรับธีมนี้ คุณควรซื้อธีม WordPress แบบ all-in-one เช่น Divi จะดีกว่า เพราะมันมีอะไรอีกมากมาย

การตั้งค่าตัวสร้างเพจ

พื้นที่การตั้งค่าสำหรับปลั๊กอิน Beaver Builder จะแสดงอยู่ในหน้าเดียว สิบส่วนจะแสดงในเมนู

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

การตั้งค่าใบอนุญาตตัวสร้างบีเวอร์

โมดูลพื้นฐานและขั้นสูงทั้งหมดสามารถปิดใช้งานได้จากส่วนโมดูล

การตั้งค่าโมดูลตัวสร้างบีเวอร์

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

การตั้งค่าโมดูลตัวสร้างบีเวอร์

ในส่วนเทมเพลต คุณสามารถเปิดใช้งานเทมเพลตทั้งหมด เปิดใช้งานเทมเพลตหลักเท่านั้น เปิดใช้งานเทมเพลตผู้ใช้ (เช่น เทมเพลตที่คุณบันทึกไว้) และปิดใช้งานเทมเพลตทั้งหมด

นอกจากนี้ยังมีตัวเลือกในการแก้ไขเทมเพลตตัวสร้างเพจในพื้นที่ผู้ดูแลระบบและเพื่อแทนที่เทมเพลตหลัก

การตั้งค่าเทมเพลตตัวสร้างบีเวอร์

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

การตั้งค่าประเภทโพสต์ตัวสร้างบีเวอร์

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

การตั้งค่าไอคอนตัวสร้างบีเวอร์

ในส่วนการแก้ไข คุณสามารถกำหนดระดับความสามารถของ WordPress ที่จำเป็นในการแก้ไข Beaver Builder

การตั้งค่าการแก้ไขตัวสร้างบีเวอร์

การติดฉลากสีขาวมีให้สำหรับผู้ที่ซื้อใบอนุญาตตัวแทนของ Beaver Builder คุณสามารถป้อนแบรนด์ของคุณเองและกำหนดไอคอนบริษัทของคุณเองได้

การตั้งค่าการสร้างแบรนด์ Beaver Builder

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

การตั้งค่าปุ่มช่วยเหลือตัวสร้างบีเวอร์

หากคุณได้โอนเว็บไซต์ของคุณไปยังแผนโฮสติ้งใหม่ คุณอาจต้องล้างแคชของปลั๊กอิน

การตั้งค่าแคชตัวสร้างบีเวอร์

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

ถอนการติดตั้ง Beaver Builder

อย่างที่คุณเห็น Beaver Builder มีตัวเลือกที่มีประโยชน์มากมายให้กำหนดค่าในหน้าการตั้งค่า สิ่งหนึ่งที่ฉันคิดว่าจำเป็นจริงๆ คือความสามารถในการแก้ไขการอนุญาตตามบทบาทของผู้ใช้ (เป็นสิ่งที่ Visual Composer มี)

ราคาตัวสร้างบีเวอร์

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

ใบอนุญาตทั้งหมดอนุญาตให้คุณใช้ Beaver Builder กับเว็บไซต์ได้ไม่จำกัดจำนวนนานเท่าที่คุณต้องการ การสนับสนุนและการอัปเดตมีให้สำหรับปี และปีต่อๆ ไปมีให้ในอัตราส่วนลด 40% ของราคาเดิม (แม้ว่าคุณจะใช้ปลั๊กอินต่อไปได้หากคุณไม่ต่ออายุ)

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

ราคาตัวสร้างบีเวอร์

ใบอนุญาตมาตรฐานสำหรับ Beaver Builder ขายปลีกที่ 99 ดอลลาร์ ใบอนุญาตนี้มีสำเนาปลั๊กอิน Beaver Builder ฉบับสมบูรณ์ แต่ไม่มีธีม WordPress ของ Beaver Builder หรือการรองรับ WordPress Multisite หากต้องการรับสองส่วนเพิ่มเติมนี้ คุณต้องอัปเกรดเป็นสิทธิ์ใช้งานแบบมืออาชีพซึ่งมีราคา 199 ดอลลาร์

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

เว้นแต่ว่าคุณต้องการการสนับสนุนสำหรับ WordPress Multisite ฉันเชื่อว่าใบอนุญาตมาตรฐานที่ 99 ดอลลาร์จะให้ทุกสิ่งที่คุณต้องการเนื่องจากธีม Beaver Builder ไม่คุ้มที่จะจ่ายเพิ่มอีก 100 ดอลลาร์

Visual Composer vs Beaver Builder: สรุป

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

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

หากคุณต้องการสร้างเลย์เอาต์ในส่วนแบ็คเอนด์ของเว็บไซต์ของคุณ Visual Composer เป็นตัวเลือกสำหรับคุณเนื่องจาก Beaver Builder ไม่มีฟังก์ชันนี้

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

เพื่อช่วยคุณตัดสินใจ ให้เราสรุปข้อดีข้อเสียของปลั๊กอินทั้งสองอย่างรวดเร็ว

ผู้เชี่ยวชาญด้าน Visual Composer

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

Visual Composer ข้อเสีย

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

ข้อดีตัวสร้างบีเวอร์

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

ข้อเสียของตัวสร้างบีเวอร์

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

ฉันหวังว่าคุณจะพบว่าบทความเปรียบเทียบนี้มีประโยชน์ หากต้องการข้อมูลเพิ่มเติมเกี่ยวกับปลั๊กอิน WordPress เหล่านี้ โปรดไปที่หน้าข้อมูลสำหรับ Visual Composer และ Beaver Builder

ขอบคุณที่อ่าน.

เควิน