خارج الصندوق، يعرض WooCommerce اختلافات المنتج كقوائم منسدلة عادية. اختر مقاسًا، واختر لونًا، كل ذلك من مربع تحديد رمادي يخفي الشكل الفعلي للخيارات. أ WooCommerce عينات الاختلاف البرنامج المساعد يصلح ذلك. فهو يستبدل تلك المنسدلة بدوائر الألوان القابلة للنقر عليها، والصور المصغرة للصور، والأزرار ذات العلامات، بحيث يرى المتسوق القميص الأحمر أو XL في لمحة بدلاً من فك تشفير القائمة النصية.
هذا التغيير البسيط يحرك الإبرة، لأن الناس يشترون ما يمكنهم رؤيته. يقارن هذا الدليل بين 8 من أفضل المكونات الإضافية لعينات، وكل واحدة منها مجانية للتثبيت من دليل WordPress.org الرسمي، حتى تتمكن من تجربتها في متجرك الخاص قبل الالتزام. أولاً، على الرغم من ذلك، مكون إضافي واحد ينتمي إلى كل متجر Elementor حتى قبل أن تفكر في العينات: الإضافات الرئيسية لـ Elementor. إنه ليس مكونًا إضافيًا لعشرات العينات، ولكنه يبني صفحة المنتج التي ستعيش عليها عيناتك، لذلك يحصل على المركز الأول.
ما هي عينات تباين WooCommerce؟
تستبدل عينات التباين العناصر المنسدلة للسمات الموجودة على منتج متغير بمحددات مرئية. بدلاً من القائمة المنسدلة “Color”، تحصل على صف من مربعات الألوان. بدلاً من القائمة المنسدلة “Size”، يمكنك الحصول على أزرار قابلة للنقر: S، M، L، XL.
سترى عادةً أربعة أنواع من العينات:
- عينات الألوان لصفات مثل الأحمر أو البحري أو الزيتوني
- عينات الصورة يُظهر ذلك صورة صغيرة لكل شكل، سواء كان ذلك نمطًا أو نسيجًا أو المنتج بهذا اللون
- عينات الزر أو التسمية للأحجام أو المواد أو أي سمة نصية
- عينات الراديو للحصول على إصدار أكثر ترتيبًا من المعيار، حدد
تعمل المكونات الإضافية الأفضل أيضًا على دفع العينات إلى صفحات المتجر والفئات، وليس فقط صفحة المنتج الفردية، لذلك يكتشف المتسوقون خياراتهم أثناء التصفح.
كيفية إضافة عينات الألوان في WooCommerce
الإعداد قريب من التطابق عبر كل مكون إضافي هنا
- قم بتثبيت وتنشيط WooCommerce والمكون الإضافي للنقاط التي اخترتها.
- اذهب الى المنتجات > السمات وقم بإنشاء سمة مثل اللون، ثم أضف مصطلحاتها (الأحمر والأزرق والأخضر).
- قم بتعيين نوع عينة كل مصطلح. للحصول على اللون، اختر القيمة السداسية؛ للصورة، قم بتحميل صورة مصغرة.
- افتح منتجًا متغيرًا، وأضف السمة ضمن علامة التبويب السمات، وقم بإنشاء الاختلافات.
- حفظ ومعاينة. أصبح القائمة المنسدلة الآن صفًا من العينات.
لا يوجد رمز في أي مكان في تلك القائمة. إذا لم يتم إعداد منتجاتك المتغيرة بعد، فقم بفرز ذلك أولاً مع المسؤول وثائق المنتج المتغير WooCommerce، الذي يمر عبر السمات والاختلافات. لتصميم الصفحة حول العينات، تقريرنا التقريبي لـ أفضل إضافات Elementor لـ WooCommerce يوضح كيفية إنشاء قالب منتج واحد مخصص.
مقارنة سريعة: أفضل المكونات الإضافية لـ WooCommerce Swatches
| البرنامج المساعد | التثبيتات النشطة | تقييم | تسوق عينات الصفحة (مجاني) | الأفضل ل |
|---|---|---|---|---|
| الإضافات الرئيسية للعنصر | 30،000+ | 4.5 1 | غير متوفر (مجموعة الأدوات) | بناء صفحة المنتج نفسها |
| عينات متنوعة لـ WooCommerce (عمران أحمد) | 300،000+ | 4.8 1 | برو | الاختيار الافتراضي الآمن |
| عينات متنوعة لـ WooCommerce (CartFlows) | 200،000+ | 4.6 1 | برو | متاجر أسترا / كارت فلوز |
| عينات التباين WCBoost | 50،000+ | 4.8 1 | نعم | خيار سريع وغير مزعج |
| عينات اختلافات المنتج (VillaTheme) | 10،000+ | 4.7 1 | نعم | عينات + مبادلة صور المعرض |
| عينات التباين (RadiusTheme) | 10،000+ | 4.7 1 | نعم | شامل مع عينات الكتالوج |
| عينات تباين WPC | 7000+ | 4.3 1 | نعم | مستخدمي النظام البيئي WPClever |
| صور ومسحوبات الاختلافات الذكية | 1000+ | 4.7 1 | جزئي | تبديل الصور المتغيرة |
| عينات متنوعة لـ WooCommerce (Woosuite) | 50،000+ | 3.7 1 | نعم | عينات كتالوج مجانية طويلة الأمد |
1. الإضافات الرئيسية لـ Elementor (الأساس)

اسمحوا لي أن أكون مقدما: الإضافات الرئيسية للعنصر ليس مكونًا إضافيًا لعينات متنوعة، ولا يزال موجودًا في المرتبة الأولى. هذا هو المنطق. تكسب Swatches فقط الاحتفاظ بها على صفحة المنتج التي تم تصميمها بالفعل للبيع، وهذه الصفحة هي المكان الذي تأتي فيه Master Addons. إنها مجموعة أدوات Elementor خفيفة الوزن التي تصمم القالب، ثم يقوم أي مكون إضافي swatch أدناه بإسقاط محددات الألوان والصور فيه.
تم استخدامه على 30.000+ موقع وأعيد بناؤه ليعمل بشكل أسرع بحوالي 3x في الإصدار 3، يمنحك Master Addons كاملًا منشئ الموضوع بالنسبة لقوالب المنتج الفردي والمتجر والأرشيف المخصصة. لذا، بدلاً من قبول أي تخطيط يتم شحن السمات الخاصة بك، يمكنك تصميم صفحة المنتج وإضافة العينات والتحكم في مكان هبوطها بالضبط.
لماذا يذهب أولاً لمتجر Elementor:
- منشئ الموضوع لإنشاء منتج واحد وقوالب المتجر التي يتم عرض العينات عليها
- القطعة المنتج المميز لإسقاط أي منتج وسعر وزر إضافة إلى عربة التسوق على الصفحة المقصودة
- منشئ النوافذ المنبثقة للبيع، تقدم القسيمة ونية الخروج قيمة عربة الرفع
- القائمة الضخمة للتنقل القابل للتسوق مع فئات المنتجات
- 80+ الحاجيات والإضافات في حزمة خفيفة واحدة، لا يمكنك تكديس خمسة مكونات إضافية لإنشاء صفحة واحدة
قم بتثبيت هذا أولاً لإنشاء المتجر، ثم اختر أحد المكونات الإضافية للنقاط أدناه للتعامل مع عرض الاختلاف. تصفح كاملا الحاجيات والإضافات قائمة أو التحقق من التسعير، واحصل على النسخة المجانية من صفحة البرنامج المساعد WordPress.org.
2. عينات متنوعة لـ WooCommerce (بقلم عمران أحمد)

هذا هو البرنامج الإضافي الأكثر تثبيتًا على Swatches على WordPress.org، حيث يصل إلى 300000+ عملية تثبيت نشطة وتقييم 4.8 من أكثر من 900 مراجعة. هل تريد الخيار الذي تثق به معظم المتاجر بالفعل؟ ابدأ هنا.
أفضل الميزات:
- أنواع عينات اللون والصورة والأزرار/التسمية
- تلميحات أدوات السمات عند التمرير
- تجاوزات العينة لكل سمة ولكل منتج
- التحكم في كيفية تصرف الاختلافات غير المتوفرة في المخزون، أو إمكانية النقر عليها أو عدم وضوحها
- توافق واسع مع السمات، لذلك فهو يعمل على معظم سمات WooCommerce دون ضجة
يتعامل الإصدار المجاني مع صفحة المنتج الفردية بشكل جيد. تعد عينات الكتالوج وصفحات المتجر، بالإضافة إلى معارض الصور المتنوعة، جزءًا من ترقية Pro. احصل عليه من صفحة البرنامج المساعد WordPress.org.
3. عينات التباين لـ WooCommerce (بواسطة CartFlows)

يأتي هذا من الفريق الذي يقف وراء Astra وCartFlows، وقد حصل على 200000+ عملية تثبيت بتقييم 4.6. إنها مكالمة خفيفة ونظيفة وسهلة إذا كنت تقوم بالفعل بتشغيل منتجات Brainstorm Force الأخرى.
أفضل الميزات:
- أنواع الألوان والصورة والأزرار/التسمية ونماذج الراديو
- تلميحات الأدوات للسمات
- التصميم العالمي مع تجاوزات لكل سمة
- رمز خفيف الوزن يبقى بعيدًا عن موضوعك
- مدعوم من بائع WordPress معروف
إذا كان متجرك يعمل على Astra أو قمت بإنشاء مسارات تحويل باستخدام CartFlows، فهذا يحافظ على كل شيء في منزل واحد. تثبيته من صفحة البرنامج المساعد WordPress.org.
4. عينات تباين WCBoost

WCBoost هو الاختيار الجاد، وهو يفعل شيئًا يجعلك المكونان الإضافيان الأكبر حجمًا تدفع مقابله: فهو يعرض عينات على صفحات المتجر والأرشيف في الإصدار المجاني. أضف تقييمًا 4.8 و50000+ عملية تثبيت وسيحصل على مكانه.
أفضل الميزات:
- عينات اللون والصورة والزر والراديو
- تلميحات الأدوات حول تحوم السمات
- شكل عينة قابلة للتعديل (مستديرة أو مربعة) وحجمها
- عرض صفحة المتجر والأرشيف مجانًا
- لا توجد مزعجات مبيعات مستمرة في المشرف
للحصول على مكون إضافي سريع ونظيف يمنحك عينات الكتالوج بدون نظام حظر الاشتراك غير المدفوع، يعد WCBoost واحدًا من أفضل الاختيارات قيمة في هذه القائمة. قم بتنزيله من صفحة البرنامج المساعد WordPress.org.
5. نماذج اختلافات المنتجات لـ WooCommerce (بواسطة VillaTheme)

لقد كان VillaTheme موجودًا في مساحة WooCommerce لفترة طويلة، ويقوم البرنامج الإضافي الخاص به بإقران المحددات المرئية مع تبديل الصور المتنوعة. انقر فوق لون ويتقلب المعرض الرئيسي إلى صور هذا الاختلاف.
أفضل الميزات:
- أنواع الألوان والصور والأزرار والراديو والنقاط المنسدلة
- تلميحات الأدوات لكل سمة
- عينات الكتالوج وصفحات المتجر
- تبديل الصور المتنوعة في معرض المنتجات
- ضوابط التصميم لكل سمة
إذا كنت تبيع أشياء تكون فيها صور المعرض مهمة بقدر أهمية العينة (الأزياء والأثاث والمطبوعات الفنية)، فإن تبديل الصور هذا هو سبب اختيارها. احصل عليه من صفحة البرنامج المساعد WordPress.org.
6. عينات التباين لـ WooCommerce (بواسطة RadiusTheme)

من RadiusTheme، الأشخاص الذين يقفون وراء The Post Grid وShopBuilder، يعد هذا برنامجًا ثابتًا متعدد المستويات مع 10000+ عملية تثبيت وتقييم 4.7. فهو يغطي أنواع العينات الأساسية ويدفعها إلى صفحات الكتالوج أيضًا.
أفضل الميزات:
- عينات اللون والصورة والزر والراديو
- تلميحات أدوات السمة
- تسوق وأرشفة عينات الصفحة
- إعدادات لكل سمة ولكل منتج
- مدعوم من قبل بائع مكون إضافي نشط لـ WooCommerce
إنه خيار يمكن الاعتماد عليه في منتصف الطريق، وتكسب إعدادات كل منتج الاحتفاظ بها عندما تحتاج مجموعة من المنتجات إلى عينات مصممة بشكل مختلف عن الباقي. تثبيته من صفحة البرنامج المساعد WordPress.org.
7. عينات تباين WPC لـ WooCommerce

يدير WPClever عائلة كبيرة من المكونات الإضافية لـ WooCommerce، ويتم تثبيت هذا البرنامج الإضافي مباشرة فيه. إذا كنت تستخدم بالفعل منتجات WPC مثل Smart Compare أو Linked Variation، فستشعر وكأنك في بيتك.
أفضل الميزات:
- أنواع عينات الألوان والصورة والأزرار والملصقات
- دعم تلميح الأدوات
- مهمة عينة على مستوى الفصل الدراسي
- بصمة صغيرة
- يعمل مع مجموعة WPClever الأوسع
التقييم أقل بدرجة كبيرة وعدد المراجعة ضعيف، لذا اختبره على التدريج قبل شحنه. بالنسبة لمستخدمي WPClever، فهو مناسب بشكل واضح. قم بتنزيله من صفحة البرنامج المساعد WordPress.org.
8. صور ومسوحات الاختلافات الذكية لـ WooCommerce

هذا يميل بقوة إلى الصور. فهو يعرض تلقائيًا صور معرض المنتجات ويخفيها ويتبادلها بناءً على الاختلاف الذي يختاره المتسوق، وهو أمر مثالي عندما يكون الاختلاف البصري بين الاختلافات هو درجة الصوت بأكملها.
أفضل الميزات:
- عينات الصور مرتبطة بالصور المختلفة
- عرض المعرض التلقائي وإخفائه ومبادلته لكل شكل مختلف
- صورة ذكية ترتبط بالسمات
- يتم تشغيله بشكل جيد جنبًا إلى جنب مع مكون إضافي آخر لـ Swatch إذا قمت بتشغيله بالفعل
- 142 تقييمًا بتقييم 4.7، ومشاركة كبيرة بالنسبة لحجمه
لا يتعلق الأمر بتصميم الأزرار بقدر ما يتعلق برد فعل المعرض على النقرة. إذا كان تبديل الصور هو أولويتك، فهذا هو المتخصص. احصل عليه من صفحة البرنامج المساعد WordPress.org.
9. عينات متنوعة لـ WooCommerce (بواسطة Woosuite)

يعد هذا واحدًا من أقدم المكونات الإضافية لعينات العينات في المستودع، وقد تم إدراجه في عام 2017، ولا يزال يعمل في 50000+ متجر. السحب عبارة عن عينات مجانية من صفحات الكتالوج ومجموعة كاملة من أنواع العينات بدون جدار بيع.
أفضل الميزات:
- اللون والصورة والتسمية/النص وعينات الراديو
- تلميحات الأدوات للسمات
- عينات صفحة الأرشيف والكتالوج في النسخة المجانية
- تكوين لكل سمة
- سجل حافل في متاجر WooCommerce
تحذير صادق واحد: تقييمه 3.7 هو الأضعف هنا، لذا قم بتصفح المراجعات الأخيرة واختبره وفقًا لموضوعك قبل الاعتماد عليه. تثبيته من صفحة البرنامج المساعد WordPress.org.
يستحق أيضا نظرة
يوجد عدد قليل آخر على WordPress.org وقد يناسب إعدادًا محددًا، على الرغم من أنهم لم يتخطوا القائمة الرئيسية. YITH اختلافات اللون والتسمية يمنحك عينات الألوان والملصقات مجانًا ويحتفظ بعينات الصور مرة أخرى للمحترفين. عينات تباين QODE هو خيار أحدث وأخف وزنًا ولا يزال يقوم ببناء المراجعات.
كيفية اختيار البرنامج المساعد Swatches الصحيح
قم بمطابقة المكون الإضافي مع ما يحتاجه متجرك بالفعل
- تريد الخيار الأكثر أمانًا والأكثر اختبارًا: عينات متنوعة لـ WooCommerce بقلم عمران أحمد.
- تريد عينات من صفحات المتجر دون الدفع: Wcboost أو البرنامج المساعد Woosuite.
- تتغير صور معرض الصور الخاص بك كثيرًا بين الاختلافات VillaTheme أو صور الاختلافات الذكية.
- أنت تعيش في النظام البيئي Astra/CartFlows أو WPClever اختر البرنامج المساعد المطابق (CartFlows أو WPC).
مهما كان ما تهبط عليه، راقب الأداء. تضيف نصوص Swatch وزنًا إلى صفحات منتجك، لذا قم بإقرانها بالنصائح الموجودة في دليلنا كيفية تسريع مواقع Elementor. وإذا كانت منتجاتك تحتاج إلى أكثر من مجرد عينات، فكر في الحقول المخصصة أو الوظائف الإضافية أو النقش، وانظر إلى خيارات منتج إضافية لـ WooCommerce للقبض على أولئك عند الخروج.
بناء المتجر حول هذه العينات؟ يبقى Master Addons خفيفًا 80+ الحاجيات والإضافات، ولها منشئ الموضوع يتيح لك تصميم قالب المنتج الفردي الذي تجلس عليه العينات الخاصة بك. تحقق من التسعير إذا كنت تريد مجموعة الأدوات بأكملها.
الأسئلة المتداولة
ما هو أفضل مكون إضافي مجاني لعينات WooCommerce؟
تعد عينات Variation Swatches لـ WooCommerce من Emran Ahmad هي الاختيار المجاني الأكثر أمانًا، مع 300000+ عملية تثبيت وتقييم 4.8. إذا كنت بحاجة إلى عينات من صفحات المتجر مجانًا، فإن WCBoost Variation Swatches يعد بديلاً قويًا لا يبعد عينات الكتالوج عن Pro.
كيف يمكنني إضافة عينات الألوان في WooCommerce؟
قم بتثبيت مكون إضافي لعينات، وانتقل إلى المنتجات > السمات، وقم بإنشاء سمة لون، وقم بتعيين قيمة سداسية لكل مصطلح. ثم أضف السمة إلى منتج متغير وقم بإنشاء الاختلافات. يتحول القائمة المنسدلة إلى صف من عينات الألوان القابلة للنقر عليها، دون الحاجة إلى تعليمات برمجية.
هل يمكنني إضافة عينات متنوعة بدون مكون إضافي؟
ليس بسهولة. لا يحتوي WooCommerce على خيار swatch مدمج، لذلك ستحتاج إلى تعليمات برمجية مخصصة وCSS لتحويل القوائم المنسدلة بنفسك. يقوم البرنامج الإضافي المخصص للعينات بذلك ببضع نقرات ويظل متوافقًا من خلال تحديثات WooCommerce، ولهذا السبب يستخدم كل متجر واحدًا تقريبًا.
هل تظهر عينات التباين على صفحات المتجر والفئات؟
يعتمد ذلك على البرنامج المساعد. يعرض العديد من العينات فقط على صفحة المنتج الفردية في نسختها المجانية. يعرضها WCBoost وVillaTheme وRadiusTheme والمكون الإضافي Woosuite على صفحات المتجر والأرشيف مجانًا، بينما يحفظها الآخرون لـ Pro.
هل سيؤدي البرنامج الإضافي Swatches إلى إبطاء متجري؟
يضيف الإصدار المبني جيدًا القليل فقط من CSS وJavaScript. خيارات خفيفة الوزن مثل WCBoost تحافظ على التأثير منخفضًا. لا تقم بتشغيل مكونين إضافيين في وقت واحد، وتحقق من سرعة صفحتك قبل التثبيت وبعده حتى تعرف أين تقف.
التفاف
أفضل مكون إضافي لعينات WooCommerce لمتجرك يتلخص في سؤالين: هل تحتاج إلى عينات من صفحات المتجر مجانًا، وما مدى تغير صور معرض الصور الخاص بك بين الاختلافات؟ بالنسبة لمعظم المتاجر، تعد Variation Swatches for WooCommerce من تصميم عمران أحمد هي البداية الآمنة، وWCBoost هو أفضل طريق مجاني لعينات الكتالوج، وتفوز VillaTheme أو Smart Variations Images عندما يتم بيع الصور.
قم بتثبيت اثنين من الإصدارات المجانية، واختبرهما وفقًا لموضوعك، واحتفظ بالإصدار الذي يبدو صحيحًا. ثم قم ببناء المتجر من حولهم: استكشف بالكامل عناصر واجهة المستخدم والإضافات الرئيسية أو ابدأ بشكل أسرع مع المنتجات الجاهزة مجموعات القالب.
القراءة ذات الصلة: أفضل إضافات العناصر لـ WooCommerce, خيارات منتج إضافية لـ WooCommerce، و أفضل 100 إضافة للعناصر.
