عميل لطيف للغاية واجه تحديًا رائعًا في ذلك اليوم ، لذلك فكرت في “التبرع” بهذا المقتطف القيّم لكم جميعًا!
بعد البحث في الإنترنت عاليًا ومنخفضًا وعدم العثور على أي شيء بسيط يعمل أيضًا (على وجه الخصوص هذا المقتطف على StackOverflow و Gist on Github ) ، قررت DIY!
هذا ما توصلت إليه – استمتع!
WooCommerce: أضف الروابط التالية / السابقة إلى صفحة منتج واحد
WooCommerce: أضف الروابط التالية / السابقة إلى صفحة منتج واحد
/**
* @snippet Add next/prev buttons @ WooCommerce Single Product Page
* @how-to Get CustomizeWoo.com FREE
* @sourcecode https://businessbloomer.com/?p=20567
* @author Rodolfo Melogli
* @testedwith WooCommerce 2.5.5
*/
add_action( 'woocommerce_before_single_product', 'bbloomer_prev_next_product' );
// and if you also want them at the bottom...
add_action( 'woocommerce_after_single_product', 'bbloomer_prev_next_product' );
function bbloomer_prev_next_product(){
echo '<div class="prev_next_buttons">';
// 'product_cat' will make sure to return next/prev from current category
$previous = next_post_link('%link', '← PREVIOUS', TRUE, ' ', 'product_cat');
$next = previous_post_link('%link', 'NEXT →', TRUE, ' ', 'product_cat');
echo $previous;
echo $next;
echo '</div>';
}فقط لأنني لطيف قررت أن أقدم لك بعض التصميم الرائع أيضًا. على وجه الخصوص ، نتأكد من أن الأزرار تطفو واحدًا إلى اليسار والآخر إلى اليمين وأن الصف الجديد بالكامل يظهر ككتلة.
/* CSS */
.prev_next_buttons {
line-height: 40px;
margin-bottom: 20px;
}
.prev_next_buttons a[rel="prev"], .prev_next_buttons a[rel="next"] {
display: block;
}
.prev_next_buttons a[rel="prev"] {
float: right;
}
.prev_next_buttons a[rel="next"] {
float: left;
}
.prev_next_buttons::after {
content: '';
display: block;
clear:both;
}ستعمل الوظائف المستخدمة في PHP أعلاه بترتيب زمني ، وفقًا لوثائق “next_post_link” و “previous_post_link”.
المشكلة هي – ماذا لو كان لديك منتجات WooCommerce مرتبة حسب الترتيب الأبجدي أو حسب الطلب؟
في النهاية ، اكتشف العميل أن أفضل طريقة لجعل الاثنين يعملان معًا هي استخدام البرنامج الإضافي المجاني Post Type Order . ما عليك سوى تنزيله وتنشيطه وفرز منتجاتك باستخدام هذا المكون الإضافي – وسيتبع التالي / السابق الآن هذا الترتيب المخصص.
WooCommerce: كيفية تقصير عناوين المنتج
WooCommerce: إزالة علامات تبويب المنتج ، وإظهار الوصف الطويل
WooCommerce: عرض معرض المنتجات عموديًا (صفحة منتج واحدة)
WooCommerce: تعطيل نشر Jetpack للمنتجات
WooCommerce: تغيير عدد الصور المصغرة لكل صف @ معرض المنتج
WooCommerce: قم بتغيير كمية إضافة إلى عربة التسوق في قائمة اختيار المنسدلة
WooCommerce: تحرير عنوان URL لصورة المنتج الخارجية
WooCommerce: أضف حقلًا مخصصًا إلى تنويعات المنتج
WooCommerce: قم بالتمرير إلى علامة تبويب المنتج @ صفحة منتج واحد
WooCommerce: منتجات مخصصة ذات صلة
يمكنك وضع مقتطفات PHP في الجزء السفلي من ملف function.php القالب الفرعي الخاص بك (احذف “؟>” إذا كان لديك هناك). من ناحية أخرى ، ينتقل CSS في ملف style.css الخاص بسمة الطفل. تأكد من أنك تعرف ما تفعله عند تحرير مثل هذه الملفات – إذا كنت بحاجة إلى مزيد من الإرشادات ، فيرجى إلقاء نظرة على الفيديو التعليمي المجاني الخاص بي “أين تضع تخصيص WooCommerce؟”
يرجى إعلامي في التعليقات إذا كان كل شيء يعمل كما هو متوقع. يسعدني مراجعة المقتطف إذا أبلغت بخلاف ذلك (يرجى تقديم لقطات شاشة). لقد اختبرت هذا الكود مع موضوع Storefront وإصدار WooCommerce المذكور أعلاه واستضافة صديقة لـ وورد بريس على PHP 7.3.
إذا كنت تعتقد أن هذا الرمز وفر لك الوقت والمال ، فلا تتردد في الانضمام إلى أكثر من 14000 مشترك في WooCommerce Weekly للحصول على تحديثات منشورات المدونة أو أكثر من 250 من مؤيدي Business Bloomer لمدة 365 يومًا من مزايا WooCommerce . شكرا لكم مقدما 🙂
تحقق من دروس الفيديو المجانية هذه. يمكنك تعلم كيفية تخصيص WooCommerce بدون مكونات إضافية غير ضرورية ، وكيفية تكوين إعدادات البرنامج المساعد WooCommerce بشكل صحيح وحتى كيفية إتقان استكشاف أخطاء WooCommerce في حالة حدوث خطأ!
