كيفية إنشاء حوامل تنوع الراديو والتسمية واللون والصورة لسمات منتج WooCommerce المتغير

نشرت: 2018-06-13

حامل تنوع منتجات WooCommerce عبارة عن تقنية رائعة تم تقديمها لتعزيز مبيعات الموقع والتحويل.

أفكر لماذا حوامل لا تصدق ، أليس كذلك؟

حوامل تنوع المنتج تحل محل تنوع منتج WooCommerce الافتراضي ، حدد حقل القائمة المنسدلة وقم بتمكين حوامل اللون والصورة والتسمية والراديو. وبالتالي ، يمكن للعملاء بسهولة تحديد نوع المنتج المطلوب وإضافته إلى عربة التسوق على الفور.

في هذا البرنامج التعليمي ، سأوضح لك كيف يمكنك تمكين حوامل تباين الراديو والتسمية واللون والصورة في منتج WooCommerce المتغير باستخدام OceanWP Theme .

أفترض أن لديك سمة OceanWP مثبتة. لتمكين الحوامل في منتجاتك المتغيرة ، قم بتثبيت المكون الإضافي WooCommerce Variation Swatches أولاً.

عرض حي | تنزيل البرنامج المساعد WooCommerce Variation Swatches

تثبيت حوامل WooCommerce Variation

يمكنك تنزيل البرنامج المساعد WooCommerce Variation Swatches من الواجهة الخلفية لموقعك أيضًا. حدد بدء تثبيت الإضافات من أعلى إشعار المسؤول.

قم بتثبيت وتنشيط WooCommerce Variation Swatches و Ocean Extra plugin.

إذا لم تحصل على الإشعار العلوي لتثبيت المكون الإضافي Swatches ، فانتقل إلى Plugins >> Add New . ابحث عن WooCommerce Variation Swatches في حقل البحث. تثبيت وتفعيل البرنامج المساعد WooCommerce Variation Swatches بواسطة عمران أحمد .

بعد تثبيت البرنامج المساعد وتنشيطه بنجاح ، حان الوقت لإنشاء حوامل الراديو والتسمية واللون والصورة في سمة OceanWP. لنبدأ العملية.

إعداد حوامل WooCommerce Variation

بعد تثبيت البرنامج المساعد Woocommerce Variation Swatches والصور في سمة OceanWP الخاصة بك. حان الوقت لتكوين هذا البرنامج المساعد لمنتجاتك المتغيرة. هناك طريقتان لتثبيت هذا البرنامج المساعد.

  1. تمكين حوامل التباين للمنتجات المتغيرة الموجودة
  2. إعداد حوامل التباين للمنتجات المتغيرة الجديدة

في هذا البرنامج التعليمي ، سأصف كلا الطريقتين.

تمكين حوامل التباين للمنتجات المتغيرة الموجودة

لدى العديد منكم بالفعل منتجات متغيرة تم إنشاؤها في متجرك. إذا كنت ترغب في تحويل القائمة المنسدلة لأشكال المنتج المحددة إلى حوامل الراديو والتسمية واللون والصور ، فقد اتبعت هذا البرنامج التعليمي من هنا. تحقق من لقطة الشاشة التالية. تبدو القائمة المنسدلة لاختيار الشكل الافتراضي حاليًا مثل لقطة الشاشة التالية في موقعك. في الخطوات القادمة ، سأوضح لك كيف تقوم بتحويل حقل تحديد التباين إلى حوامل جميلة.

قبل

Oceanwp

بعد

الخطوة 01: تحرير السمة

توجه إلى المنتجات >> السمات . يتم سرد جميع السمات العامة الموجودة في قسم السمات. بعد تثبيت البرنامج المساعد WooCommerce Variation Swatches ، فإنه يضيف حقل النوع . بشكل افتراضي ، سيظهر التحديد تحت عنوان النوع .

نظرًا لأن البرنامج المساعد WooCommerce Swatches يأتي مع ثلاثة أنواع من السمات: اللون والصورة والأزرار. يمكنك تعيين أي نوع سمة للسمة التي تريدها.

لغرض العرض التوضيحي ، تم إنشاء سمة الأقمشة والنمط والتسمية . أضف نوع سمة اللون لسمة النمط ونوع سمة الصورة لسمة الأقمشة ونوع سمة الزر لسمة التسمية .

لتعيين نوع سمة اللون إلى سمة النمط ، انقر فوق تحرير .

حدد نوع اللون من القائمة المنسدلة للنوع.

عودة المنتجات >> السمات . تحرير سمة الأقمشة مثل سمة النمط .

استرجع المنتجات >> السمات مرة أخرى. تحرير سمة Label مثل سمة Fabrics و Pattern .

عند اكتمال اختيار نوع السمة ، ارجع إلى صفحة قائمة السمات. قد تبدو قائمة السمات بالصورة التالية.

ستبدو الواجهة الأمامية للمنتج مثل لقطة الشاشة التالية بعد تحديد أنواع السمات لسمات المنتج.

تبدو الاختلافات الخاصة بسمة Label جيدة ، لكن الاختلافات في سمة النمط تحتاج إلى تحديد الألوان والاختلافات لسمة Fabrics التي تحتاج إلى إضافة صور.

الخطوة 02: تحرير الاختلافات

لتعريف الألوان على أنها اختلافات داخل سمة النمط . توجه إلى المنتجات >> السمات . حدد تكوين المصطلحات من سمة الأنماط .

بعد تحديد شروط التهيئة ، تظهر قائمة بأشكال السمات. بالنسبة للنمط ، تم سرد ثلاثة أشكال مختلفة: الأزرق والأخضر والأحمر هنا. قم بتحرير كل شكل واحدًا تلو الآخر لإضافة لون مختلف.

للتوضيح ، حدد تحرير الارتباط للتنوع الأخضر .

من لوحة تعديل التباينات. حدد اللون المطلوب من Colorpicker وقم بتحديث التغييرات بالضغط على زر التحديث .

عندما يتم تحديث جميع الألوان المختلفة بنجاح ، فإن مظهر الواجهة الأمامية يحب ما يلي.

بعد تحديث تباينات سمات النمط ، قم بتحرير سمة الأقمشة بتحديد تكوين المصطلحات مثل سمة النمط .

بعد الضغط على تكوين الشروط ، تظهر قائمة بمصطلح الأقمشة مثل النمط. قم بتحرير كل شكل لإدراج صورة متباينة. لغرض العرض ، قم بتحرير الرابط لسمة Chambray .

من لوحة تعديل التباينات. قم بتحميل صورة الشكل المطلوب من الصورة وقم بتحديث التغييرات بالضغط على زر التحديث .

بعد تحديث الصور لجميع الأشكال ، ستحب الواجهة الأمامية لقطة الشاشة التالية.

قم بإعداد حوامل التباين للمنتجات المتغيرة الجديدة

هذه هي الخطوة لأولئك الذين ليس لديهم أي منتج متغير تم إنشاؤه لمتجرهم. أولاً ، سنقوم بإنشاء منتجات متغيرة وتمكين الحوامل لها.

الخطوة 01: إنشاء سمات وتنوعات عالمية

بعد تثبيت البرنامج المساعد وتنشيطه بنجاح ، أنشئ السمة التي تريدها عالميًا من المنتجات >> السمات . قم بإنشاء نمط وأقمشة وطول وحجم متغير أدخل عنوان السمة ونوع السمة المقابلة من القائمة المنسدلة النوع.

عندما يتم إنشاء سمة اللون والصورة والتسمية ، والأقمشة ، والتسمية والحجم بنجاح ، فإنها تُنشئ قائمة بالسمات في اليسار.

بعد إنشاء السمات العامة ، أضف تباينات السمات باختيار تكوين المصطلحات. لإنشاء أشكال مختلفة لسمات النمط ، حدد تكوين روابط المصطلحات . املأ حقل الاسم وحدد رموز الألوان. قم بإنشاء اختلافات الأخضر والأزرق والأحمر لسمات اللون.

تظهر قائمة بأشكال السمات في الشاشة اليسرى بعد إضافة متغيرات لسمات النمط .

الحصول على المنتجات >> السمات مرة أخرى. إنشاء اختلافات لسمات الأقمشة ، حدد تكوين روابط المصطلحات من الأقمشة . املأ حقل الاسم وأضف صورة متنوعة من مكتبة الوسائط أو قم بتحميلها من الكمبيوتر.

قم بإنشاء اختلافات Chambray و Corduroy و Embossed لسمات الصورة وستظهر في اليسار.

قم بإنشاء اختلافات لسمات الراديو والتسمية مثل اختلافات الصورة واللون.

الخطوة 02: عرض العينات في صفحة المنتج المتغير

لتمكين الحوامل على صفحة المنتج المتغير. ادخل إلى وضع تحرير المنتج المطلوب ، وحدد منتجًا متغيرًا من بيانات المنتج .

توجه إلى علامة التبويب السمات . انقر فوق القائمة المنسدلة لسمات المنتج المخصصة . هنا تظهر جميع السمات التي تم إنشاؤها عالميًا. أضف جميع السمات واحدة تلو الأخرى.

بعد إضافة جميع السمات ، اضغط على الزر تحديد الكل من كل إعداد سمة لإضافة جميع أشكالها المتاحة مرة واحدة. بعد إضافة متغيرات سمات المنتج ، احفظ الإعدادات وحدد حفظ أزرار السمات .

ندخل الآن في علامة التبويب الاختلافات . انقر فوق القائمة المنسدلة "إضافة شكل". هنا يأتي خياران. الأول هو إضافة التباين والثاني هو إنشاء متغيرات من جميع السمات.

حدد إنشاء اختلافات من جميع السمات واضغط على Go . ستضيف جميع مجموعات الصيغ المتاحة التي تم إنشاؤها للسمات. أضف السعر وصورة الاختلاف للتنوعات الفردية واحفظ الإعدادات.

خاتمة

لقد حاولت تغطية كل خطوة لتثبيت البرنامج المساعد WooCommerce Variation Swatches في سمة OceanWP. اسمحوا لي أن أعرف في مربع التعليقات إذا كنت بحاجة إلى مزيد من المساعدة.