ملف footer.php


طالما فهمنا الهيدر، يبقى الطبيعي دلوقتي نكمل بالملف اللي بيقفل الصفحة:

1. مقدمة: يعني إيه footer.php؟

الـ footer.php هو آخر جزء بيظهر في الصفحة،
ده اللي بيكون فيه:

  • حقوق النشر
  • روابط الصفحات المهمة
  • روابط السوشيال ميديا
  • سكريبتات جافاسكربت
  • أحيانًا القوائم التانية (secondary nav)
  • وكود إغلاق الموقع

2. الملف ده مكانه فين في القالب؟

المفروض يكون موجود في جذر مجلد القالب،
زيه زي header.php و index.php.

3. استخدامه في ووردبريس

بنستخدمه في أي صفحة عن طريق:

<?php get_footer(); ?>

وده بيتكتب في نهاية الملفات:

  • index.php
  • page.php
  • single.php

يعني أي صفحة لازم تبدأ بـ get_header() وتنتهي بـ get_footer().

4. محتويات ملف footer.php

  • قفل الـ <div> أو العناصر اللي اتفتحت في الهيدر أو الكونتنت
  • محتوى الفوتر (حقوق، قوائم…)
  • wp_footer() ← مهم جدًا
  • كود إغلاق </body> و </html>

5. الفرق بينه وبين header.php

header.phpfooter.php
بداية الصفحةنهاية الصفحة
فيه الهيدر والقائمة الرئيسيةفيه الحقوق، روابط تكميلية
يحتوي على wp_head()يحتوي على wp_footer()
يبدأ HTMLيقفل HTML

6. الشكل العام للملف

مثال بسيط:

<footer>
  <div class="footer-widgets">
    <?php if ( is_active_sidebar( 'footer-widget' ) ) : ?>
      <?php dynamic_sidebar( 'footer-widget' ); ?>
    <?php endif; ?>
  </div>

  <div class="footer-info">
    <p>&copy; <?php echo date('Y'); ?> - <?php bloginfo('name'); ?></p>
  </div>
</footer>

<?php wp_footer(); ?>
</body>
</html>

7. شرح الأكواد الأساسية

الكودالوظيفة
dynamic_sidebar()بيعرض الويدجيت (زي قائمة أو نص)
date('Y')بيطبع السنة الحالية تلقائي
bloginfo('name')اسم الموقع
wp_footer()بيحط أكواد السكريبتات والإضافات
</body> و </html>قفل الصفحة

8. استدعاء القوائم والفوتر الديناميكي

لو عملت قائمة للفوتر في functions.php:

register_nav_menu('footer-menu', 'Footer Menu');

تستدعيها كده في footer.php:

<?php
  wp_nav_menu([
    'theme_location' => 'footer-menu',
    'menu_class' => 'footer-nav'
  ]);
?>

9. دمج ملفات الجافاسكربت

أحسن مكان لتحميل ملفات الـ JS هو قبل </body>

في functions.php، استخدم:

wp_enqueue_script('theme-script', get_template_directory_uri().'/assets/js/script.js', [], null, true);

علشان السكريبت يتحط في wp_footer() تلقائي.

10. أهمية wp_footer()

لو نسيت السطر ده:

<?php wp_footer(); ?>

أكواد إضافات زي Google Analytics، Elementor، WooCommerce، مش هتشتغل.
يعني حرفيًا، الموقع ممكن يبوظ 🤕

11. التوافق مع الـ Responsive Design

خلي تصميم الفوتر:

✅ يستخدم Flexbox أو Grid
✅ يشتغل كويس على الموبايل
✅ يختصر المحتوى بدل ما يزحمه
✅ يخلّي النصوص كبيرة وواضحة

12. تقسيم الفوتر لأعمدة (Widgets)

ممكن تعمل مكان للويدجيت بالفوتر كده:

if ( is_active_sidebar( 'footer-widget-1' ) ) {
  dynamic_sidebar( 'footer-widget-1' );
}

وتضيف الأعمدة دي من لوحة التحكم.

13. ربطه بباقي الملفات

أي صفحة فيها:

<?php get_footer(); ?>

يعني الصفحة دي بتسحب footer.php وتعرضه تلقائي.

14. ممارسات احترافية

✅ ما تنساش wp_footer()
✅ فعّل ويدجيتات للفوتر
✅ خفف الأكواد قد ما تقدر
✅ اجرب الفوتر على الشاشات الصغيرة
✅ استخدم <footer> بدل <div> علشان SEO

15. مراجعة سريعة

  • footer.php هو آخر جزء في الصفحة
  • لازم يحتوي على wp_footer()
  • بيتستدعى بكود get_footer()
  • بيتحط فيه الحقوق، السكريبتات، القوائم السفلية
  • لازم يكون Responsive

✅ الأسئلة الشائعة

س: لو نسيت أضيف wp_footer()؟
ج: الموقع هيشتغل ناقص، الإضافات مش هتشتغل، وسرعة الموقع ممكن تتأثر.

س: ممكن أعمل أكتر من footer.php؟
ج: أيوه، زي: footer-home.php وتستخدم get_footer('home');.

س: الفوتر لازم يكون فيه قوائم؟
ج: لا، بس وجودها مفيد جدًا لتجربة المستخدم والسيو.

نهاية الدرس: “الوداع اللي يخلّي الزائر يرجع تاني”

الفوتر مش مجرد كلام صغير تحت الصفحة…
ده فرصتك الأخيرة تسيب انطباع حلو.

سواء كان فيه روابط، حقوق، أو تصميم أنيق…
لو تعاملت معاه باحتراف، الزائر هيحترم شغلك، وهيفكر يرجعلك.

خليك دايمًا بتفكر في كل تفصيلة 👌
عايز نكمل بملف index.php أو تشرحلي نبدأ عرض المقالات؟
قولي يا مبدع ✍️

مقالات مشابهة