Beaver Builder در مقابل Visual Composer. کدام افزونه صفحه ساز بهتری است؟

در مورد تفاوت های بین Beaver Builder و Visual Composer سوالی دارید؟ بیور بیلدر و ویژوال کامپوزر افزونه های صفحه ساز وردپرس هستند که از همان ابتدا در بازار صفحه سازها بوده اند. در این مقاله به مقایسه افزونه های صفحه ساز وردپرس می پردازیم.

طی سال های گذشته هر دو محصول کاملاً دستخوش تغییراتی شده اند. در حقیقت، آن چه در گذشته به عنوان Visual Composer نامیده می شد، اکنون به عنوان WPBakery Page Builder شناخته می شود، در حالی که افزونه ویژوال کامپوزر جدید برداشت مدرن تری از صفحه ساز کلاسیک است.

ما قصد داریم  در این مقاله به مقایسه بیوربیلدر و ویژوال کامپوزر بپردازیم و آن ها را تجزیه و تحلیل کنیم و ببینیم که چگونه آن ها در چند زمینه مختلف با یکدیگر مقایسه می شوند. ما هر افزونه را معرفی خواهیم کرد، به آن چه که این صفحه ساز ها ارائه می دهد نگاه می کنیم، چند ویژگی اضافی موجود از هر راه حل را توصیف می کنیم و آن ها را بررسی می کنیم.

Beaver Builder چیست؟

Beaver Builder یک افزونه ویرایشگر بصری است که از زمان راه اندازی صفحه وردپرس در سال 2014 نو آور بوده است. در بیش از یک میلیون وب سایت مورد استفاده قرار می گیرد و دارای امتیاز متوسط 4.8 در WordPress.org است. ویرایشگر Beaver Builder دارای الگو های طرح بندی از پیش ساخته شده است، ماژول های محتوا و گزینه های سفارشی سازی برای ایجاد صفحات و پست های در این صفحه ساز خیره کننده است.

یک قالب رسمی Beaver Builder نیز با دو نسخه برتر ارائه می شود. این قالب به طور کامل با افزونه بیور بیلدر یکپارچه شده است و تنظیمات قالب برای سر صفحه ها، پاورقی ها و محتوای پست و همچنین تنظیمات برای قلم ها، رنگ ها و دکمه های پیش فرض وجود دارد که به طور پیش فرض برای افزونه Beaver Builder نیز تنظیم می شود.

Visual Composer چیست؟

تا چند سال پیش، افزونه ویژوال کامپوزر صفحه سازی بود که برای تأمین صدها قالب در بازار Envato استفاده می شد. با تغییر نام این صفحه ساز وردپرس همیشه محبوب، با اسم WPBakery Page Builder، شناخته می شود.

سپس توسعه دهندگان آن افزونه، محصول جدیدی ایجاد کردند که صفحه اصلی Visual Composer و قابلیت ساخت وب سایت را تغییر داد. توسعه دهندگان می خواستند محصول جدید با سازندگان صفحه های بصری مانند Beaver Builder بیشتر رقابت کنند و از مجوز مادام العمر Envato دور شوند تا هزینه های توسعه را به طور موثر تری کاهش دهند. آن ها این محصول جدید را علی رغم سردرگمی با نام محصول قدیمی، Visual Composer نامیدند.

مزیت اصلیویژوال کامپوزر جدید نسبت به محصول WPBakery Page Builder توانایی شخصی سازی هر قالب است که به شما امکان ایجاد و ویرایش سر صفحه ها، پاورقی ها و ستون های فرعی مضامین شخص ثالث را می دهد.

Beaver Builder  و  Visual Composer: نگاهی به ویژگی های ساخت صفحه در هر ویرایشگر

برای شروع مقایسه Beaver Builder  و  Visual Composer، بیایید هر صفحه ساز را بررسی کنیم و ببینیم که آن ها در زمینه های زیر چه راه کار هایی دارند:

• ساختار
• ماژول ها
• طراحی ظاهر
• گزینه های پیشرفته سفارشی سازی
• الگو ها

ساختار

در صفحه ساز وردپرس Beaver Builder، می توانید از ابتدا شروع کنید یا یک الگوی طرح را انتخاب کنید. اگر از الگویی استفاده می کنید، می توانید هر آن چه را دوست دارید تغییر دهید: ردیف ها و ستون ها را جا به جا کنید، عرض ستون را با استفاده از دستگیره های کشیدن، حاشیه ها و پدینگ تغییر دهید و ماژول های محتوا را هر جا که دوست دارید حذف و اضافه کنید.

اگر یک صفحه را از ابتدا ایجاد کنید، دو روش وجود دارد. با اولین رویکرد، شما یک طرح خالی از ردیف ها و ستون ها برای جایی که قصد دارید محتوای خود را در آن قرار دهید، تنظیم می کنید تا بتوانید چارچوب طرح را تجسم کنید. برای این منظور، می توانید حداکثر شش ستون با عرض های مختلف را بکشید، همانطور که در این تصویر نشان داده شده است.

شما به این انتخاب ها محدود نمی شوید. می توانید ستون ها را بعد از کشیدن تغییر اندازه دهید، لایه های ستون عمودی را در یک ردیف اضافه کنید و ستون هایی را در ستون ها ایجاد کنید.

در روش دوم، می توانید ماژول های محتوا را در یک طرح خالی بکشید و آن ها را در جایی که نیاز دارید رها کنید، ردیف ها و ستون های خود را ایجاد کنید، بنابراین می توانید بر روی محتوا تمرکز کنید و طرح خود را به سرعت ایجاد کنید.

با کوچک تر شدن اندازه صفحه، ستون ها به طور خودکار روی هم قرار می گیرند و در صورت انتخاب می توانید ترتیب نمایش را معکوس کنید یا از نشان داده شدن بعضی موارد جلوگیری کنید.

در افزونه Visual Composer، شما همچنین می توانید با مراحل ساخت از ابتدا یا با یک الگوی وارد شده شروع کنید. به شما این امکان داده می شود که از بین الگو های صفحه ای که هدر، پاورقی و نوار کناری موضوع شما را حذف می کند، آن ها را از درون قالب خود وارد می کند یا به شما امکان می دهد برای هر صفحه یک چیدمان سفارشی ایجاد کنید.

وقتی نوبت به نحوه ساخت ویرایشگر می رسد، می توانید صفحات خود را در ردیف های خود بسازید، ستون هایی را به آن ردیف ها اضافه کنید و ماژول ها یا “عناصر” را به ستون های خود اضافه کنید.

10 طرح ستون از پیش ساخته شده برای انتخاب وجود دارد، اما می توانید هر کدام را با اضافه کردن، حذف و تغییر اندازه ستون، مطابق میل خود تنظیم کنید. هنگامی که طرح را انتخاب و پیکربندی کردید، می توانید عناصر را در ستون های خود رها کنید.

ماژول ها

بیور بیلدر دارای حدود 30 ماژول محتوایی است که در شش دسته طبقه بندی شده اند. این ماژول ها کنترل زیادی به شما  می دهد تا بسیاری از مواردی که شما نیاز دارید تا طراحی پیچیده تر انجام دهید را با سلیقه خود انجام دهید.

همانطور که از تصویر بالا نشان داده شده است، ماژول های دسته Beaver Builder Basic در این صفحه ساز وردپرس به شما امکان می دهند متن، دکمه ها و اشکال مختلف رسانه را به صفحه خود اضافه کنید. همچنین یک دسته رسانه اختصاصی وجود دارد که توصیفات، نقشه، اسلایدر ها و گالری ها را ارائه می دهد.

دسته عملکرد ها (دسته برتر در تصویر بالا) با ماژول هایی طراحی شده است که بازدیدکنندگان را ترغیب می کند با کلیک کردن روی دکمه اقدام، پر کردن فرم یا اشتراک در لیست ایمیل خود، در صفحه شما اقدام کنند. در بخش Layout، که در تصویر نیز نشان داده شده است، می توانید اطلاعات را به روش های جالب بصری با جدول قیمت، آکاردئون یا برگه ها ارائه دهید. همچنین می توانید یک نوار کناری با یک گروه ویجت استاندارد وردپرس که تعریف کرده اید اضافه کنید.

گروه Info به شما امکان می دهد اعداد و شمارنده های زمان را به روشی بصری ارائه دهید. گروه Posts دارای ماژول هایی است که مجموعه ای از پست های فیلتر شده را به روش های مختلف نمایش می دهد. برای این مثال، می توانید پنج پست اول را برای یک دسته به نام News به عنوان چرخ فلک در صفحه اصلی خود نمایش دهید.

سرانجام، هر چیزی که Beaver Builder ارائه نمی دهد، به احتمال زیاد می تواند با استفاده از افزونه های شخص ثالث اضافه کنید، یا افزونه هایی که ماژول های اضافی را برای شما اضافه می کنند یا محصولی که کد کوتاه دارد و می توانید آن را در طرح های Beaver Builder وارد کنید. هنگام نصب ووکامرس، بیوربیلدر ماژول های اضافی مربوط به محصول را ارائه می دهد و گزینه های ویژه ای برای نمایش محصولات در صفحات شما دارد.

صفحه ساز وردپرس ویژوال کامپوزر صدها عنصر را ارائه می دهد، اگرچه بسیاری از آن ها تنوعی از همان نوع عناصر در سبک های مختلف هستند تا باعث صرفه جویی در وقت شما و ایده های شما شوند.

به عنوان مثال، بیشتر صفحه ساز ها فقط یک عنصر دکمه دارند که در آن کاربران قادر به ایجاد سبک های مختلف با پیکربندی تنظیمات آن هستند. از طرف دیگر، Visual Composer دارای بیش از دوازده عنصر دکمه است که در این تصویر نشان داده شده است.

خوشبختانه، بیشتر عناصر Visual Composer به طور خودکار در بخش Add Element در ویرایشگر ظاهر نمی شوند، بنابراین لازم نیست دسته ای از عناصر را که به ندرت استفاده می کنید مرتب کنید. در عوض، از Visual Composer Hub، کتابخانه ای از همه عناصر، بلوک ها (ردیف ها و ستون های از پیش ساخته شده)، الگو ها و موارد دیگر استفاده خواهید کرد، که می توانید آن ها را به بخش Add Element ویرایشگر وارد کنید.

عناصر به چند دسته مختلف در بخش Add Element نظیر Basic، Media، Container و Content مرتب شده اند.

به طور کلی، می توانید تقریباً هر نوع محتوا و سبکی را به صفحاتی که ایجاد می کنید اضافه کنید.

طراحی ظاهر

گزینه های یک ظاهر طراحی Beaver Builder بسته به ماژول تغییر می کند. اگر ماژول شما متن داشته باشد، معمولاً می توانید قلم، اندازه قلم، وزن قلم و رنگ آن را تغییر دهید، به علاوه فاصله و حتی سایه متن را اضافه کنید.

گزینه های سبک به ماژول بستگی دارد اما به عنوان مثال ممکن است به شما اجازه دهد رنگ پس زمینه، گزینه های پوشش، پر کردن، گرد کردن گوشه ها، حاشیه ها و سایه های جعبه را تعیین کنید. ماژول های خاص گزینه های سبک منحصر به فردی دارند، مانند ماژول شمارنده، که می توانید برای قسمت های پر و پر نشده پیشخوان خود رنگ ها را مشخص کنید، همانطور که در این عکس می بینید

در مقایسه افزونه های صفحه ساز ویژوال کامپوزر و بیور بیلدر، Visual Composer برای عناصر خود مانند Beaver Builder و سایر صفحه سازها یک تب Style اختصاصی ندارد. در عوض، شما محتوای و سبک های هر عنصر را در یک بخش کلی اضافه کرده و پیکربندی می کنید، در تصویر زیر نشان داده شده است.

گزینه های سبک بسته به عنصری که ویرایش می کنید تغییر می کند. به طور کلی می توانید قلم، رنگ، شکل و تراز بندی یک عنصر را تغییر دهید و مواردی مانند شناسه ها و کلاس های منحصر به فرد را اضافه کنید. همچنین می توانید سایه های جعبه را با تنظیماتی که بخش خاص خود را دارد اضافه کنید.

گزینه های پیشرفته سفارشی سازی

هر ماژول در افزونه Beaver Builder تقریباً همان گزینه های پیشرفته را دارد. آن ها شامل تنظیمات حاشیه، سبک ها و مدت زمان انیمیشن، قابلیت مشاهده (به عنوان مثال، فقط می خواهید کاربران وارد شده برای دیدن عنصر باشند) و بخشی برای شناسه ها و کلاس های سفارشی. در اینجا یک تصویر از اکثر برگه Advanced وجود دارد. عکس صفحه شناسه سفارشی و فیلدهای کلاس را در بخش HTML نشان نمی دهد. همچنین، سطرها و ستون ها علاوه بر تنظیمات حاشیه، دارای زمینه های Padding نیز هستند.

گزینه های پیشرفته افزونه Visual Composer در قسمت گزینه های طراحی وجود دارد. در اینجا یک عکس از صفحه جزئی وجود دارد.

می توانید حاشیه، اندازه و حاشیه هر عنصر را سفارشی کنید و عناصر جداگانه را برای دستگاه های خاص نشان دهید یا پنهان کنید. هر بار فقط می توانید یک نوع و اندازه دستگاه انتخاب کنید، مانند “desktop”، “Tablet Landscape”، “Tablet Portrait”، “Mobile Landscape”.

همچنین می توانید یک رنگ پس زمینه به عنصر اضافه کنید، یک تصویر پس زمینه انتخاب کنید و تنظیمات انیمیشن را پیکربندی کنید. گزینه های پیشرفته پس زمینه گزینه های پس زمینه موجود در بخش عمومی را حذف نمی کنند.

الگو ها

صفحه ساز Beaver Builder ده ها قالب طرح ارائه می دهد که می توانید برای بارگیری صفحات نمایش اولیه و محتوا از قبل ساخته شده در ویرایشگر استفاده کنید، یا می توانید از بین 100 ردیف از پیش ساخته شده محتوای از پیش طراحی شده انتخاب کنید. این تصویر صفحه برخی از الگوهای صفحه نمایش اولیه را نشان می دهد.

این الگو های صفحه ساز وردپرس به سبک ها و طرح های مختلفی ارائه می شوند و متناسب با نیازهای عمومی یا طیف های متنوعی هستند. الگوهای صفحه محتوا شامل درباره صفحات، صفحات تیم و صفحات نمونه کارها است.

صفحه ساز ویژوال کامپوزر تعداد مشابهی الگو دارد. آن ها در دسته بندی ها طبقه بندی نشده اند، اما انتخاب های متنوعی را ارائه می دهند و به شما کمک می کنند صفحات مختلفی را بسازید.

صفحات فرود برای کتاب خانه ها، محصولات و سبک های مختلف و همچنین طرح های تکمیل شده برای صفحات محتوا وجود دارد. حتی الگو های مطالعه موردی و طرح وبلاگ نیز وجود دارد.

ویژگی های اضافی

بزرگترین تفاوت بین Visual Composer جدید و WPBakery Page Builder در توانایی ویژوال کامپوزر در ویرایش سر برگ، پاورقی و ستون های فرعی موضوع شما یا ایجاد آن ها از ابتدا است.

این یک ویژگی کلیدی است که توسعه دهندگان از آن رنج می برند و از آنجا که افزونه بیور بیلدر عملکرد مشابهی دارد، ما به چندین ویژگی اضافی که هر محصول ارائه می دهد، خواهیم پرداخت.

پوسته های رسمی

در مقایسه افزون های صفحه ساز وردپرس، در حالی که هر دو محصول با اکثر قالب ها به خوبی کار می کنند، Beaver Builder و Visual Composer هر دو قالب های رسمی را ارائه می دهند که با صفحه ساز های آن ها یکپارچه شده است.

بیور بیلدر دارای قالب Beaver Builder است. این قالب از سفارشی ساز قالب زنده که در وردپرس تعبیه شده بسیار استفاده می کند، به شما این امکان را می دهد که تغییرات کلی در هدر، پاورقی و سبک های قالب ایجاد کنید و نتایج را در همان زمان به صورت زنده ببینید.

موضوع با چارچوب همیشه محبوب و قابل اعتماد Bootstrap CSS ساخته شده است، و بقیه کد ها نیز تمیز هستند. این ویژگی ها عملکرد کلی قالب را بهبود می بخشند، که به نوبه خود، سایت شما را برای سرعت بهینه می کند، یک عامل اصلی در سئو و بهینه سازی پایگاه داده کاربر است . همچنین از ووکامرس نیز پشتیبانی می کند.

ویژوال کامپوزر دارای قالب شروع کننده Visual Composer است. مانند قالب Beaver Builder، دارای گزینه های متنوعی است که می توانید شخصی سازی کنید. همچنین مناسب سئو است و از ووکامرس پشتیبانی می کند.

ویرایشگر های قالب

شما می توانید با استفاده از قوانین ورود و خروج دقیقاً هر مکانی را که در آن طرح ظاهر می شود تعیین کنید. برای ایجاد انواع دیگر قوانین برای نمایش طرح می توانید از منطق مشروط نیز استفاده کنید. به عنوان مثال، برای سر صفحه ای که قصد دارید برای پست های منفرد استفاده کنید، می توانید هنگام تنظیم تصویر برجسته پست یک سر برگ و در صورت تنظیم نشدن تصویر برجسته یک سر صفحه دیگر نمایش دهید.

تصویر زیر صفحه ویرایشی را نشان می دهد که در آن مکان و هرگونه قید و شرط برای طرح هدر را مشخص می کنید.

Beaver Themer همچنین دو ویژگی به افزونه استاندارد Beaver Builder اضافه می کند. ابتدا، بخش Visibility در تب Advanced منطق شرطی را اضافه می کند تا در هنگام نمایش طرح یا محتوا کنترل بیشتری داشته باشید. به عنوان مثال، شما می توانید محتوا را فقط برای مشتریان ووکامرس که بیش از کل مبلغ مشخصی خرج کرده اند یا اعضای سایت با نقش ها یا قابلیت های خاص کاربر نمایش دهید.

ویژگی دوم دسترسی به اتصالات میدانی در برخی از تنظیمات ردیف و ماژول است که اطلاعات را از پایگاه داده به طور خاص برای صفحه مشاهده شده می کشد. این ویژگی از زمینه های سفارشی وردپرس، افزونه Advanced Custom Fields و افزونه Pods پشتیبانی می کند، بنابراین می توانید زمینه های سفارشی را به یک صفحه اضافه کنید و سپس از یک ماژول برای نمایش آن ها در صفحه استفاده کنید.

سازنده قالب Visual Composer با تمام برنامه های برتر به صورت رسمی در دسترس است. این یک نسخه لغو شده از Beaver Themer است که فقط به شما امکان می دهد سر صفحه ها، پاورقی ها و صفحه آرایی های سفارشی را ایجاد کنید که شامل ستون های فرعی باشد یا آن ها را حذف کند. بسته به نیاز خود، ممکن است گزینه Beaver Themer قدرتمند تر و گران تر یا راه حل ساده تر Visual Composer را ترجیح دهید.

ذخیره موارد برای استفاده مجدد

همان طور که به ایجاد محتوا با سازندگان صفحه عادت کرده اید، ممکن نیاز داشته باشند تا از طرح های خود که قبلا استفاده کرده اند و آن ها را طراحی کرده اند مجددا استفاده کنند.

Beaver Builder دارای یک ویژگی داخلی است که به شما امکان می دهد هر ردیف، ستون یا ماژول را برای استفاده مجدد ذخیره کنید. همچنین می توانید الگو های طرح سفارشی را ذخیره کنید.

می توانید الگو ها، ردیف ها، ستون ها و ماژول های ذخیره شده را صادر کرده و به وب سایت های دیگری که از افزونه Beaver Builder استفاده می کنند وارد کنید.

در حالی که ذخیره عناصر برای استفاده مجدد در WPBakery Page Builder موجود است، اما توسعه دهندگان هنوز در زمان نوشتن این مقاله این ویژگی را به Visual Composer جدید اضافه نکرده اند.

جمع بندی: صفحه ساز وردپرس بیور بیلدر یا ویژوال کامپوزر

در حالی که چند ویژگی موجود در WPBakery Page Builder وجود ندارد، Composer Visual جدید، حتی در نسخه رایگان خود، چیزهای زیادی ارائه می دهد.

افزودن عناصر جدید و ویرایش عناصر موجود معمولاً باعث می شود تا چند ثانیه کل ویرایشگر مسدود شود. با باز کردن مرورگر، هر بار هشدار “یک صفحه وب باعث کاهش سرعت مرورگر شما” می شود، را مشاهده خواهید کرد.

مشکل ترین حالت چیدمان ردیف ها و ستون ها، ویرایش آن ها بعد از ثبت نهایی است، مخصوصاً اگر از الگوی کتاب خانه استفاده می کنید. تنظیم مجدد و تغییر اندازه نادرست ردیف ها و ستون ها واقعاً آسان است و تصحیح آن دست و پا گیر است.

صفحه ساز Beaver Builder و بسیاری دیگر از صفحه ساز های وردپرس بسیار ساده تر و سریع تر با آن ها کار می کنند. هنگامی که Beaver Themer را در نظر می گیرید و ویژگی های صرفه جویی و ذخیره سازی را در نظر می گیرید، می توانید با استفاده از بیور بیلدر حتی به موفقیت های بیشتری نیز برسید.

وقتی نوبت به مقایسه Beaver Builder و Visual Composer می رسد، همیشه می توانید خودتان در یک مدت آزمایشی با آن ها کار کنید تا ببینید کدام یک را ترجیح می دهید. Beaver Builder نسخه ی آزمایشی دارد که می توانید برای بررسی از آن استفاده کنید. همچنین می توانید نسخه رایگان ویژوال کامپوزر را از وب سایت آن ها بارگیری کنید تا امتحان کنید. همچنین پیشنهاد می کنیم بهترین صفحه سازهای وردپرس در سال 2021 را نیز بررسی کنید تا بتوانید بهترین انتخاب را انجام دهید.

امیدواریم شما با خواندن این مقاله اطلاعات کافی در مورد Beaver Builder  و  Visual Composer را کسب کرده باشید و بتوانید بهترین انتخاب صفحه ساز وردپرس را برای وب سایت خود انجام دهید و با استفاده از آن طراحی های مد نظر خود را بر روی سایت خود پیاده کنید.