إضافة قائمة بتنوعات المنتجات مع روابطها في عنصر Elementor Pro
كيفية إضافة قائمة بالاختلافات مع روابط إلى بطاقة المنتج (loop grid في Elementor Pro)
تُعتبر الواجهات وسيلة مثالية لعرض المنتجات بشكل جذاب وسهل الاستخدام، خاصةً عند استعمال Elementor Pro. إذا كنت ترغب في إضافة قائمة بالاختلافات التي توفر روابط مباشرة إلى كل منتج، فأنت في المكان الصحيح. سنستعرض في هذا المقال كيف يمكن القيام بذلك خطوة بخطوة، لضمان توفير تجربة مستخدم سلسة ومحترفة.
خطوات إعداد الاختلافات في بطاقة المنتج
أول خطوة لتحقيق هدفك تتمثل في التأكد من أن المنتجات لديك مصنفة كمنتجات متغيرة. المنتجات المتغيرة تسمح لك بتقديم خيارات متعددة مثل المقاسات والألوان، مما يمنح زبائنك حرية الاختيار. سنبدأ بإنشاء كود بسيط يتيح لنا عرض المقاسات المتاحة للمنتج.
يجب عليك إضافة الشيفرة البرمجية التالية إلى ملف functions.php في قالبك. هذه الشيفرة تتضمن دالة تقوم بعرض المقاسات المتاحة للمنتج، بالإضافة إلى توفير روابط للانتقال إليها مباشرة.
“`php
function display_product_sizes() {
global $product;
if ( ! $product || ! $product->is_type( ‘variable’ ) ) {
return ”;
}
$available_variations = $product->get_available_variations();
$sizes = array();
foreach ( $available_variations as $variation ) {
$size = $variation[‘attributes’][‘size’];
if ( ! in_array( $size, $sizes ) ) {
$sizes[] = $size;
}
}
if ( empty( $sizes ) ) {
return ”;
}
return implode( ‘, ‘, $sizes );
}
add_shortcode( ‘product_sizes’, ‘display_product_sizes’ );
“`
تعمل هذه الوظيفة على استرجاع الاختلافات المتاحة للمنتج، والتحقق من كل اختلاف، وعرض المقاسات مرة واحدة فقط لضمان عدم تكرارها. هذا سيساعدك في توفير قائمة بسيطة وواضحة للمستخدمين.
تفعيل الشيفرة واستخدامها في صفحة المنتج
بعد إضافة الشيفرة، يمكنك استخدامها في أي مكان على موقعك باستخدام الاختصار `[product_sizes]`. يمكن إدراج هذا الاختصار داخل قسم تفاصيل المنتج في واجهة Elementor، لعرض قائمة بالمقاسات المتاحة.
تأكد من أن المنتج لديك متغير ولديه خيارات مقاسات، حتى تظهر النتائج. يمكنك أيضًا تخصيص التصميم لتناسب مظهر موقعك باستخدام أنماط CSS الخاصة بك.
تحسين تجربة المستخدم
تتمثل أحد الفوائد الكبيرة لعرض قائمة الاختلافات مع روابط إلى بطاقة المنتج (loop grid في Elementor Pro) في تحسين تجربة المستخدم. فكلما كانت المعلومات واضحة وسهلة الفهم، زادت احتمالية اتخاذ الزبون قرار الشراء. استثمر في تحسين تصميم الصفحة، وجعل الروابط بارزة لإغراء الزبائن بالنقر عليها.
يجعل عرض المقاسات المتاحة الحياة أسهل للزبائن ويزيد من فرص مواجهتهم لمنتجات مختلفة تتناسب مع احتياجاتهم. تأكد من إضافة جميع التفاصيل اللازمة مثل الأسعار وكميات المخزون في بطاقة المنتج نفسها.
الخاتمة
في النهاية، تعتبر طريقة إضافة قائمة بالاختلافات مع روابط إلى بطاقة المنتج (loop grid في Elementor Pro) أداة قوية لتحسين مظهر وتنظيم صفحة منتجك. هذه الطريقة ليست فقط سهلة التطبيق ولكنها أيضاً تعزز تجربة التسوق لمستخدميك. عن طريق اتّباع الخطوات الموضحة أعلاه، يمكنك تعزيز فعاليات موقعك وضمان حصول زبائنك على تجربة شراء فريدة ومريحة. باستخدام عناصر السيو المناسبة والتصميم الجيد، يمكنك الوصول إلى جمهور أوسع وتحقيق نتائج أفضل لمتجرك.
