loading...

فناوري اطلاعات زيفا

https://zefa.ir/

بازدید : 46
سه شنبه 24 فروردين 1400 زمان : 14:24

افرونه ویژوال کامپوزر چیست؟ معرفی کامل ویژگی های آن |

اگر با وردپرس آشنا باشید می دانید که یکی از بهترین امکانات آن ساخت صفحات وب سایت بدون کدنویسی است. پلاگین های متنوعی ارائه شده که برخی اختصاصا برای هر قالب طراحی شده و برخی دیگر به صورت عمومی و سازگار با اکثر قالب های وردپرسی در دسترس هستند. از بین همه افزونه های صفحه ساز (page builder plugin) المنتور با ۵۰۰۰۰۰۰ نصب فعال از نسخه رایگان و ویژوال کامپوزر با ۴۰۰۰۰۰ خرید موفق پرفروش ترین آنها هستند. در ادامه این مقاله از فناوری اطلاعات زیفا به بررسی هر دو افزونه صفحه ساز elementor و wpbakery page builder می پردازیم.

معرفی افزونه ویژوال کامپوزر

افزونه WPBakery یا ویژوال کامپوزر نسخه ۶.۵.۰ پرفروش ترین افزونه سایت codecanyon که نزدیک به ۴۰۰ هزار فروش داشته و در بیش از ۲ میلیون سایت وردپرسی فعال شده است!

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

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

ویژگی های بارز افزونه visual composer

  • WordPress Post Editor به کاربران اجازه می دهد پست های خود را در وب سایتشان ویرایش نمایند و آنها را به هر شکل و فرمی که می خواهند در آورند. برای مثال در این بخش افراد می توانند بخشی از متن خود را بولد و یا ایتالیک کنند، لینک ها و تصاویری را به متن بیفزایند، لیست هایی در متن خود ایجاد کنند و کارهای مشابه دیگری انجام دهند. با استفاده از پلاگین ویژوال کامپوزر کاربران می توانند تمامی کارهای مربوط به ویرایش صفحه را با درگ اند دراپ انجام دهند، درواقع این پلاگین به کاربران امکان ایجاد صفحات بسیار حرفه ای در وب سایت بدون کد نویسی و تنها با درگ اند دراپ کردن را می دهد و این پلاگین امکان انجام تمامی فرایند های ویرایش و ایجاد صفحه را با استفاده از پلتفرمی که برای کاربر کاملا ویژوال یا بصری است ایجاد می کند.
  • ویژوال کامپوزر برای کاربران امکان ایجاد صفحات بسیار منحصر به فردی را با استفاده از بلوک های سازنده محتوا، فراهم می کند. برخی از پلاگین هایی که مانند ویژوال کامپوزر پیج بیلدر هستند، از بلوک های سازنده با نام ماژول ها و برخی با نام ویجت ها یاد می کنند، اما ویژوال کامپوزر آنها را المان های محتوا می نامد. المان های محتوا بلوک هایی سازنده محتوا هستند که می توان آنها را به صورت درگ اند دراپ در هر قسمتی از صفحه مورد نظر قرار داد.
  • بیش از ۴۰ المان محتوا در ویژوال کامپوزر وجود دارد، این المان ها شامل بلوک های متنی، کلید های شبکه های اجتماعی، ویدیو پلیرها و بسیاری المان های مشابه دیگر می باشند. تمامی این المان ها محتوا ریسپانسیو هستند و لذا استفاده از آنها موجب می شود که صفحه شما در صفحات دسکتاپ، تبلت ها و موبایل و هر وسیله دیگری که کاربران برای مراجعه به وب سایت شما از آن استفاده نموده باشند، به خوبی نمایش داده شود. علاوه بر این بسیاری از این المان های محتوایی قابلیت تنظیم شدن دارند و می توان برخی تنظیمات دلخواه خود را در آن ها وارد نمود.
  • پیچ بیلدرهای مختلفی که عملکرد آنها به صورت درگ اند دراپ است به کاربران این امکان را می دهند که تنظیمان و اصلاحات مد نظر خود را در Backend و یا در Frontend انجام دهند، اما قابلیت ویژه ای در ویژوال کامپوزر وجود دارد که موجب می شود با استفاده از آن بتوان اصلاحات خود را هم در Backend و هم در Frontend انجام داد و انتخاب آن کاملا بسته به سلیقه و خواسته کاربر است. مانند تمامی پیج بیلدر های دیگر در ویژوال کامپوزر نیز این امکان استفاده از هر قالب وردپرسی وجود دارد.
  • علاوه بر این ویژوال کامپوزر از تمامی زبان های پشتیبانی می کند و با پلاگین ترجمه وردپرس یا qTranslate سازگاری دارد.
  • به طور خلاصه ویژوال کامپوزر دارای ویژگی های ریز می باشد

  1. طراحی کاربری بسیار آسان
  2. عدم نیاز به کدنویسی
  3. طراحی ریسپانسیو و واکنش‌­گرا
  4. قابلیت ویرایشگر Drag & Drop المان­‌ها
  5. دارای بیش از 40 المان طراحی
  6. قابلیت پیش نمایش سریع
  7. قابلیت ایجاد اسلایدرهای جذاب و کاربرپسند
  8. پشتیبانی از زبان فارسی
  9. سازگار با اکثر قالب­‌های وردپرسی
  10. سازگاری با افزونه ووکامرس
  11. قابلیت ایجاد و دسترسی شورت کدها
  12. قابلیت افزودن سطر و ستون­‌های دلخواه

چگونه صفحات وب سایت خود را با استفاده از ویژوال کامپوزر طراحی نماییم؟

زمانی که نصب و فعال سازی پلاگین ویژوال کامپوزر به پایان رسید. شما خواهید دید که دو کلید جدید بر روی Post Editor شما ظاهر می شود.یکی از این کلید ها برای شما این امکان را فراهم می کند که ویرایش صفحات خود را در Backend انجام دهید و دیگری امکان ویرایش صفحات در Frontend را برای شما فراهم می آورد، برای آنکه شما از امکان ویرایش صفحه در Backend استفاده کنید باید کلید Backend Editor را کلیک کنید. و برای آنکه از امکان ویرایش در Frontend استفاده کنید باید کلید Frontend Editor را کلیک کنید.

ظاهر شدن این دو کلید اضافه در بخش Post Editor برای شما این امکان را فراهم می کند که از میان ویرایشگر مود کلاسیک یا همان ویرایشگر پیش فرض ورد پرس، ویرایشگر Backend و ویرایشگر Frontend ویژوال کامپوزر یکی را انتخاب نمایید.اگر بر روی کلید Backend Editor کلیک کنید خواهید دید که ادیتور پیش فرض ورد پرس شما به Backend Editor ویژوال کامپوزر تغییر می یابد.

چهار کلید در بالای رابط کاربری ویرایشگر Backend ویژوال کامپوزر وجود دارد، کلیدی که بر روی آن علامت “+” وجود دارد برای شما این امکان را فراهم می کند که یک المان محتوای جدید اضافه کنید. کلید خاکستری رنگی که بر روی آن یک علامت “T” به رنگ سفید نمایش داده شده است تمپلیت باکس را برای شما بارگذاری می کند و کلیدی که بر روی آن علامت چرخ دنده وجود دارد، باکس CSS را برای شما بارگذاری می نماید که به شما این امکان را می دهد که کلاس های CSS مورد نظر خود را برای آن صفحه تعیین نمایید. آخرین کلیدی که در این صفحه وجود دارد شما را به ویرایشگر Frontend هدایت می کند.

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

اگر شما بر روی کلیدی که علامت “+” بر روی آن قرار دارد کلیک کنید خواهید دید که صفحه Element Box یا جعبه المان ها که شامل المان های صفحه آرایی می باشد، برای شما نمایش داده می شود. در حالت پیش فرض تمامی المان ها نمایش داده می شوند اما این امکان نیز برای شما وجود دارد که با استفاده از گزینه های بالای صفحه تنها المان های مشخصی را انتخاب کنید تا تنها همان المان ها در صفحه شما نمایش داده شوند. با استفاده از این گزینه های شما می توانید انتخاب کنید که تنها یکی از مجموعه المان های Social، Structure، WordPress Widgets و یا Content نمایش داده شوند.

در ابتدای این مقاله ذکر کردم که در ویژوال کامپوزر بیش از ۴۰ المان محتوا وجود دارد. اگر بخواهیم یک گروه بندی کلی از این المان ها ایجاد کنیم باید بگوییم که ۱۲ نمونه از المان موجود در لیست المان های محتوای ویژوال کامپوزر، ویجت های وردپرس می باشند، ۲۵ تا از آنها المان های محتوای مجزا می باشند، ۴ تا از المان ها مربوط به شبکه های اجتماعی بوده و ۳ المان ساختاری در میان این المان ها موجود می باشد. در ورژن کنونی ویژوال کامپوزر ۴۴ المان محتوا موجود می باشد.

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

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

المان Text Block برای شما این امکان را فراهم می کند که با استفاده از ویرایشگر ویژوال ورد پرس، محتوایی را درون صفحه خود اضافه نمایید.

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

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

اگر شما در المان row بر روی کلیدی که علامت “+” بر روی آن قرار دارد کلیک کنید می توانید یک سطر به صفحه خود اضافه نمایید و سپس با استفاده از آپشنی که در زیر کلید “+” قرار دارد، خواهید توانست تعداد ستون ها و حجم هر یک را در این سطر تعیین کنید. در این آپشن ۱۱ نوع مختلف از صفحه آرایی ها (layouts) یا چینش ستون ها در یک سطر به صورت از پیش آماده شده وجود دارد، که شما می توانید بسته به سلیقه خود هریک از آنها را انتخاب نمایید.

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

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

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

شما می توانید سایز نوارهای مرزی، حاشیه ها، حد فاصل خطوط و بسیاری از موارد مشابه را در سربرگ Designing Option درون بخش تنظیمات ستون ها (Column Settings) تعیین نمایید. در همین سربرگ شما می توانید همچنین رنگ کادرها ، حاشیه ها و زمینه تصویر را تغییر دهید، علاوه بر این شما می توایند شکل و فرم کاردها را نیز تغییر دهید. برای مثال شما می توانید از یک کادر ساده که دارای خطوط ممتد است استفاده کنید، و یا از کادری استفاده کنید که به جای خطوط ممتد در آن نقاط پشت سر هم با فواصل منظم و یا خط تیره هایی با فواصل منظم در میان آنها استفاده نمایید.

در سربرگ Design Options تمامی امکانات مورد نیاز برای ویرایش حاشیه ها، کادرها و رنگ های آنها و سایر مسائل مربوط به آنها وجود دارد.
در بخش تنظیمات ستون ها یا Column Settings سربرگ دیگری نیز با نام Widths and responsiveness وجود دارد، که تمامی تنظیمات موجود در آن مختص ستون ها بوده و برای سطر ها قابل اعمال نمی باشد زیرا این تنظیمات معمولا به صورت اتوماتیک برای سطرها انجام می گیرد و لذا نیازی به انجام دادن آنها به صورت دستی نمی باشد.

شما می توانید در بخش Widths and responsiveness تعیین کنید که امکان کاهش پهنای ستون ها به یک دوازدهم پهنای صفحه وجود داشته باشد در این صورت پهنای ستون ها متناسب با اندازه صفحه نمایش دستگاهی که کاربر برای جستجو در وب سایت شما استفاده می نماید تغییر می کند. با این کار شما مطمئن خواهید شد که زمانی که کاربران تلفن های همراه به وب سایت شما مراجعه می نمایند نیاز به زوم کردن صفحه و استفاده مکرر از اسکرول برای مشاهده مطالب درون صفحه شما ندارند. برای تعیین پهنای ستون ها می توانید به باکس تنظیمات ستون ها یا Column Setting Box مراجعه نمایید.

در صفحه اصلی رابط کاربری ویژوال کامپوزر همان طور که پیشتر نیز به آن اشاره شد کلیدی وجود دارد به رنگ طوسی که بر آن حرف “T” که مخفف Template است نوشته شده است. به این کلید آیکون تمپلیت گفته می شود. اگر شما بر روی این کلید کلیک نمایید باکس تمپلیت ها برای شما نمایش داده می شود. در این صفحه شما می توانید صفحه آرایی یا تمپلیت که برای یکی از صفحات خود ایجاد نموده اید به صورت یک تمپلیت مجزا ذخیره نمایید تا بتوانید آن را بر روی دیگر صفحات وب سایت خود اعمال کنید.

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

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

من به شما پیشنها می کنم که در ابتدای کار خود با ویژوال کامپوزر حتما از این تمپلیت ها استفاده کنید زیرا این تمپلیت های پیش فرض به شما کمک می کنند که درک درستی از افزونه ویژوال کامپوزر و امکانات آن بدست آورید. شما می توانید این تمپلیت های پیش فرض را نیز در لیست صفحه آرایی ها و یا تمپلیت های خودتان (My templates) ذخیره نمایید.

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

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

ویرایشگر Frontend ویژوال کامپوزر

همان طور که شما دوستان می دانید، ویرایشگر Frontend به شما این امکان را می دهد که صفحات در حال اجرای وب سایت خود را ویرایش نمایید.
برای آنکه از ویرایشگر Backend ویژوال کامپوزر به ویرایشگر Frontend آن سوییچ کنید باید بر روی کلید Frontend Editor در بالای صفحه و در بخش Post Editor کلیک نمایید. به خاطر داشته باشید که پیش از آنکه از حالت ویرایشگر Backend به ویرایشگر Frontend سوییچ کنید و یا بالعکس، حتما تغییرات و ویرایش هایی که انجام داده اید را ذخیره کنید، در صورت عدم ذخیره سازی ویرایش ها تمامی تغییرات ایجاد شده توسط شما به حالت اولیه باز می گردند و وقت و زحمات شما تلف می شود.

از نظر من ویرایشگر Backend بیشتر برای ایجاد ساختار صفحات و ایجاد تغییرات ساختاری در وب سایت مناسب می باشد و ویرایشگر Frontend بیشتر برای ایجاد تغییرات جزیی در وب سایت مناسب است. البته بسیاری از کاربران ورد پرس ترجیح می دهند که تمامی ویرایش های خود را در ویرایشگر Backend انجام دهند و بسیاری دیگر دوست دارند که تمامی کارهای ویرایشی را در ویرایشگر Frontend انجام دهند و این مساله کاملا به سلیقه شخصی آنها وابسته می باشد.

در ویرایشگر Frontend ویژوال کمپرسور شما با کلیک کردن بر روی Content Block یا بلوک محتوا، همان گزینه هایی را مشاهده خواهید نمود که در ویرایشگر Backend ویژوال کامپوزر آنها را مشاهده نموده بودید. این گزینه ها شامل گزینه ای برای ایجاد سطر های جدید، گزینه ای برای ایجاد ستون های جدید، گزینه هایی برای ویرایش سطر ها و ستون ها و گزینه های برای حذف آنها و … می باشد.

در بالای صفحه ویرایشگر Frontend ویژوال کمپرسور شما کلید های مشابهی با آنچه در ویرایشگر Backend مشاهده نموده بودید وجود دارد، کلیدی با علامت “+” بر روی آن که برای اضافه کردن المان محتوای جدید استفاده می شود، کلیدی با علامت “T” بر روی آن که برای بار گذاری تمپلیت های پیش فرض استفاده می شود، کلیدی با علامت چرخ دنده که برای ایجاد تغییرات در تنظیمات می توان از آن استفاده نمود. علاوه بر کلید های نام برده کلید های دیگری نیز در بالای صفحه ویرایشگر Frontend ویژوال کمپرسور وجود دارد، یکی از کلید ها که عبارت “Save Draft” بر روی آن حک شده است برای ذخیره پیش نویس ها و دیگری که عبارت “Publish” بر روی آن حک شده برای انتشار محتوای ایجاد شده کاربرد دارد و در کنار تمامی این کلید ها کلیدی برای سوییچ کردن به ویرایشگر Backend نیز موجود می باشد.

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

علاوه بر تمامی کلید های نام برده، کلید دیگری در بالای رابط کاربری ویرایشگر Frontend ویژوال کامپوزر وجود دارد که بر روی آن عبارت “Guides ON” حک شده است، شما می توانید با فشردن این کلید ببینید که صفحه شما بدون اعمال تغییرات ایجاد شده با استفاده از المان های محتوای ویژوال کامپوزر به چه شکل بوده است. در واقع این کلید تمامی اقدامات انجام شده شما در جهت ویرایش صفحه با استفاده از ویژوال کامپوزر را می تواند غیر فعال کند تا شما بررسی کنید که پیش از اعمال تغییرات صفحات شما به چه شکل بوده اند.

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

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

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

تنظیمات ویژوال کامپوزر

محیط تنظیمات ویژوال کامپوزر دارای ۵ زبانه مجزا می باشد که در ادامه هریک از آنها را به صورت مجزا برای شما توضیح خواهم داد.

  1. زبانه اول که Home نام دارد امکان انجام تنظیمات عمومی و کلی را به کاربران می دهد.در بالای صفحه آپشنی وجود دارد که به شما این امکان را می دهد که نوع پست هایی که می خواهید ویژوال کامپوزر بر روی آن ها قابل استفاده باشد را انتخاب نمایید. در واقع در این بخش شما می توانید ویژوال کامپوزر را در بخش های مختلف وب سایت خود فعال یا غیر فعال نمایید.
    یکی از بهترین آپشن های موجود در این صفحه رول ادیتور می باشد، با استفاده از این آپشن شما می توانید انتخاب کنید که هر یک از گروه های مختلف یوزرهای وب سایت، از کدامیک از ادیتورهای وب سایت بتوانند استفاده نمایند. برای مثال اگر شما در وب سایت خود علاوه بر ویرایشگر وردپرس ویرایشگر ویژوال کامپوزر را نیز داشته باشید، شما می توانید با استفاده از آپشن رول ادیتور امکان استفاده از تنها یکی از ادیتورها را به ادمینستریتورها یا مدیران وب سایت خود بدهید یا امکان استفاده از هر دو ویرایشگر را برای مدیران وب سایت آزاد کنید.
    در این بخش یک قابلیت منحصر به فرد دیگر نیز وجود دارد، شما می توانید در رول ادیتور امکان استفاده از برخی المان های محتوا را برای بعضی از گروه های مختلف یوزرهای سایت محدود نمایید. این امکان زمانی برای شما مفید خواهد بود که بخواهید برخی از گروه های یوزرهای وب سایت تنها به المان های محتوای مشخصی دسترسی داشته باشند و امکان استفاده از دیگر المان ها برای آنها مقدور نباشد.
  2. زبانه دوم در صفحه تنظیمات ویژوال کامپوزر به شما امکان تنظیم رنگبندی المان های محتوای ویژوال کامپوزر را می دهد. علاوه بر رنگ بندی در این زبانه شما می توانید فاصله مابین المان ها در حاشیه پایینی آنها را نیز تغییر دهید و آنها را به هم نزدیکتر و یا از هم دورتر کنید و همچنین سایز صفحه ویژوال کامپوزر را برای استفاده از آن در تلفن های همراه تنظیم نمایید.
  3. زبانه سوم در این صفحه تنظیمات به شما امکان استفاده از کد ها و کلاس های CSS مختلف برای ایجاد تنظیمات در ویژوال کامپوزر را می دهد. شما می توانید کدها و کلا های CSS مورد نظر خود را در این بخش وارد نمایید و سپس برای شکل دهی المان های محتوا در ویژوال کامپوزر آنها را فراخوانی نمایید.
  4. در زبانه چهارم در تنظیمات ویژوال کامپوزر شما می توانید اطلاعات مربوط به لایسنس خود را در آن وارد کنید تا هر زمانی که ورژن جدید و قابلیت های جدیدی از ویژوال کامپوزر ایجاد شد، پلاگین شما به صورت اتوماتیک آپدیت شود. علاوه بر این وارد کردن اطلاعات لایسنس موجب می شود که شما بتوانید از پشتیبانی های کمپانی تولید کننده این پلاگین استفاده نمایید. بسیاری از توسعه دهندگان نرم افزارهای مختلف، برای جلوگیری از استفاده غیر مجاز از نرم افزارشان چنین گزینه ای را در نرم افزارهای خود ایجاد می کنند که کاربران برای استفاده همه جانبه از نرم افزار نیازمند یک لایسنس باشند.
  5. در زبانه پنجم که آخرین زبانه موجود در صفحه تنظیمات ویژوال کامپوزر می باشد، شما می توانید کدهای اضافه ای را از دیگر پلاگین ها به ویژوال کامپوزر اضافه نمایید، این کار موجب می شود که شما بتوانید المان های محتوای دیگری بجز آنهایی که در ویژوال کامپوزر موجود هستند را در میان المان های محتوای ویژوال کامپوزر خود اضافه کنید و کارایی های آن را افزایش دهید.

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

نگاهی اجمالی به قابلیت های ویژوال کامپوزر

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

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

توسعه دادن ویژوال کامپوزر

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

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

نقاط ضعف ویژوال کامپوزر

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

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

متاسفانه ویژوال کامپوزر دارای این قابلیت نمی باشد و زمانی که کاربران نیاز به امکانات اضافه تری داشته باشند تنها می توانند از سایر افزونه ها و پلاگین هایی که با ویژوال کامپوزر سازگار می باشند استفاده نمایند.
البته در این ابزار یک المان محتوای ستون فرعی( Widgetized Widgetized sidebar) وجود دارد که برای کاربران تا حدودی استفاده از ویجت های ورد پرس را فراهم می کند. در تئوری این طور به نظر می رسد که این المان محتوای ستون فرعی Widgetized برای کاربران امکان استفاده از ویجت ها را فراهم می نماید اما در عمل استفاده از آن تا حدی مشکل و زمان بر است که کاربران کمتر ممکن است از آن استفاده کنند.

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

برای مثال شما فرض کنید که یک وب سایت با ۱۰۰ صفحه مجزا دارید و می خواهید در ۲۵ نمونه از این صفحات ویجت های مورد نظر خود را اضافه نمایید، اگر شما برای این کار از ویژوال کامپوزر استفاده کنید، ملزم به ایجاد ۲۵ ساید بار مجزا برای هر یک از ۲۵ صفحه مورد نظر خود خواهید بود. در عوض اگر شما از سایر پلاگین های پیج بیلدر برای این کار استفاده نمایید خواهید توانست تنها با درگ اند دراپ کردن، ویجت های مورد نظر خود را به محیط صفحات خود اضافه نمایید.امید است که WP Bakery این مساله را در آینده نزدیک حل کند و امکان اضافه کردن ویجت ها به صورت مستقیم در صفحات را برای کاربران ویژوال کامپوزر فراهم نماید.

مقایسه

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

  • هزینه ها

ویژوال کامپوزر از لحاظ قیمت گزینه بسیار مناسبی است و قیمتی که کاربران برای استفاده از آن باید بپردازند در مقایسه با سایر پلاگین های مشابه، بسیار کمتر است. ویژوال کامپوزر یک پلاگین پیشرفته است که قابلیت های بسیاری دارد و استفاده از آن برای کاربران مزایای زیادی دارد با این حال میزان هزینه ای که کاربران برای استفاده از آن باید بپردازند تنها ۲۸ دلار می باشد. این مقدار در برابر هزینه های بسیاری ابزارهای مشابه که در رقابت با ویژوال کامپوزر می باشند، به میزان چشم گیری کمتر می باشد.

برای مثال پلاگین پیج بیلدر Velocity Page امکانات کمتری نسبت به ویژوال کامپوزر دارد و از لحاظ قابلیت ها و امکاناتی که به کاربران ارائه می دهند این پلاگین ها قابل مقایسه نمی باشند، با این حال هزینه استفاده از این ابزار اگر تنها کاربر بخواهد آن را بر روی یک وب سایت استفاده نماید ۹۷ دلار، اگر کاربر بخواهد آن را بر روی سه وب سایت مجزا استفاده کند ۱۶۷ دلار و اگر کاربر بخواهد آن را بر روی تعداد نامحدودی از وب سایت ها استفاده نماید ۲۴۷ دلار می باشد. یکی دیگر از پیج بیلدر های مشابه که Beaver Builder نام دارد نیز هزینه هایی مشابه با لیست قیمت های گفته شده در بالا دارد.

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

  • قابلیت ها

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

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

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

  • زیبایی رابط کاربری

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

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

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

  • کاربردی بودن

رابط کاربری ویژوال کامپوزر هم در ویرایشگر Backend و هم در ویرایشگر Frontend بسیار ساده می باشد و استفاده از آن برای کاربران حتی در دفعه اول مراجعه هم کار مشکلی نمی باشد. اکثر کاربران در کمتر از ۱۵ دقیقه یاد میگیرند که چگونه المان های محتوا را استفاده کنند و آنها را بر روی سطر ها و ستون های صفحه ای که ایجاد نموده اند پیاده سازی نمایند.

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

البته در این پلاگین تمپلیت های پیش فرضی وجود دارند که می توانند پروسه یادگیری شما را آسان تر نمایند. شما می توانید با استفاده از این تمپلیت ها در ابتدای کار با این پلاگین و ایجاد تغییرات جزیی و محدود در آنها اندک اندک با تمامی المان های محتوا و چگونگی استفاده از آنها آشنا شوید.

  • پشتیبانی

ویژوال کامپوزر ابزاری است که سالیان سال کاربران ورد پرس از آن استفاده نموده اند و این ابزار در تمامی این سال ها به صورت مرتب بروز رسانی شده است و به قابلیت ها و کارایی های آن افزوده شده است. این ابزار به عنوان پر فروش ترین پلاگین در CodeCanyon توانسته است در تمامی سال های کار خود پشتیبانی های بی وقفه ای را به کاربران عرضه نماید و این روند از گذشته تا کنون ادامه داشته است.

نیازی نیست که شما نگران آن باشید که چگونه باید از این ابزار استفاد کنید و یا برای یادگیری آن باید از چه منبعی استفاده نمایید. یک مجموعه آموزشی کامل برای استفاده از این ابزار در وب سایت WP Bakery موجود است که شما می توانید با مراجعه به آن گام به گام با یادگیری این ابزار پیش بروید. اگر با مساله یا مشکلی در حین استفاده از ابزار مواجه شدید و یا سوالی برای شما پیش آمد شما می توانید با سوالات خود را از طریق گذاشتن یاد داشت در Help Center با توسعه دهندگان این پلاگین مطرح نمایید و یا می توانید از طریق گذاشتن کامنت در CodeCanyon مسائل خود را توسعه دهندگان در میان بگذارید.

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

  • سرعت

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

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

سخن پایانی

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

تنها زمینه ای که این ابزار نسبت به ابزارهای مشابه با آن دارای عملکرد ضعیف تری می باشد مساله عدم عملکرد قوی این ابزار در زمینه اضافه کردن ویجت های ورد پرس در آن است. سایر پیج بیلدرهای درگ اند دراپ مشابه مثل : MiniMax و Aqua Page Bilder در زمینه اضافه کردن ویجت های ورد پرس عملکرد منعطف تری نسبت به ویژوال کامپوزر دارند و به کاربران این امکان را می دهند که ویجت های مورد نظر خود را به سادگی به صفحات بیفزایند.

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

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

منبع : https://zefa.ir/what-is-a-visual-composer-full-introduction-of-its-features-and-comparison-with-other-a/

افرونه ویژوال کامپوزر چیست؟ معرفی کامل ویژگی های آن |

اگر با وردپرس آشنا باشید می دانید که یکی از بهترین امکانات آن ساخت صفحات وب سایت بدون کدنویسی است. پلاگین های متنوعی ارائه شده که برخی اختصاصا برای هر قالب طراحی شده و برخی دیگر به صورت عمومی و سازگار با اکثر قالب های وردپرسی در دسترس هستند. از بین همه افزونه های صفحه ساز (page builder plugin) المنتور با ۵۰۰۰۰۰۰ نصب فعال از نسخه رایگان و ویژوال کامپوزر با ۴۰۰۰۰۰ خرید موفق پرفروش ترین آنها هستند. در ادامه این مقاله از فناوری اطلاعات زیفا به بررسی هر دو افزونه صفحه ساز elementor و wpbakery page builder می پردازیم.

معرفی افزونه ویژوال کامپوزر

افزونه WPBakery یا ویژوال کامپوزر نسخه ۶.۵.۰ پرفروش ترین افزونه سایت codecanyon که نزدیک به ۴۰۰ هزار فروش داشته و در بیش از ۲ میلیون سایت وردپرسی فعال شده است!

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

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

ویژگی های بارز افزونه visual composer

  • WordPress Post Editor به کاربران اجازه می دهد پست های خود را در وب سایتشان ویرایش نمایند و آنها را به هر شکل و فرمی که می خواهند در آورند. برای مثال در این بخش افراد می توانند بخشی از متن خود را بولد و یا ایتالیک کنند، لینک ها و تصاویری را به متن بیفزایند، لیست هایی در متن خود ایجاد کنند و کارهای مشابه دیگری انجام دهند. با استفاده از پلاگین ویژوال کامپوزر کاربران می توانند تمامی کارهای مربوط به ویرایش صفحه را با درگ اند دراپ انجام دهند، درواقع این پلاگین به کاربران امکان ایجاد صفحات بسیار حرفه ای در وب سایت بدون کد نویسی و تنها با درگ اند دراپ کردن را می دهد و این پلاگین امکان انجام تمامی فرایند های ویرایش و ایجاد صفحه را با استفاده از پلتفرمی که برای کاربر کاملا ویژوال یا بصری است ایجاد می کند.
  • ویژوال کامپوزر برای کاربران امکان ایجاد صفحات بسیار منحصر به فردی را با استفاده از بلوک های سازنده محتوا، فراهم می کند. برخی از پلاگین هایی که مانند ویژوال کامپوزر پیج بیلدر هستند، از بلوک های سازنده با نام ماژول ها و برخی با نام ویجت ها یاد می کنند، اما ویژوال کامپوزر آنها را المان های محتوا می نامد. المان های محتوا بلوک هایی سازنده محتوا هستند که می توان آنها را به صورت درگ اند دراپ در هر قسمتی از صفحه مورد نظر قرار داد.
  • بیش از ۴۰ المان محتوا در ویژوال کامپوزر وجود دارد، این المان ها شامل بلوک های متنی، کلید های شبکه های اجتماعی، ویدیو پلیرها و بسیاری المان های مشابه دیگر می باشند. تمامی این المان ها محتوا ریسپانسیو هستند و لذا استفاده از آنها موجب می شود که صفحه شما در صفحات دسکتاپ، تبلت ها و موبایل و هر وسیله دیگری که کاربران برای مراجعه به وب سایت شما از آن استفاده نموده باشند، به خوبی نمایش داده شود. علاوه بر این بسیاری از این المان های محتوایی قابلیت تنظیم شدن دارند و می توان برخی تنظیمات دلخواه خود را در آن ها وارد نمود.
  • پیچ بیلدرهای مختلفی که عملکرد آنها به صورت درگ اند دراپ است به کاربران این امکان را می دهند که تنظیمان و اصلاحات مد نظر خود را در Backend و یا در Frontend انجام دهند، اما قابلیت ویژه ای در ویژوال کامپوزر وجود دارد که موجب می شود با استفاده از آن بتوان اصلاحات خود را هم در Backend و هم در Frontend انجام داد و انتخاب آن کاملا بسته به سلیقه و خواسته کاربر است. مانند تمامی پیج بیلدر های دیگر در ویژوال کامپوزر نیز این امکان استفاده از هر قالب وردپرسی وجود دارد.
  • علاوه بر این ویژوال کامپوزر از تمامی زبان های پشتیبانی می کند و با پلاگین ترجمه وردپرس یا qTranslate سازگاری دارد.
  • به طور خلاصه ویژوال کامپوزر دارای ویژگی های ریز می باشد

  1. طراحی کاربری بسیار آسان
  2. عدم نیاز به کدنویسی
  3. طراحی ریسپانسیو و واکنش‌­گرا
  4. قابلیت ویرایشگر Drag & Drop المان­‌ها
  5. دارای بیش از 40 المان طراحی
  6. قابلیت پیش نمایش سریع
  7. قابلیت ایجاد اسلایدرهای جذاب و کاربرپسند
  8. پشتیبانی از زبان فارسی
  9. سازگار با اکثر قالب­‌های وردپرسی
  10. سازگاری با افزونه ووکامرس
  11. قابلیت ایجاد و دسترسی شورت کدها
  12. قابلیت افزودن سطر و ستون­‌های دلخواه

چگونه صفحات وب سایت خود را با استفاده از ویژوال کامپوزر طراحی نماییم؟

زمانی که نصب و فعال سازی پلاگین ویژوال کامپوزر به پایان رسید. شما خواهید دید که دو کلید جدید بر روی Post Editor شما ظاهر می شود.یکی از این کلید ها برای شما این امکان را فراهم می کند که ویرایش صفحات خود را در Backend انجام دهید و دیگری امکان ویرایش صفحات در Frontend را برای شما فراهم می آورد، برای آنکه شما از امکان ویرایش صفحه در Backend استفاده کنید باید کلید Backend Editor را کلیک کنید. و برای آنکه از امکان ویرایش در Frontend استفاده کنید باید کلید Frontend Editor را کلیک کنید.

ظاهر شدن این دو کلید اضافه در بخش Post Editor برای شما این امکان را فراهم می کند که از میان ویرایشگر مود کلاسیک یا همان ویرایشگر پیش فرض ورد پرس، ویرایشگر Backend و ویرایشگر Frontend ویژوال کامپوزر یکی را انتخاب نمایید.اگر بر روی کلید Backend Editor کلیک کنید خواهید دید که ادیتور پیش فرض ورد پرس شما به Backend Editor ویژوال کامپوزر تغییر می یابد.

چهار کلید در بالای رابط کاربری ویرایشگر Backend ویژوال کامپوزر وجود دارد، کلیدی که بر روی آن علامت “+” وجود دارد برای شما این امکان را فراهم می کند که یک المان محتوای جدید اضافه کنید. کلید خاکستری رنگی که بر روی آن یک علامت “T” به رنگ سفید نمایش داده شده است تمپلیت باکس را برای شما بارگذاری می کند و کلیدی که بر روی آن علامت چرخ دنده وجود دارد، باکس CSS را برای شما بارگذاری می نماید که به شما این امکان را می دهد که کلاس های CSS مورد نظر خود را برای آن صفحه تعیین نمایید. آخرین کلیدی که در این صفحه وجود دارد شما را به ویرایشگر Frontend هدایت می کند.

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

اگر شما بر روی کلیدی که علامت “+” بر روی آن قرار دارد کلیک کنید خواهید دید که صفحه Element Box یا جعبه المان ها که شامل المان های صفحه آرایی می باشد، برای شما نمایش داده می شود. در حالت پیش فرض تمامی المان ها نمایش داده می شوند اما این امکان نیز برای شما وجود دارد که با استفاده از گزینه های بالای صفحه تنها المان های مشخصی را انتخاب کنید تا تنها همان المان ها در صفحه شما نمایش داده شوند. با استفاده از این گزینه های شما می توانید انتخاب کنید که تنها یکی از مجموعه المان های Social، Structure، WordPress Widgets و یا Content نمایش داده شوند.

در ابتدای این مقاله ذکر کردم که در ویژوال کامپوزر بیش از ۴۰ المان محتوا وجود دارد. اگر بخواهیم یک گروه بندی کلی از این المان ها ایجاد کنیم باید بگوییم که ۱۲ نمونه از المان موجود در لیست المان های محتوای ویژوال کامپوزر، ویجت های وردپرس می باشند، ۲۵ تا از آنها المان های محتوای مجزا می باشند، ۴ تا از المان ها مربوط به شبکه های اجتماعی بوده و ۳ المان ساختاری در میان این المان ها موجود می باشد. در ورژن کنونی ویژوال کامپوزر ۴۴ المان محتوا موجود می باشد.

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

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

المان Text Block برای شما این امکان را فراهم می کند که با استفاده از ویرایشگر ویژوال ورد پرس، محتوایی را درون صفحه خود اضافه نمایید.

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

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

اگر شما در المان row بر روی کلیدی که علامت “+” بر روی آن قرار دارد کلیک کنید می توانید یک سطر به صفحه خود اضافه نمایید و سپس با استفاده از آپشنی که در زیر کلید “+” قرار دارد، خواهید توانست تعداد ستون ها و حجم هر یک را در این سطر تعیین کنید. در این آپشن ۱۱ نوع مختلف از صفحه آرایی ها (layouts) یا چینش ستون ها در یک سطر به صورت از پیش آماده شده وجود دارد، که شما می توانید بسته به سلیقه خود هریک از آنها را انتخاب نمایید.

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

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

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

شما می توانید سایز نوارهای مرزی، حاشیه ها، حد فاصل خطوط و بسیاری از موارد مشابه را در سربرگ Designing Option درون بخش تنظیمات ستون ها (Column Settings) تعیین نمایید. در همین سربرگ شما می توانید همچنین رنگ کادرها ، حاشیه ها و زمینه تصویر را تغییر دهید، علاوه بر این شما می توایند شکل و فرم کاردها را نیز تغییر دهید. برای مثال شما می توانید از یک کادر ساده که دارای خطوط ممتد است استفاده کنید، و یا از کادری استفاده کنید که به جای خطوط ممتد در آن نقاط پشت سر هم با فواصل منظم و یا خط تیره هایی با فواصل منظم در میان آنها استفاده نمایید.

در سربرگ Design Options تمامی امکانات مورد نیاز برای ویرایش حاشیه ها، کادرها و رنگ های آنها و سایر مسائل مربوط به آنها وجود دارد.
در بخش تنظیمات ستون ها یا Column Settings سربرگ دیگری نیز با نام Widths and responsiveness وجود دارد، که تمامی تنظیمات موجود در آن مختص ستون ها بوده و برای سطر ها قابل اعمال نمی باشد زیرا این تنظیمات معمولا به صورت اتوماتیک برای سطرها انجام می گیرد و لذا نیازی به انجام دادن آنها به صورت دستی نمی باشد.

شما می توانید در بخش Widths and responsiveness تعیین کنید که امکان کاهش پهنای ستون ها به یک دوازدهم پهنای صفحه وجود داشته باشد در این صورت پهنای ستون ها متناسب با اندازه صفحه نمایش دستگاهی که کاربر برای جستجو در وب سایت شما استفاده می نماید تغییر می کند. با این کار شما مطمئن خواهید شد که زمانی که کاربران تلفن های همراه به وب سایت شما مراجعه می نمایند نیاز به زوم کردن صفحه و استفاده مکرر از اسکرول برای مشاهده مطالب درون صفحه شما ندارند. برای تعیین پهنای ستون ها می توانید به باکس تنظیمات ستون ها یا Column Setting Box مراجعه نمایید.

در صفحه اصلی رابط کاربری ویژوال کامپوزر همان طور که پیشتر نیز به آن اشاره شد کلیدی وجود دارد به رنگ طوسی که بر آن حرف “T” که مخفف Template است نوشته شده است. به این کلید آیکون تمپلیت گفته می شود. اگر شما بر روی این کلید کلیک نمایید باکس تمپلیت ها برای شما نمایش داده می شود. در این صفحه شما می توانید صفحه آرایی یا تمپلیت که برای یکی از صفحات خود ایجاد نموده اید به صورت یک تمپلیت مجزا ذخیره نمایید تا بتوانید آن را بر روی دیگر صفحات وب سایت خود اعمال کنید.

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

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

من به شما پیشنها می کنم که در ابتدای کار خود با ویژوال کامپوزر حتما از این تمپلیت ها استفاده کنید زیرا این تمپلیت های پیش فرض به شما کمک می کنند که درک درستی از افزونه ویژوال کامپوزر و امکانات آن بدست آورید. شما می توانید این تمپلیت های پیش فرض را نیز در لیست صفحه آرایی ها و یا تمپلیت های خودتان (My templates) ذخیره نمایید.

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

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

ویرایشگر Frontend ویژوال کامپوزر

همان طور که شما دوستان می دانید، ویرایشگر Frontend به شما این امکان را می دهد که صفحات در حال اجرای وب سایت خود را ویرایش نمایید.
برای آنکه از ویرایشگر Backend ویژوال کامپوزر به ویرایشگر Frontend آن سوییچ کنید باید بر روی کلید Frontend Editor در بالای صفحه و در بخش Post Editor کلیک نمایید. به خاطر داشته باشید که پیش از آنکه از حالت ویرایشگر Backend به ویرایشگر Frontend سوییچ کنید و یا بالعکس، حتما تغییرات و ویرایش هایی که انجام داده اید را ذخیره کنید، در صورت عدم ذخیره سازی ویرایش ها تمامی تغییرات ایجاد شده توسط شما به حالت اولیه باز می گردند و وقت و زحمات شما تلف می شود.

از نظر من ویرایشگر Backend بیشتر برای ایجاد ساختار صفحات و ایجاد تغییرات ساختاری در وب سایت مناسب می باشد و ویرایشگر Frontend بیشتر برای ایجاد تغییرات جزیی در وب سایت مناسب است. البته بسیاری از کاربران ورد پرس ترجیح می دهند که تمامی ویرایش های خود را در ویرایشگر Backend انجام دهند و بسیاری دیگر دوست دارند که تمامی کارهای ویرایشی را در ویرایشگر Frontend انجام دهند و این مساله کاملا به سلیقه شخصی آنها وابسته می باشد.

در ویرایشگر Frontend ویژوال کمپرسور شما با کلیک کردن بر روی Content Block یا بلوک محتوا، همان گزینه هایی را مشاهده خواهید نمود که در ویرایشگر Backend ویژوال کامپوزر آنها را مشاهده نموده بودید. این گزینه ها شامل گزینه ای برای ایجاد سطر های جدید، گزینه ای برای ایجاد ستون های جدید، گزینه هایی برای ویرایش سطر ها و ستون ها و گزینه های برای حذف آنها و … می باشد.

در بالای صفحه ویرایشگر Frontend ویژوال کمپرسور شما کلید های مشابهی با آنچه در ویرایشگر Backend مشاهده نموده بودید وجود دارد، کلیدی با علامت “+” بر روی آن که برای اضافه کردن المان محتوای جدید استفاده می شود، کلیدی با علامت “T” بر روی آن که برای بار گذاری تمپلیت های پیش فرض استفاده می شود، کلیدی با علامت چرخ دنده که برای ایجاد تغییرات در تنظیمات می توان از آن استفاده نمود. علاوه بر کلید های نام برده کلید های دیگری نیز در بالای صفحه ویرایشگر Frontend ویژوال کمپرسور وجود دارد، یکی از کلید ها که عبارت “Save Draft” بر روی آن حک شده است برای ذخیره پیش نویس ها و دیگری که عبارت “Publish” بر روی آن حک شده برای انتشار محتوای ایجاد شده کاربرد دارد و در کنار تمامی این کلید ها کلیدی برای سوییچ کردن به ویرایشگر Backend نیز موجود می باشد.

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

علاوه بر تمامی کلید های نام برده، کلید دیگری در بالای رابط کاربری ویرایشگر Frontend ویژوال کامپوزر وجود دارد که بر روی آن عبارت “Guides ON” حک شده است، شما می توانید با فشردن این کلید ببینید که صفحه شما بدون اعمال تغییرات ایجاد شده با استفاده از المان های محتوای ویژوال کامپوزر به چه شکل بوده است. در واقع این کلید تمامی اقدامات انجام شده شما در جهت ویرایش صفحه با استفاده از ویژوال کامپوزر را می تواند غیر فعال کند تا شما بررسی کنید که پیش از اعمال تغییرات صفحات شما به چه شکل بوده اند.

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

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

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

تنظیمات ویژوال کامپوزر

محیط تنظیمات ویژوال کامپوزر دارای ۵ زبانه مجزا می باشد که در ادامه هریک از آنها را به صورت مجزا برای شما توضیح خواهم داد.

  1. زبانه اول که Home نام دارد امکان انجام تنظیمات عمومی و کلی را به کاربران می دهد.در بالای صفحه آپشنی وجود دارد که به شما این امکان را می دهد که نوع پست هایی که می خواهید ویژوال کامپوزر بر روی آن ها قابل استفاده باشد را انتخاب نمایید. در واقع در این بخش شما می توانید ویژوال کامپوزر را در بخش های مختلف وب سایت خود فعال یا غیر فعال نمایید.
    یکی از بهترین آپشن های موجود در این صفحه رول ادیتور می باشد، با استفاده از این آپشن شما می توانید انتخاب کنید که هر یک از گروه های مختلف یوزرهای وب سایت، از کدامیک از ادیتورهای وب سایت بتوانند استفاده نمایند. برای مثال اگر شما در وب سایت خود علاوه بر ویرایشگر وردپرس ویرایشگر ویژوال کامپوزر را نیز داشته باشید، شما می توانید با استفاده از آپشن رول ادیتور امکان استفاده از تنها یکی از ادیتورها را به ادمینستریتورها یا مدیران وب سایت خود بدهید یا امکان استفاده از هر دو ویرایشگر را برای مدیران وب سایت آزاد کنید.
    در این بخش یک قابلیت منحصر به فرد دیگر نیز وجود دارد، شما می توانید در رول ادیتور امکان استفاده از برخی المان های محتوا را برای بعضی از گروه های مختلف یوزرهای سایت محدود نمایید. این امکان زمانی برای شما مفید خواهد بود که بخواهید برخی از گروه های یوزرهای وب سایت تنها به المان های محتوای مشخصی دسترسی داشته باشند و امکان استفاده از دیگر المان ها برای آنها مقدور نباشد.
  2. زبانه دوم در صفحه تنظیمات ویژوال کامپوزر به شما امکان تنظیم رنگبندی المان های محتوای ویژوال کامپوزر را می دهد. علاوه بر رنگ بندی در این زبانه شما می توانید فاصله مابین المان ها در حاشیه پایینی آنها را نیز تغییر دهید و آنها را به هم نزدیکتر و یا از هم دورتر کنید و همچنین سایز صفحه ویژوال کامپوزر را برای استفاده از آن در تلفن های همراه تنظیم نمایید.
  3. زبانه سوم در این صفحه تنظیمات به شما امکان استفاده از کد ها و کلاس های CSS مختلف برای ایجاد تنظیمات در ویژوال کامپوزر را می دهد. شما می توانید کدها و کلا های CSS مورد نظر خود را در این بخش وارد نمایید و سپس برای شکل دهی المان های محتوا در ویژوال کامپوزر آنها را فراخوانی نمایید.
  4. در زبانه چهارم در تنظیمات ویژوال کامپوزر شما می توانید اطلاعات مربوط به لایسنس خود را در آن وارد کنید تا هر زمانی که ورژن جدید و قابلیت های جدیدی از ویژوال کامپوزر ایجاد شد، پلاگین شما به صورت اتوماتیک آپدیت شود. علاوه بر این وارد کردن اطلاعات لایسنس موجب می شود که شما بتوانید از پشتیبانی های کمپانی تولید کننده این پلاگین استفاده نمایید. بسیاری از توسعه دهندگان نرم افزارهای مختلف، برای جلوگیری از استفاده غیر مجاز از نرم افزارشان چنین گزینه ای را در نرم افزارهای خود ایجاد می کنند که کاربران برای استفاده همه جانبه از نرم افزار نیازمند یک لایسنس باشند.
  5. در زبانه پنجم که آخرین زبانه موجود در صفحه تنظیمات ویژوال کامپوزر می باشد، شما می توانید کدهای اضافه ای را از دیگر پلاگین ها به ویژوال کامپوزر اضافه نمایید، این کار موجب می شود که شما بتوانید المان های محتوای دیگری بجز آنهایی که در ویژوال کامپوزر موجود هستند را در میان المان های محتوای ویژوال کامپوزر خود اضافه کنید و کارایی های آن را افزایش دهید.

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

نگاهی اجمالی به قابلیت های ویژوال کامپوزر

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

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

توسعه دادن ویژوال کامپوزر

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

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

نقاط ضعف ویژوال کامپوزر

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

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

متاسفانه ویژوال کامپوزر دارای این قابلیت نمی باشد و زمانی که کاربران نیاز به امکانات اضافه تری داشته باشند تنها می توانند از سایر افزونه ها و پلاگین هایی که با ویژوال کامپوزر سازگار می باشند استفاده نمایند.
البته در این ابزار یک المان محتوای ستون فرعی( Widgetized Widgetized sidebar) وجود دارد که برای کاربران تا حدودی استفاده از ویجت های ورد پرس را فراهم می کند. در تئوری این طور به نظر می رسد که این المان محتوای ستون فرعی Widgetized برای کاربران امکان استفاده از ویجت ها را فراهم می نماید اما در عمل استفاده از آن تا حدی مشکل و زمان بر است که کاربران کمتر ممکن است از آن استفاده کنند.

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

برای مثال شما فرض کنید که یک وب سایت با ۱۰۰ صفحه مجزا دارید و می خواهید در ۲۵ نمونه از این صفحات ویجت های مورد نظر خود را اضافه نمایید، اگر شما برای این کار از ویژوال کامپوزر استفاده کنید، ملزم به ایجاد ۲۵ ساید بار مجزا برای هر یک از ۲۵ صفحه مورد نظر خود خواهید بود. در عوض اگر شما از سایر پلاگین های پیج بیلدر برای این کار استفاده نمایید خواهید توانست تنها با درگ اند دراپ کردن، ویجت های مورد نظر خود را به محیط صفحات خود اضافه نمایید.امید است که WP Bakery این مساله را در آینده نزدیک حل کند و امکان اضافه کردن ویجت ها به صورت مستقیم در صفحات را برای کاربران ویژوال کامپوزر فراهم نماید.

مقایسه

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

  • هزینه ها

ویژوال کامپوزر از لحاظ قیمت گزینه بسیار مناسبی است و قیمتی که کاربران برای استفاده از آن باید بپردازند در مقایسه با سایر پلاگین های مشابه، بسیار کمتر است. ویژوال کامپوزر یک پلاگین پیشرفته است که قابلیت های بسیاری دارد و استفاده از آن برای کاربران مزایای زیادی دارد با این حال میزان هزینه ای که کاربران برای استفاده از آن باید بپردازند تنها ۲۸ دلار می باشد. این مقدار در برابر هزینه های بسیاری ابزارهای مشابه که در رقابت با ویژوال کامپوزر می باشند، به میزان چشم گیری کمتر می باشد.

برای مثال پلاگین پیج بیلدر Velocity Page امکانات کمتری نسبت به ویژوال کامپوزر دارد و از لحاظ قابلیت ها و امکاناتی که به کاربران ارائه می دهند این پلاگین ها قابل مقایسه نمی باشند، با این حال هزینه استفاده از این ابزار اگر تنها کاربر بخواهد آن را بر روی یک وب سایت استفاده نماید ۹۷ دلار، اگر کاربر بخواهد آن را بر روی سه وب سایت مجزا استفاده کند ۱۶۷ دلار و اگر کاربر بخواهد آن را بر روی تعداد نامحدودی از وب سایت ها استفاده نماید ۲۴۷ دلار می باشد. یکی دیگر از پیج بیلدر های مشابه که Beaver Builder نام دارد نیز هزینه هایی مشابه با لیست قیمت های گفته شده در بالا دارد.

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

  • قابلیت ها

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

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

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

  • زیبایی رابط کاربری

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

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

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

  • کاربردی بودن

رابط کاربری ویژوال کامپوزر هم در ویرایشگر Backend و هم در ویرایشگر Frontend بسیار ساده می باشد و استفاده از آن برای کاربران حتی در دفعه اول مراجعه هم کار مشکلی نمی باشد. اکثر کاربران در کمتر از ۱۵ دقیقه یاد میگیرند که چگونه المان های محتوا را استفاده کنند و آنها را بر روی سطر ها و ستون های صفحه ای که ایجاد نموده اند پیاده سازی نمایند.

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

البته در این پلاگین تمپلیت های پیش فرضی وجود دارند که می توانند پروسه یادگیری شما را آسان تر نمایند. شما می توانید با استفاده از این تمپلیت ها در ابتدای کار با این پلاگین و ایجاد تغییرات جزیی و محدود در آنها اندک اندک با تمامی المان های محتوا و چگونگی استفاده از آنها آشنا شوید.

  • پشتیبانی

ویژوال کامپوزر ابزاری است که سالیان سال کاربران ورد پرس از آن استفاده نموده اند و این ابزار در تمامی این سال ها به صورت مرتب بروز رسانی شده است و به قابلیت ها و کارایی های آن افزوده شده است. این ابزار به عنوان پر فروش ترین پلاگین در CodeCanyon توانسته است در تمامی سال های کار خود پشتیبانی های بی وقفه ای را به کاربران عرضه نماید و این روند از گذشته تا کنون ادامه داشته است.

نیازی نیست که شما نگران آن باشید که چگونه باید از این ابزار استفاد کنید و یا برای یادگیری آن باید از چه منبعی استفاده نمایید. یک مجموعه آموزشی کامل برای استفاده از این ابزار در وب سایت WP Bakery موجود است که شما می توانید با مراجعه به آن گام به گام با یادگیری این ابزار پیش بروید. اگر با مساله یا مشکلی در حین استفاده از ابزار مواجه شدید و یا سوالی برای شما پیش آمد شما می توانید با سوالات خود را از طریق گذاشتن یاد داشت در Help Center با توسعه دهندگان این پلاگین مطرح نمایید و یا می توانید از طریق گذاشتن کامنت در CodeCanyon مسائل خود را توسعه دهندگان در میان بگذارید.

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

  • سرعت

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

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

سخن پایانی

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

تنها زمینه ای که این ابزار نسبت به ابزارهای مشابه با آن دارای عملکرد ضعیف تری می باشد مساله عدم عملکرد قوی این ابزار در زمینه اضافه کردن ویجت های ورد پرس در آن است. سایر پیج بیلدرهای درگ اند دراپ مشابه مثل : MiniMax و Aqua Page Bilder در زمینه اضافه کردن ویجت های ورد پرس عملکرد منعطف تری نسبت به ویژوال کامپوزر دارند و به کاربران این امکان را می دهند که ویجت های مورد نظر خود را به سادگی به صفحات بیفزایند.

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

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

منبع : https://zefa.ir/what-is-a-visual-composer-full-introduction-of-its-features-and-comparison-with-other-a/

نظرات این مطلب

تعداد صفحات : 4

درباره ما
موضوعات
آمار سایت
  • کل مطالب : 194
  • کل نظرات : 0
  • افراد آنلاین : 1
  • تعداد اعضا : 0
  • بازدید امروز : 20
  • بازدید کننده امروز : 1
  • باردید دیروز : 17
  • بازدید کننده دیروز : 0
  • گوگل امروز : 0
  • گوگل دیروز : 0
  • بازدید هفته : 110
  • بازدید ماه : 257
  • بازدید سال : 1188
  • بازدید کلی : 1977963
  • <
    اطلاعات کاربری
    نام کاربری :
    رمز عبور :
  • فراموشی رمز عبور؟
  • خبر نامه


    معرفی وبلاگ به یک دوست


    ایمیل شما :

    ایمیل دوست شما :



    کدهای اختصاصی