راهنمای کامل انتخاب رنگ یا تصویر در ووکامرس برای فروشگاه های آنلاین

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

15 بهمن 1404

بدون دیدگاه

تیم محتوا نایس کدرز

اشتراک گذاری:

زمان مطالعه:

حدودا 16 دقیقه

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

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

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

انتخاب رنگ یا تصویر در ووکامرس (WooCommerce Color or Image Swatches)

افزونه WooCommerce Variation Swatches and Photos این امکان را به شما می‌دهد که به جای استفاده از منوی کشویی برای نمایش ویژگی‌های محصولات متغیر، رنگ‌ها و تصاویر محصول را به نمایش بگذارید. این قابلیت باعث می‌شود مشتریان تجربه خرید بصری‌تر و جذاب‌تری داشته باشند و سریع‌تر بتوانند تصمیم بگیرند.

نصب افزونه

برای نصب افزونه مراحل زیر را دنبال کنید:

فایل .zip افزونه را از حساب کاربری ووکامرس خود دانلود کنید.
به مسیر WordPress Admin > Plugins > Add New بروید و فایل دانلود شده را آپلود کنید.
افزونه را فعال کنید.

برای اطلاعات بیشتر می‌توانید به بخش Installing and Managing Plugins در مستندات ووکامرس مراجعه کنید.

راه‌اندازی انتخاب رنگ یا تصویر در ووکامرس

برای استفاده از رنگ‌ها یا تصاویر برای محصولات متغیر، ابتدا باید آن‌ها را به ویژگی‌های محصول (Product Attributes) متصل کنید. ویژگی‌ها می‌توانند به دو صورت تعریف شوند:

ویژگی‌های سراسری (Global attributes): برای تمام فروشگاه شما قابل استفاده هستند.
ویژگی‌های هر محصول (Per product attributes): فقط برای یک محصول خاص قابل استفاده هستند.

راه‌اندازی رنگ و تصویر برای ویژگی‌های سراسری

به مسیر Products > Attributes بروید.
یک ویژگی جدید ایجاد کنید یا اگر قبلاً ویژگی دارید، این مرحله را رد کنید.
روی گزینه Edit یا Configure Terms کلیک کنید تا ویژگی مورد نظر را ویرایش کنید.

انتخاب رنگ یا تصویر در ووکامرس
یک رنگ جدید یا هر نام دیگری که برای ویژگی انتخاب کرده‌اید اضافه کنید یا یک گزینه موجود را ویرایش کنید.
در منوی کشویی Swatch Type گزینه Color یا Image را انتخاب کنید.

اگر گزینه Color را انتخاب کرده‌اید، می‌توانید روی آیکون رنگ کلیک کرده و رنگ موردنظر خود را از ابزار انتخاب رنگ انتخاب کنید یا مقدار HEX رنگ را وارد کنید.
اگر گزینه Image را انتخاب کرده‌اید، می‌توانید تصویر موردنظر خود را آپلود کنید.

انتخاب رنگ یا تصویر در ووکامرس

برای ذخیره تغییرات، روی Add New Color کلیک کنید.

برای اطلاعات بیشتر درباره مدیریت ویژگی‌های سراسری محصول، می‌توانید به بخش Managing Attributes در مستندات ووکامرس مراجعه کنید.

هشدار: اگر نام یا اسلاگ ویژگی را تغییر دهید، پیکربندی Swatches به‌طور دائمی از بین خواهد رفت.

افزودن گزینه های رنگ و تصویر به محصولات متغیر

گزینه‌های رنگ و تصویر فقط برای محصولات متغیر قابل استفاده هستند. برای افزودن آن‌ها مراحل زیر را دنبال کنید:

ساخت محصول متغیر:
ابتدا یک محصول متغیر ایجاد کنید. مطمئن شوید که یک ویژگی سراسری (Global Attribute) را انتخاب کرده‌اید یا یک ویژگی سفارشی در تب Attributes ایجاد کرده‌اید. همچنین تب Variations را تنظیم کنید. برای اطلاعات بیشتر می‌توانید به مستندات ووکامرس مراجعه کنید.
انتشار محصول:
محصول خود را منتشر کنید تا بتوانید گزینه‌های رنگ و تصویر را اضافه کنید.
رفتن به تب Swatches:
به تب Swatches بروید تا نوع نمایش گزینه‌ها را برای ویژگی‌های محصول مشخص کنید.
انتخاب نوع نمایش برای هر ویژگی:
- None: گزینه‌ها به صورت منوی کشویی نمایش داده می‌شوند.
- Taxonomy Colors and Images: گزینه‌های ویژگی سراسری نمایش داده می‌شوند (فقط برای ویژگی‌های سراسری موجود است).
- Custom Colors and Images: امکان افزودن دستی گزینه‌های رنگ و تصویر برای محصول فراهم می‌شود.
- Radio Buttons: گزینه‌های موجود به صورت دکمه‌های رادیویی نمایش داده می‌شوند.
انتخاب نمایش برچسب (Label):
اگر گزینه Taxonomy Colors and Images یا Custom Colors and Images را انتخاب کرده‌اید، می‌توانید تعیین کنید که آیا نام ویژگی نمایش داده شود یا خیر و در چه موقعیتی برچسب نمایش داده شود. این برچسب نام ترم انتخاب شده را نشان می‌دهد.

افزودن گزینه های رنگ و تصویر به محصولات متغیر
تنظیم اندازه Swatches:
اگر گزینه Custom Colors and Images را انتخاب کرده‌اید، می‌توانید اندازه Swatches را مشخص کنید. این تنظیم تعیین می‌کند که گزینه‌های رنگ یا تصویر محصول نمایش داده شوند.

افزودن گزینه های رنگ و تصویر به محصولات متغیر
پیکربندی ترم‌های ویژگی:
این مرحله مشابه پیکربندی ویژگی‌های سراسری است:
- ترم موردنظر را انتخاب کنید.
- تعیین کنید که گزینه Color باشد یا Image.
- اگر گزینه Color انتخاب شده، رنگ موردنظر را انتخاب کنید.
- اگر گزینه Image انتخاب شده، تصویر موردنظر را آپلود کنید.
  
  افزودن گزینه های رنگ و تصویر به محصولات متغیر
به‌روزرسانی محصول:
پس از اعمال تغییرات، محصول را بروزرسانی کنید تا گزینه‌های رنگ و تصویر در صفحه محصول فعال شوند.

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

سازگاری با سایر افزونه‌ها و نکات مهم

سازگاری با سایر افزونه‌ها

مجموعه CSV Import در حال حاضر توانایی وارد کردن تنظیمات Swatch را ندارد.
محصولات گروهی (Grouped Products) در حال حاضر با این افزونه سازگار نیستند و پشتیبانی نمی‌شوند.

سؤالات متداول (FAQs)

۱. چگونه اندازه Swatches تصویر را تغییر دهم؟

شما می‌توانید اندازه را در مسیر زیر تغییر دهید:

WooCommerce > Settings > Products > Display

پس از تغییر اندازه، لازم است تصاویر خود را دوباره با استفاده از افزونه AJAX thumbnail rebuild بازسازی کنید تا اندازه جدید اعمال شود.

۲. فایل‌های قالب (Template Files) را کجا قرار دهم؟

فایل‌ها باید در مسیر زیر قرار گیرند:
/yourtheme/woocommerce-swatches/single-product/variable.php

توجه: از نسخه ۲.۰ به بعد، امکان بازنویسی قالب به روش قدیمی دیگر وجود ندارد. به جای آن، باید از فیلترهای موجود در فایل woocommerce-swatches-template-functions.php استفاده کنید.

۳. چرا تصویر اصلی محصول هنگام انتخاب ویژگی‌ها تغییر نمی‌کند؟

افزونه WooCommerce Variation Swatches and Photos امکان افزودن تصویر یا رنگ برای هر ویژگی را فراهم می‌کند، اما تصویر اصلی محصول را به‌طور خودکار تغییر نمی‌دهد.

برای تغییر تصویر اصلی، باید به گزینه‌های Variations محصول بروید و برای هر تغییر یک تصویر بارگذاری کنید.

مثال: اگر دو ویژگی برای یک تیشرت دارید، مانند رنگ و طرح:

افزونه Variation Swatches and Photos برای ویژگی رنگ استفاده می‌شود تا رنگ‌ها نمایش داده شوند.
ویژگی طرح برای خود محصول تیشرت استفاده می‌شود.
اگر رنگ و طرح انتخاب شود، نیاز به تصویری برای این تغییر است که ترکیبی از رنگ و طرح انتخاب شده را نمایش دهد.

۴. چرا Swatchها ذخیره نمی‌شوند؟

افزونه Variation Swatches and Photos بعد از تقریباً ۳۰ مقدار، Swatch یا تصویر را ذخیره نمی‌کند (این تعداد بسته به سیستم متفاوت است).

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

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

نتیجه‌گیری

استفاده از انتخاب رنگ یا تصویر در ووکامرس یکی از روش‌های مؤثر برای بهبود تجربه خرید مشتری و افزایش فروش است. افزونه WooCommerce Variation Swatches and Photos به شما امکان می‌دهد رنگ‌ها و تصاویر محصولات متغیر را به شکل بصری نمایش دهید.

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

منبع : woocommerce