ووردبريس

إنشاء جدول محتويات ديناميكي لمحتوى ACF في ووردبريس

في عالم تطوير المواقع باستخدام ووردبريس، يُعتبر إنشاء جدول محتويات ديناميكي (TOC) أمرًا ضروريًا لتحسين تجربة المستخدم وزيادة قابلية القراءة. يتناول هذا المقال كيفية إنشاء جدول محتويات ديناميكي باستخدام حقل المحتوى المرن (ACF Flexible Content)، مما يسهل على الزوار التنقل بين الأقسام المختلفة للمواد المكتوبة.

فهم الحقول المرنة في ACF

تطبيق Advanced Custom Fields (ACF) يُعتبر أداة قوية لإنشاء تخطيطات مخصصة تتناسب مع احتياجات محتوى موقعك. باستخدام حقل المحتوى المرن، يمكنك تنظيم المحتوى في تخطيطات مختلفة دون تعقيد الكود البرمجي. في هذه الحالة، استُخدم حقل المحتوى المرن لتصميم نوع خاص من المحتويات يتضمن عناوين فردية يتم ترتيبها بشكل هيكلي.

إنشاء جدول محتويات ديناميكي

لتوليد جدول محتويات ديناميكي، يجب عليك أولاً التأكد من أن التخطيط الخاص بك يحتوي على العناوين الصحيحة. استخدم الحقل الذي قمت بتسميته "contenu_flexible_custom" وهو حقل المحتوى المرن. واحد من التخطيطات الموجودة في هذا الحقل هو "titre_h2"، والذي يحتوي على العناوين التي ترغب في تضمينها في جدول المحتويات.

إضافة تعليقات توضيحية للعناوين

تحتاج إلى إعداد كود PHP مخصص يقوم بالتكرار خلال حقل المحتوى المرن وينشئ جدول محتويات يتضمن العناوين المحددة. يمكنك استخدام الدالة التالية:

function generate_acf_flexible_toc() {
    $toc = "<h2>جدول المحتويات</h2><ul>";
    $content_found = false;
    if (have_rows('contenu_flexible_custom')) {
        while (have_rows('contenu_flexible_custom')) : the_row();
            if (get_row_layout() == 'titre_h2') {
                $heading = get_sub_field('titre_h2');
                if ($heading) {
                    $id = sanitize_title($heading);
                    $toc .= '<li><a href="#' . esc_attr($id) . '">' . esc_html($heading) . '</a></li>';
                    echo '<h2 id="' . esc_attr($id) . '">' . esc_html($heading) . '</h2>';
                    $content_found = true;
                }
            }
        endwhile;
    }
    $toc .= '</ul>';
    if ($content_found) {
        return $toc;
    }
    return '';
}

يعمل هذا الكود على توليد قائمة بالعناوين التي تظهر في التخطيط "titre_h2"، ويقوم بتعريف كل عنوان باستخدام معرف فريد لتسهيل الوصول إليه.

إضافة جدول المحتويات إلى المحتوى الرئيسي

لإضافة جدول المحتويات إلى محتوى المقال بشكل ديناميكي، يمكنك استخدام الدالة التالية:

function add_acf_flexible_toc_to_content($content) {
    if (is_singular('post')) { 
        return generate_acf_flexible_toc() . $content;
    }
    return $content;
}
add_filter('the_content', 'add_acf_flexible_toc_to_content');

تقوم هذه الدالة بإضافة جدول المحتويات في مقدمة المحتوى، وذلك فقط في حالة المقالات العادية.

التغلب على التحديات

قد تواجه صعوبة في توليد جدول المحتويات بشكل صحيح نظرًا لأن العناوين جزء من حقل المحتوى المرن وليس النص الأساسي. ولكن باتباع الخطوات المذكورة أعلاه واستخدام البرمجة المناسبة، يمكنك ضمان تضمين جميع العناوين في جدول المحتويات بشكل سليم.

استنتاج

إن إنشاء جدول محتويات ديناميكي (TOC) لحقل المحتوى المرن في ووردبريس يوفر تجربة مستخدم أفضل ويساعد الزوار على التنقل بسهولة بين مختلف أقسام المقال. من خلال استخدام الحقول المخصصة وكتابة كود PHP صحيح، يمكنك بناء محتوى معقد يتسم بالتنظيم والسهولة في الوصول.

يمكنك استخدام المفاهيم المذكورة في هذا الدليل لتحسين موقع الويب الخاص بك باستخدام حقل المحتوى المرن. إن بناء جدول محتويات ديناميكي ليس مجرد خطوة جمالية، بل هو استراتيجية فعالة لتحسين تفاعل المستخدمين مع المحتوى.

احمد علي

متخصص في مجال تطوير وإدارة المواقع الإلكترونية، يتمتع بخبرة واسعة في التعامل مع منصات إدارة المحتوى، خاصة ووردبريس. يقدم أحمد حلولاً مبتكرة واستراتيجيات فعالة لتحسين أداء المواقع وتطوير تصميماتها بما يتناسب مع احتياجات المستخدمين. كما يتميز بقدرته على تبسيط المفاهيم التقنية وكتابة محتوى تعليمي يساعد الأفراد والشركات على تحسين تواجدهم الرقمي وتحقيق أهدافهم على الإنترنت.
زر الذهاب إلى الأعلى
Don`t copy text!