كيفية إنشاء WooCommerce Add to Cart Button حسب معرف المنتج
نشرت: 2021-02-24
من الممكن إنشاء WooCommerce إضافة إلى زر سلة التسوق حسب معرف المنتج واستخدام الزر في النماذج أو الأدوات أو المنشورات أو الصفحات وحتى على القوالب. من الناحية المثالية ، يمكن تخصيص زر الإضافة إلى عربة التسوق WooCommerce ليلائم نطاقًا واسعًا من الخيارات المخصصة.
WooCommerce إضافة إلى زر عربة التسوق حسب معرف المنتج
في منشور سابق ، أوضحت كيفية تغيير WooCommerce إضافة إلى زر عربة التسوق إلى رابط وأيضًا كيفية تغيير زر إضافة WooCommerce إلى سلة التسوق لقراءة المزيد.
هذه هي البرامج التعليمية السابقة الأخرى التي يمكن أن تساعدك في معرفة المزيد حول كيفية تخصيص زر الإضافة إلى عربة التسوق WooCommerce:
- كيفية استبدال زر الإضافة إلى عربة التسوق برابط WooCommerce
- كيفية إخفاء قراءة المزيد وإضافة إلى عربة التسوق زر WooCommerce
- كيفية تغيير نص زر الإضافة إلى عربة التسوق في صفحة متجر WooCommerce
- كيفية التغيير أضف إلى عربة التسوق نص دليل WooCommerce مع أمثلة
- كيفية إضافة المنتج إلى عربة التسوق برمجيًا في WooCommerce
- كيفية تغيير إشعار WooCommerce "تمت الإضافة إلى عربة التسوق"
- كيفية إخفاء السعر وإضافته إلى عربة التسوق WooCommerce للمستخدمين المسجلين
كما ترى من قائمة البرامج التعليمية أعلاه ، هناك عدة طرق يمكنك من خلالها تخصيص زر إضافة WooCommerce إلى عربة التسوق لمساعدتك في تحقيق تخطيطات أو تصميمات مختلفة للمحتوى.
على سبيل المثال ، عندما تريد إنشاء جدول تسعير WooCommerce ، قد يُطلب منك إنشاء أزرار إضافة إلى سلة التسوق التي يمكنك إضافتها إلى زر الحث على اتخاذ إجراء في جدول الأسعار.
قم بإنشاء WooCommerce منتج بسيط زر إضافة إلى عربة التسوق حسب معرف المنتج
لإنشاء WooCommerce ، زر الإضافة إلى سلة التسوق بواسطة معرف المنتج ، تحتاج إلى معرفة معرف المنتج الخاص بالمنتج المحدد الذي تريد إنشاء زر الإضافة إلى عربة التسوق. يمكن العثور على معرّف المنتج بسهولة في صفحة نظرة عامة على جميع المنتجات كما هو موضح في هذا البرنامج التعليمي حول - كيفية الحصول على معرّف منتج WooCommerce .
A dd to Cart Link
يمكنك الآن إنشاء عنوان URL لإضافة عربة التسوق والذي لن تضيفه إلى رمز الزر في المكان الذي تريد عرض الزر فيه. في هذه الحالة ، يمكنك إنشاء رابط "إضافة إلى عربة التسوق" البسيط للمنتج كما في الكود أدناه:
https://example.com/?add-to-cart=840
يجب أن يحل عنوان URL الخاص بموقعك محل جزء example.com من عنوان URL ويجب أن يحل معرّف المنتج المحدد محل معرف المنتج 840 المستخدم في المثال أعلاه.
يمكنك إضافة هذا في رمز زر HTML كما في الكود أدناه:
قم بإنشاء منتج بسيط بالكمية WooCommerce إضافة إلى زر عربة التسوق حسب معرف المنتج
يمكنك أيضًا إضافة الكمية إلى عنوان URL للإضافة إلى سلة التسوق ويمكنك القيام بذلك باستخدام معلمات URL المختلفة المستخدمة لإضافة منطق إلى عناوين URL.
في هذه الحالة ، يمكنك تمديد الكود الذي أنشأناه في الخطوة أعلاه وإنشاء منتج بسيط يضاف WooCommerce إلى زر عربة التسوق بواسطة معرّف المنتج بكمية 2 على النحو التالي:
https://example.com/?add-to-cart=840&quantity=2
كما ترى ، أضفنا علامة العطف وكلمة الكمية وقمنا بمساواتها بـ 2 عدد العناصر التي نريد إضافتها إلى عربة التسوق عند النقر فوق الزر الخاص بالمنتج نفسه.
لإضافة عنوان URL هذا إلى رمز HTML وإنشاء WooCommerce ، أضف إلى زر سلة التسوق حسب معرف المنتج بالكمية التي يجب عليك استخدام الكود أدناه:
قم بإنشاء WooCommerce Add to Cart Button حسب معرف المنتج مع إعادة التوجيه إلى عربة التسوق
لتسهيل تنقل عملاء متجر WooCommerce في موقعك ، يعد إنشاء عمليات إعادة التوجيه أمرًا مهمًا للغاية. لقد أبرزت في الماضي العديد من الطرق لإنشاء عمليات إعادة توجيه WooCommerce.
والجدير بالذكر ، لقد قمت بالمشاركة في منشورات المدونة هذه - WooCommerce ينشئ إعادة توجيه بعد الخروج وإعادة توجيه WooCommerce بعد تسجيل الخروج وحتى أنشأت إعادة توجيه WooCommerce بعد المكون الإضافي لتسجيل الخروج لمساعدتك في تنفيذ إعادة التوجيه بعد الخروج.
WooCommerce إعادة التوجيه إلى عربة التسوق بعد الإضافة إلى عربة التسوق
يمكنك أيضًا إنشاء إعادة توجيه إلى عربة التسوق باستخدام زر الإضافة إلى عربة التسوق WooCommerce حسب معرّف المنتج. يمكنك تحقيق ذلك عن طريق تغيير الكود الذي قمت بمشاركته في الخطوة أعلاه ليكون كالتالي:
https://example.com/cart/?add-to-cart=840
كما ترى ، أضفنا سلة التسوق إلى عنوان URL للتأكد من إعادة توجيه المستخدم إلى سلة التسوق بعد إضافة المنتج إلى سلة التسوق. الكود الكامل مع كود زر HTML هو كما يلي:
WooCommerce أعد التوجيه إلى الخروج بعد الإضافة إلى عربة التسوق
يمكنك أيضًا إنشاء إعادة توجيه للدفع باستخدام زر الإضافة إلى عربة التسوق WooCommerce حسب معرّف المنتج. يمكنك تحقيق ذلك عن طريق تغيير الكود الذي قمت بمشاركته في الخطوة عن طريق إضافة تسجيل الخروج على عنوان URL أعلاه ليكون على النحو التالي:
https://example.com/checkout/?add-to-cart=840
كما ترى ، أضفنا عملية الدفع إلى عنوان URL للتأكد من إعادة توجيه المستخدم إلى الخروج بعد إضافة المنتج إلى سلة التسوق. الكود الكامل مع كود زر HTML هو كما يلي:
استنتاج
في هذا البرنامج التعليمي ، قمنا بتسليط الضوء على الطرق المختلفة التي يمكنك من خلالها إنشاء زر إضافة إلى سلة التسوق WooCommerce عن طريق معرّف المنتج. لقد رأينا أيضًا كيفية إضافة إعادة التوجيه إلى زر الإضافة إلى عربة التسوق وكذلك كيفية إضافة كمية المنتج إلى الإضافة زر عربة التسوق.
آمل أن تتمكن الآن من إنشاء زر إضافة إلى عربة التسوق WooCommerce بواسطة معرّف المنتج واستخدامه في جدول الأسعار والنماذج وداخل القوالب. يمكنك أيضًا تخصيص زر الإضافة إلى عربة التسوق بشكل أكبر باستخدام فئة الزر التي أضفتها إلى الكود أعلاه. إذا كنت لا تزال تقوم بتخصيص موقعك ، فيمكنك الاستفادة من الأفكار التي شاركتها في Ultimate WooCommerce Hide Guide.
بالنسبة لمستخدمي WooCommerce الذين تم تثبيت سمة Storefront لديهم ويرغبون في تخصيصها بشكل أكبر ، قمت بمشاركة مجموعة رائعة من 80+ WooCommerce Storefront Theme Customization Tips والتي ستوجهك حول كيفية إنشاء مظهر مخصص لموقعك باستخدام سمة WooCommerce الافتراضية - واجهة المتجر .
مقالات مماثلة
- كيفية إنشاء حقول السحب الشرطي لـ WooCommerce
- كيفية إنشاء رمز قصير لتسجيل الخروج من WooCommerce
- كيفية تغيير سمة واجهة المتجر ذات لون الزر
- كيفية الحصول على عنوان منتج WooCommerce
- كيفية إخفاء السعر وإضافته إلى عربة التسوق WooCommerce للمستخدمين المسجلين
- كيفية إخفاء زر تحديث عربة التسوق WooCommerce صفحة
- كيفية استبدال زر الإضافة إلى عربة التسوق برابط WooCommerce
- كيفية إخفاء السعر إذا كان الصفر في WooCommerce
- كيفية إنشاء سمة تابعة لواجهة متجر WooCommerce [الدليل الكامل]
- كيفية إخفاء خيار إدارة WooCommerce Marketing Hub
- كيف احصل على معرف المنتج على صفحة الخروج أو صفحة الطلب في WooCommerce
- كيفية الحصول على تفاصيل الطلب بعد الخروج في WooCommerce
- كيفية إعادة التوجيه إلى عربة التسوق بعد تسجيل الدخول في WooCommerce
- كيفية إضافة WooCommerce إعادة توجيه صفحة حسابي
- شرح خطاف إعادة توجيه تسجيل الدخول إلى WooCommerce مع مثال
- كيفية تعطيل الخروج مؤقتًا في WooCommerce
- كيفية إعداد مدونة WooCommerce Storefront