
كثير من المواقع العربية والإسلامية تحتاج إلى عنصر واحد بسيط: بطاقة تعرض الصلاة القادمة والوقت المتبقي لها. المشكلة أن أغلب الحلول المتاحة إما تتطلب تسجيلاً وحساباً، أو تفرض إعلانات داخل البطاقة، أو تتجاهل اللغة العربية واتجاه الكتابة من اليمين إلى اليسار. هذا الدليل يشرح كيف تضيف مواقيت الصلاة إلى موقعك بكود واحد، وكيف تختار الإعدادات الصحيحة حتى تكون الأوقات دقيقة لجمهورك فعلاً.
لماذا يخطئ كثير من مواقع مواقيت الصلاة
الخطأ الأشهر ليس في الكود بل في الإعدادات. المواقيت ليست رقماً واحداً متفقاً عليه، بل نتيجة معادلة فلكية تعتمد على ثلاثة عناصر:
- الإحداثيات: خط الطول والعرض للمدينة، وليس اسم الدولة فقط. الفرق بين طرفي مدينة كبيرة قد يبلغ دقيقتين.
- طريقة الحساب: زاوية الشمس تحت الأفق المعتمدة للفجر والعشاء. أم القرى ورابطة العالم الإسلامي والهيئة المصرية وجامعة كراتشي تعطي نتائج مختلفة قد تتجاوز عشر دقائق للفجر.
- المذهب في العصر: الجمهور يعتمد مثل ظل الشيء، والحنفية مثليه، والفارق قد يقارب النصف ساعة صيفاً.
إذا نسخت ويدجت جاهزة دون ضبط هذه العناصر فأنت تنشر أرقاماً لا تخص زوارك. لذلك تبدأ أداة تضمين مواقيت الصلاة بضبط المدينة وطريقة الحساب قبل توليد الكود.
الخطوة الأولى: حدد جمهورك ومدينته
اسأل نفسك: هل موقعك يخدم مدينة واحدة مثل مسجد أو مركز إسلامي، أم جمهوراً موزعاً في عدة دول؟
- جمهور محلي: ثبّت المدينة في الويدجت. الزائر يرى دائماً توقيت مدينتك حتى لو كان مسافراً، وهذا هو المطلوب لموقع مسجد.
- جمهور عام: اترك الويدجت على الكشف التلقائي للموقع، فيعرض لكل زائر توقيت مدينته.
- جمهور مختلط: ضع بطاقة ثابتة لمدينتك في الصفحة الرئيسية، ورابطاً إلى صفحة مواقيت الصلاة الكاملة لمن يريد مدينته.
الخطوة الثانية: ولّد الكود وألصقه
انتقل إلى صفحة الويدجت، اختر المدينة وطريقة الحساب واللغة والمظهر، ثم انسخ كود التضمين. الكود عبارة عن عنصر iframe واحد لا يحتاج جافاسكربت خارجياً ولا مكتبات إضافية:
ألصق الكود في أي مكان يقبل HTML: قالب ووردبريس، أو بلوك HTML مخصص، أو صفحة ثابتة، أو نشرة داخلية.
نقاط عملية عند اللصق:
- ضع الويدجت داخل حاوية عرضها مرن حتى لا يُقص على الهواتف.
- أبقِ سمة loading بقيمة lazy إذا كان الويدجت أسفل الصفحة، فذلك يحسّن سرعة التحميل الأولى.
- لا تضع الويدجت داخل عنصر يخفيه CSS ثم يظهره لاحقاً، لأن بعض المتصفحات تؤجل حساب الأبعاد.
الخطوة الثالثة: اضبط اللغة والاتجاه
الويدجت يدعم العربية والإنجليزية. عند اختيار العربية يتحول الاتجاه تلقائياً إلى RTL، وتُعرض الأرقام بالتنسيق المناسب للغة الصفحة. إذا كان موقعك ثنائي اللغة فمرّر اللغة نفسها التي تستخدمها الصفحة، حتى لا يظهر عنصر إنجليزي وسط محتوى عربي.
الخطوة الرابعة: تحقق من الدقة قبل النشر
قبل أن تعلن عن الويدجت لجمهورك، قارن نتيجته مع مرجع محلي موثوق لمدينتك لثلاثة أيام متتالية:
- قارن الفجر والعشاء أولاً، فهما الأكثر تأثراً بطريقة الحساب.
- تأكد من التوقيت الصيفي إن كانت دولتك تطبقه.
- راجع صلاة العصر إن كان جمهورك يتبع المذهب الحنفي.
إن ظهر فارق ثابت بضع دقائق فالغالب أن طريقة الحساب مختلفة عن المعتمدة محلياً، وليست الأداة معطلة. غيّر الطريقة وأعد التوليد.
ماذا تضيف حول الويدجت لتستفيد منه صفحتك
الويدجت وحده عنصر مفيد، لكن الصفحة التي تحويه تصبح أقوى حين تحيط به بمحتوى يخدم نية الزائر نفسها:
- رابط إلى اتجاه القبلة لمن يزور المسجد أو يسافر.
- رابط إلى التقويم الهجري لمعرفة المناسبات القادمة.
- رابط إلى أذكار الصباح والمساء بعد بطاقة المواقيت مباشرة.
- إن كان موقعك يخدم موسم رمضان، أضف إمساكية الشهر.
أسئلة شائعة
هل الويدجت مجاني فعلاً؟
نعم، ولا يتطلب حساباً ولا مفتاح API، ولا يعرض إعلانات داخل البطاقة.
هل يبطئ موقعي؟
البطاقة خفيفة وتُحمّل داخل إطار مستقل، فلا تتعارض مع أنماط موقعك ولا مع سكربتاته. استخدم التحميل الكسول إذا كانت أسفل الصفحة.
هل يجمع بيانات زواري؟
الكشف عن المدينة يتم لعرض التوقيت فقط، ولا نبني ملفات تعريف للزوار. راجع سياسة الخصوصية.
هل يمكنني تخصيص الألوان؟
يمكنك اختيار المظهر الفاتح أو الداكن عند التوليد، وإحاطة الإطار بحاوية تحمل حدود موقعك ومسافاته.
خلاصة
مواقيت دقيقة تعني إعدادات صحيحة أولاً: إحداثيات المدينة، وطريقة الحساب المعتمدة محلياً، ومذهب العصر، ثم كود واحد تلصقه في موقعك. ابدأ من أداة التضمين، وتحقق من النتيجة ثلاثة أيام، وستحصل على بطاقة صلاة موثوقة تخدم زوارك كل يوم.
مصادر البيانات
- الهيئة العامة للمساحة والمعلومات الجيومكانية، تقويم أم القرى
- رابطة العالم الإسلامي، معايير حساب مواقيت الصلاة
- توثيق معايير الويب MDN حول عنصر iframe وسمة loading
آخر تحديث: ٠٢ ٠٩ ٢٠٢٦