
Divi WooCommerce Extended یک افزونه شخص ثالث برای Divi است که هدف آن تنها ابزاری باشد که برای ساخت وب سایت های تجارت الکترونیک با Divi نیاز دارید. این شامل پنج ماژول با ویژگی ها و گزینه های بسیار است. در این پست، نگاهی به Divi WooCommerce Extended خواهیم انداخت تا به شما کمک کنیم تصمیم بگیرید که آیا این محصول مناسب برای طراحی فروشگاه WooCommerce شما است یا خیر.
برنامه های افزودنی Divi WooCommerce
Divi WooCommerce Extended 5 ماژول به Divi Builder اضافه می کند. ماژول ها را می توان با هم، به طور مستقل، در صفحات محصول، صفحات فروشگاه و صفحات معمولی استفاده کرد.
امکانات عبارتند از:
- کالسکه کوچک
- یک نگاه سریع
- چرخ فلک محصول
- دسته بندی ها
- جستجوی آژاکس
- مدیر برگه
- مدیر پرداخت و
- پسوند کد کوتاه کتابخانه Divi
ما نگاهی دقیق تر به هر ماژول از طریق بسته طرح بندی عطر خود خواهیم داشت.
سبد خرید توسعه یافته Divi WooCommerce mini
ماژول Mini Cart گزینه های زیادی را برای نمایش نماد سبد خرید فراهم می کند. برای نوع نماد، از بین نمادهای خود Divi یا یک نماد سفارشی انتخاب کنید. نمادهای بومی شامل یک انتخابگر نماد است.
گزینه سفارشی به شما امکان می دهد یک نماد یا تصویر را از کتابخانه رسانه خود انتخاب کنید.
مینی کارت را می توان به صورت کشویی، روکش، خارج از بوم یا مدال نمایش داد. گزینههای ماشه شامل کلیک یا نگهداشتن است. گزینه های قرارگیری شامل بالا یا پایین و راست یا چپ است. همچنین میتوانید عنوانی اضافه کنید و مواردی را برای نمایش از فهرست انتخاب کنید.
گزینههای نوشتاری شامل دکمه مشاهده سبد خرید، دکمه پرداخت، و متن خالی سبد خرید است. همچنین شامل یک گزینه جداگانه برای پس زمینه سبد خرید است.
تنظیمات طراحی
تنظیمات طراحی به شما امکان می دهد رنگ نماد، اندازه، ارتفاع خط، سایه متن، فونت و غیره را سفارشی کنید. این موارد شامل گزینههایی برای تمام متنها از جمله تعداد محصولات، عنوان سبد خرید کوچک، نام محصول، مقدار و قیمت، کل فرعی است. همچنین شامل تنظیمات دکمه مشاهده سبد خرید، دکمه پرداخت، سبد خالی، اندازه سبد خرید و تنظیمات پیش فرض است. برای این مثال، رنگ و اندازه آیکون را تغییر دادم و یک سایه متن اضافه کردم. گزینه های متن در Visual Builder نمایش داده نمی شوند، بنابراین باید آنها را در قسمت جلویی مشاهده کنید.
نمونه هایی از چرخ دستی های کوچک
این مثال یک منوی کشویی را نشان می دهد. من یک ماژول محصولات DWE اضافه کردم و چند محصول را به سبد خریدم اضافه کردم. تعداد اقلام موجود در سبد خرید در بالای نماد سبد خرید نمایش داده می شود. وقتی روی سبد خرید کلیک می کنم، یک منوی کشویی باز می شود که محتویات سبد خرید من را نشان می دهد. همه عناصر را می توان استایل کرد. رنگ و اندازه سبد خرید را تغییر دادم، یک سایه اضافه کردم، فونت را تغییر دادم و اندازه فونت را افزایش دادم. من همچنین دکمه ها را طوری طراحی کرده ام که با دکمه های بسته طرح بندی مطابقت داشته باشند.
این مثال یک پوشش را نشان می دهد. می توانید آن را در هر یک از چهار گوشه صفحه قرار دهید.
این مثال Off Canvas را نشان می دهد. صفحه به یک طرف فشار داده می شود تا محتویات در جای خود قفل شوند. با کلیک بر روی هر نقطه از صفحه، پنجره بسته می شود. می توان آن را در سمت راست یا چپ صفحه نمایش قرار داد.
این مثال Modal را نشان می دهد. محتویات سبد خرید را روی صفحه نمایش می دهد و شامل ترفندهایی برای نشان دادن دکمه بستن، موقعیت دکمه بستن، انتخاب close یا esc و بستن با کلیک در پس زمینه است.
جستجوی محصول پیشرفته Divi WooCommerce Ajax
Divi WooCommerce Extended Product Ajax Search جستجوی محصول کاملاً قابل تنظیم را اضافه می کند. سفارشیسازیهای پیکربندی شامل محفظه جعبه جستجو، تعداد نتایج جستجو، ترتیب بر اساس، سفارش و متن بدون نتیجه است.
منطقه جستجو
برای منطقه جستجو، می توانید انتخاب کنید که ماژول کجا جستجو کند. شما می توانید از این تنظیمات استفاده کنید تا جستجوی خود را به همان اندازه که می خواهید گسترده یا محدود کنید.
نمایش دادن
گزینه های نمایش به شما امکان می دهد انتخاب کنید چه چیزی نمایش داده شود. میتوانید نماد جستجو را نشان دهید، فیلدها را انتخاب کنید، تعداد ستونها را انتخاب کنید و فاصله ستونها را انتخاب کنید. همچنین میتوانید نوار اسکرول را نمایش یا پنهان کنید.
زمینه
این شامل بسیاری از گزینه های پس زمینه است که شامل پس زمینه جعبه نتیجه جستجو، پس زمینه مورد نتیجه جستجو و تنظیمات پس زمینه سفارشی می شود.
تنظیمات طراحی
تنظیمات طراحی شامل تمام تنظیمات فونت، حاشیه ها، پس زمینه و غیره است. فیلدها، نماد جستجو، لودر و موارد دیگر را تنظیم کنید. در این مثال، فونت ها را تغییر دادم و نماد جستجو را استایل دادم. گوشه ها را هم گرد کردم و رنگ ها را عوض کردم.
نمونه های جستجوی محصول آژاکس
در اینجا نتایج جستجو با تنظیمات پیش فرض 1 ستون با استفاده از تنظیمات طراحی من از مثال بالا به نظر می رسد.
این مثال 2 ستون را نشان می دهد.
محصولات توسعه یافته Divi WooCommerce
Divi WooCommerce Extended Products محصولات WooCommerce را به صورت کارت در یک شبکه نمایش می دهد. با چندین نوع نما و طرح کاملاً قابل تنظیم است. این مثال از نوع نمای پیشفرض و طرحبندی 1 استفاده میکند. میتوانید تعداد محصولات را برای نمایش انتخاب کنید، در صورتی که محصولی قبلاً در ماژول دیگری نمایش داده شده است، یک عدد افست اضافه کنید و گزینههای سفارش را تنظیم کنید.
برای نوع نمایش، گزینه پیشفرض را انتخاب کنید یا نمایش محصولات ویژه، محصولات فروش، محصولات پرفروش یا محصولات دارای رتبه برتر را انتخاب کنید.
شامل 3 گزینه طرح بندی. آنها آیتم ها را در مکان های مختلف داخل نقشه ها قرار می دهند. Layout 1 قیمت را بالای دکمه افزودن به سبد خرید قرار می دهد. این مثال طرح 2 را نشان می دهد که آنها را در کنار یکدیگر قرار می دهد.
Layout 3 دکمه افزودن به سبد خرید را بالای عنوان قرار می دهد.
میتوانید محصولاتی را که موجود نیستند نشان دهید یا پنهان کنید. اگر آنها را پنهان کنید، میتوانید در صورت تمایل آنها را بهعنوان در انبار علامتگذاری کنید، یا برچسبی را که میخواهید استفاده کنید اضافه کنید. همچنین میتوانید دستهها و برچسبها را انتخاب کنید و پیوند طبقهبندی را برای کنترل منطقی انتخاب کنید.
نمایش دادن
گزینههای نمایش به شما امکان میدهند تعداد ستونها، فاصله ستونها، نمایش سنگتراشی، نمایش یک فهرست کشویی مرتبسازی، نمایش پیوند مشاهده سریع، افزودن متن و نماد مشاهده سریع، انتخاب عناصر برای نمایش، بله افزودن جلوههای زوم، انتخاب اندازه تصویر کوچک ، و بیشتر. شما می توانید هر یک از عناصر را به صورت جداگانه فعال کنید، بنابراین می توانید تصاویر، نشان فروش و غیره را غیرفعال کنید. من این مثال را به 2 ستون تغییر دادم، برچسب فروش را استایل دادم و دکمه را سفارشی کردم.
صفحه بندی
صفحه بندی شماره صفحات را اضافه می کند. همچنین میتوانید لینکهای قبلی و بعدی را فعال کرده و متنی را که میخواهید نمایش داده شود، اضافه کنید.
پس زمینه محصول
تنظیمات پسزمینه محصول، پسزمینه ناحیه متن نقشه را کنترل میکند.
تنظیمات طراحی
تنظیمات طراحی به شما امکان می دهد هر عنصر را به طور مستقل تنظیم کنید. شما کنترل کاملی روی اندازه ها، رنگ ها، فونت ها، پس زمینه ها، حاشیه ها و غیره دارید. من بسیاری از تنظیمات را در این مثال تنظیم کردم.
چرخ فلک محصول پیشرفته Divi WooCommerce
چرخ فلک Divi WooCommerce Extended Products محصولات WooCommerce را در یک نوار لغزنده ارائه می دهد. این شامل تنظیمات مشابه ماژول WCE Products است و تنظیماتی را برای چرخ فلک اضافه می کند. میتوانید نوع محصول، طرحبندی، شماره نمایش، مرتبسازی، مخفی کردن محصولات موجود در انبار، انتخاب دستهها و غیره را انتخاب کنید.
نمایش دادن
همه گزینه های نمایش نیز یکسان هستند. نمایش یک دکمه مشاهده سریع، انتخاب موارد برای نمایش یا پنهان کردن، اضافه کردن متن و نشان دادن نشان فروش.
لغزنده
صفحه بندی را شامل نمی شود. در عوض، گزینه های کشویی وجود دارد. افکت اسلاید را بین اسلاید، مکعب، پوشش و تلنگر انتخاب کنید. هر کدام از گزینه ها تنظیمات مختلفی دارند. تعداد محصولات را برای نمایش در یک اسلاید انتخاب کنید، فاصله بین اسلایدها را تنظیم کنید، ارتفاعات را تراز کنید، حلقه را فعال کنید، پخش خودکار را فعال کنید، سرعت را تنظیم کنید و غیره. این مثال Coverflow را نشان می دهد.
نوار لغزنده همچنین شامل انواع ناوبری استاندارد است. می توانید آنها را نشان دهید یا غیرفعال کنید. همچنین می توانید فلش ها را از لیست نمادها انتخاب کنید، آنها را فقط در حالت انتظار نشان دهید و موقعیت آنها را از بین 8 گزینه انتخاب کنید. این گزینه پیش فرض را در نوار لغزنده نشان می دهد. این مثال فلش ها را در موقعیت پیش فرض خود نشان می دهد.
این مثال فلش ها را در مرکز بالا نشان می دهد.
همچنین شامل صفحه بندی نقطه ای با 6 سبک برای انتخاب است. این مثال یک نقطه جامد را نشان می دهد.
این مثال یک خط گرد را نشان می دهد.
علاوه بر این، گزینه ای به نام Dynamic Dots وجود دارد. این اندازه نقاط را تغییر می دهد تا نشان دهد که نزدیکترین نقاط به اسلاید فعلی بزرگتر از نقاط دورتر هستند.
تنظیمات طراحی
تنظیمات طراحی شامل گزینه هایی برای هر عنصر لغزنده است. من رنگ فونت، رنگ پس زمینه، حاشیه، فلش و نقطه را در این مثال تنظیم کردم.
دسته بندی محصولات پیشرفته Divi WooCommerce
Divi WooCommerce Extended Products Categories کارت هایی ایجاد می کند که هر یک از دسته ها را در فروشگاه WooCommerce شما نشان می دهد. این شامل 2 طرح بندی است و می توانید دسته بندی هایی را که می خواهید نمایش دهید انتخاب کنید. این طرح بندی 1 است. عنوان و تعداد موارد موجود در آن دسته را در زیر تصویر مشخص شده برای دسته قرار می دهد.
این طرح 2 است. عنوان و تعداد موارد را روی تصویر قرار می دهد و نقشه را به صورت یک مربع مشخص نشان می دهد.
نمایش دادن
گزینه های نمایش شامل تعداد ستون ها، فاصله ستون ها، سنگ تراشی، تصویر کوچک، جلوه زوم، اندازه تصویر کوچک و تعداد محصولات می باشد.
زمینه
تنظیمات پس زمینه یک رنگ پس زمینه پشت عنوان و تعداد محصولات را تعیین می کند.
پس زمینه با طرح 2 به این شکل است.
تنظیمات طراحی
تنظیمات طراحی شامل گزینه هایی برای همه عناصر است. در این مثال، من رنگ متن، اندازه، وزن، فاصله را برای مطابقت با سبکی که در قالب صفحه و بسته طرح بندی عطر استفاده می کردیم، تنظیم کردم.
Divi WooCommerce Extended را از کجا بخریم
Divi WooCommerce Extended با قیمت 59 دلار در بازار Divi موجود است. این شامل استفاده نامحدود، 1 سال پشتیبانی و به روز رسانی، و 20 روز ضمانت بازگشت پول است.
پایان افکار
این نگاه سریع ما به Divi WooCommerce Extended است. این پنج ماژول برای ساخت صفحات فروشگاهی برای محصولات WooCommerce شما، قابلیت های زیادی را به Divi اضافه می کنند. من فقط ویژگی های اصلی را لمس کرده ام و به راحتی می توان فهمید که چقدر قدرتمند است. اگر علاقه مند به افزودن ویژگی های جدید به فروشگاه WooCommerce خود هستید، Divi WooCommerce Extended ارزش دیدن دارد.
ما می خواهیم از تو بشنویم. آیا Divi WooCommerce Extended را امتحان کرده اید؟ نظر خود را در مورد آن در نظرات با ما در میان بگذارید.