شرح اضافة العرض التفصيلي للمقالة في ويرد برس Wordpress Breadcrumb

تم النشر بتاريخ 2019-08-20 00:47:06

العرض التفصيلي للمقالة في ويرد برس Wordpress Breadcrumb

نحتاج الى تسهيل الحركة على الزوار في مواقع المبنية على برمجة ويرد برس Wordpress ، لذا فاننا نوجه الزائر ونرشده هو يتصفح أي صفحة او مقالة وهذه المقالة موجودة في اي قسم وكيف يتنقل رجوعا الى القسم الرئيسي او الصفحة الرئيسية للموقع، لذا نحتاج الى ما يمسى العرض التفصيلي للصفحة او Wordpress Breadcrumb، اذا كيف نضع اسم المقالة واسم القسم المباشر لها واسم الموقع في راس المقالة لتسهيل تنقل الزائر؟
يمكن اضافتها بطريقتين: اما من خلال اضافة جاهزة ، او من خلال كود برمجي ..
عرض Wordpress Breadcrumb من خلال أضافة جاهزة
يمكن تركيب هذه الاضافة من خلالموقع ويرد برس الرسمي، واسم الاضافة هو Flexy Breadcrumb اضغط هنا لتحميلها الى جهازك من خلال موقع ويرد برس الرسمي ثم يمكن استدعاء الاضافة من خلال الشوركت كود [php][flexy_breadcrumb] [/php] او في ملف php في المكان المخصص لك باضافة الكود [php] echo do_shortcode("[flexy_breadcrumb] ");[/php]
عرض Wordpress Breadcrumb من خلال كود برمجي
تنبيه: بالبداية يجب اخذ نسخة احتياطية من الملفات قبل التعديل. يمكن تركيب العرض التفصيلي بدون اضافة جاهزة او بلوجن Display Breadcrumb without Plugin، من خلال الخطوات التالية: الذهاب الى ملف functions.php الموجود داخل القالب تعديله واضافة الكود التالي فيه: [php] function get_breadcrumb() { echo '<a href="'.home_url().'" rel="nofollow">Home</a>'; if (is_category() || is_single()) { echo " » "; the_category(' • '); if (is_single()) { echo " » "; the_title(); } } elseif (is_page()) { echo " » "; echo the_title(); } elseif (is_search()) { echo " » Search Results for... "; echo '"<em>'; echo the_search_query(); echo '</em>"'; } } [/php] ثم استدعاء الفنكشن في اي مكان تريده من خلال وضع الكود التالي [php] <div class="breadcrumb"><?php get_breadcrumb(); ?></div>[/php] فاذا كنت تريد استدعاءه في صفحة المقالات ضعه في ملف single.php في المكان المناسب لك اما اذا اردت استدعاءه في صفحة الاقسام ضعه في ملف archive.php في المكان المناسب لك
اضافة لمسة جمالية للعرض التفصيلي
من ناحية جمالية يمكن استخدام تنسيق css للتحكم بلون وحجم وشكل العرض التفصيلي، وهذا كود جاهز يمكن استخدامه في ملف style.css [php] .breadcrumb { padding: 8px 15px; margin-bottom: 20px; list-style: none; background-color: #f5f5f5; border-radius: 4px; } .breadcrumb a { color: #428bca; text-decoration: none; } [/php]