بیش از 130 المان سفارشی سازی شده المنتور

شبکه محصول

ابزارک های پیشرفته المنتور

شروع کنید

شبکه محصول ووکامرس

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

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

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

نحوه نصب ابزارک شبکه محصول ووکامرس ایکس پرو برای المنتور

موارد مورد نیاز

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

برای فعال کردن ابزارک، به سادگی مراحل زیر را دنبال کنید:

مرحله 1

روی گزینه افزونه ایکس پرو موجود در منوی داشبورد وردپرس کلیک کنید.

مرحله 2

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

Xpro Addons dashboard highlighting Woo Product Grid

نحوه استفاده از ابزارک محصول ایکس پرو برای المنتور

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

مرحله 1

روی قسمت افزونه ایکس پرو موجود در تنظیمات المنتور کلیک کنید.

مرحله 2

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

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

Elementor WooCommerce Product Grid widget view

بخش محتوا

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

Woo Product Grid widget for Elementor layout

گزینه های زیر را فعال کنید تا این ویژگی ها یا محتوا در ابزارک محصول مربوطه نمایش داده شوند.Show

  • دسته بندی: با فعال کردن این گزینه به صورت پویا دسته بندی محصول نمایش داده می شود.
  • نمایش عنوان: با فعال کردن این گزینه عنوان محصول به صورت پویا نمایش داده می شود.
  • نمایش توضیحات: نمایش پویا توضیحات محصول.
  • نمایش رتبه: نشان دادن رتبه بندی محصول توسط مشتریان.
  • نمایش قیمت: گزینه نمایش قیمت محصول را فعال یا غیرفعال کنید.
  • انیمیشن: فعال کردن گزینه به شما امکان می دهد تا گزینه نمایش سریع و سبد خرید را فعال کنید.
  • دکمه فراخوان: به گزینه اضافه کردن دکمه Call to Action اجازه دهید
Product Grid Widget WooCommerce
نحوه افزودن محصولات با منوی پرس و جو

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

WooCommerce Grid widget

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

Grid Product widget for Elementor

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

WooCommerce Elementor Product Grid widget

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

Woo Product Grid Widget

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

Quick View of Product Grid widget
نحوه نمایش نشان ها در ابزارک محصول ووکامرس

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

Badges in Elementor Product Grid widget
نحوه فعال کردن صفحه بندی در ابزارک شبکه محصولات ووکامرس ایکس پرو

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

Adding pagination in Grid widget for Elementor

نحوه استایل کردن ابزارک شبکه محصولات ووکامرس ایکس پرو

ارتفاع تصویر را در ابزارک شبکه پست و فاصله بین هر شبکه تنظیم کنید. پس زمینه را با رنگ های کلاسیک یا گرادیان رنگ کنید.

Styling product grid widget

با جعبه سایه به هر جعبه یک سایه بدهید. ظاهر سایه را با مدیریت موقعیت افقی و عمودی و تاری و گسترش آن تنظیم کنید.

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

  • None
  • Solid
  • Double
  • Dotted
  • Dashed
  • Groove

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

adding border in Elementor grid widget
نحوه استایل دادن به محتوا در ابزارک شبکه محصولات ووکامرس ایکس پرو

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

styling content in elementor product grid widget
نحوه استایل دادن به دسته، عنوان و توضیحات

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

متن را برای نمایش عادی خود و زمانی که کاربر ماوس را به بالای آن می کشد رنگ کنید. برای توضیح، گزینه ای برای رنگ شناور ندارید. علاوه بر این، حاشیه را از هر بخش تنظیم کنید.

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

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

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

نحوه استایل دادن به محتوای پاپ آپ در شبکه محصول

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

Quick view styling in grid widget

با انتخاب نوع محصول و تنظیم عرض، حاشیه و رنگ آن، یک حاشیه ایجاد کنید.

با تغییر تایپوگرافی، رنگ عنوان و رنگ عنوان، به صفحه نمایش SKU حالت دهید.

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

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

نحوه استایل دهی در نمای سریع پاپ آپ

رتبه بندی سبک با شخصی سازی تایپوگرافی متن و همچنین رنگ آن. اندازه ستاره را تنظیم کنید و آن را رنگ کنید تا رتبه و پس زمینه پر شود.

با مدیریت تایپوگرافی، رنگ و فضای بین آن، قیمت و قیمت فروش را به سبک نمایش دهید.

نحوه استایل کردن دکمه پاپ آپ در شبکه محصول

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

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

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

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

نحوه طراحی تغییرات پاپ آپ در ابزارک شبکه محصول

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

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

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

Popup view of woocommerce product
نحوه استایل دادن به نشان ها در ابزارک شبکه محصول ووکامرس

متن را در نشان با گزینه تایپوگرافی استایل دهید. فونت سبک، اندازه، و دیگر سفارشی‌سازی‌های متن. شما می توانید یک سایه و حاشیه به نشان اضافه کنید.

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

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

نحوه صفحه بندی در شبه محصول وردپرس

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

بهترین ابزارک شبکه پست ووکامرس ایکس پرو

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

ایکس پرو طیف گسترده‌ای از ابزارک ها، قالب‌های المنتور و ویژگی‌هایی را ارائه می‌کند که به طراحان کمک می‌کند جذابیت ایجاد کنند.