السلام عليكم ورحمة الله وبركاته،
بناءً على النقاش الذي دار في هذا الموضوع، رأينا أن نفرد شرحًا مختصرًا لخدمة التضمين المتوفرة في الموسوعة القرآنية، حتى يسهل على أصحاب المواقع والتطبيقات القرآنية الاستفادة منها. الاستفادة من الخدمة ليست حصرًا على المواقع القرآنية، فمثلًا يمكن ربط الآيات القرآنية داخل المقالات والمحتوى بمختلف أنواعه.
تتيح الخدمة ربط أي آية مع المحتوى المتعلق بها في الموسوعة، مثل:
- التفاسير.
- غريب القرآن.
- التدبر.
- الإعراب.
- القراءات.
- وغيرها من المواد والخدمات المرتبطة بالآية.
وذلك دون الحاجة إلى نسخ محتوى الموسوعة، أو تخزينه وإدارته داخل موقعكم أو تطبيقكم.
رابط التضمين
يمكن عرض خدمات الموسوعة المرتبطة بأي آية من خلال الرابط التالي:
https://quranpedia.net/embed?surah=1&ayah=1
يستقبل الرابط متغيرين:
surah: رقم السورة.ayah: رقم الآية.
فمثلًا، لعرض المحتوى المرتبط بآية الكرسي:
https://quranpedia.net/embed?surah=2&ayah=255
يمكن فتح الرابط في صفحة مستقلة، أو عرضه داخل نافذة منبثقة popup باستخدام iframe:
<iframe
src="https://quranpedia.net/embed?surah=2&ayah=255"
title="الموسوعة القرآنية"
width="100%"
height="700"
frameborder="0"
loading="lazy"
allowfullscreen
></iframe>
كيف يمكن ربطها بالمحتوى القرآني؟
إذا كان موقعكم أو تطبيقكم يعرض نصوص الآيات، فيكفي أن يعرف النظام رقم السورة ورقم الآية التي اختارها المستخدم.
فعند النقر على آية، أو على زر بجانبها مثل:
استعرض الآية في الموسوعة القرآنية
يتم إنشاء الرابط تلقائيًا:
https://quranpedia.net/embed?surah={رقم السورة}&ayah={رقم الآية}
ثم عرضه بالطريقة المناسبة داخل المشروع.
مثلًا:
const embedUrl =
`https://quranpedia.net/embed?surah=${surah}&ayah=${ayah}`;
ولا يشترط استخدام تقنية محددة؛ إذ يمكن دمج الخدمة في مواقع الويب، وتطبيقات الهاتف، ومنصات التعليم والحفظ والتدبر، وأي مشروع يعرض محتوى قرآنيًا.
أمثلة على الاستخدام
يمكن الاستفادة من الخدمة في:
- إظهار تفسير الآية عند النقر عليها.
- إضافة زر «المزيد حول الآية» بجوار النص القرآني.
- ربط الآيات الواردة داخل المقالات والبحوث بالموسوعة.
- دعم تطبيقات الحفظ والمراجعة بمحتوى التفسير والتدبر.
- عرض معلومات الآية داخل نافذة جانبية أو منبثقة.
- إثراء تطبيقات التلاوة والاستماع بالخدمات العلمية المرتبطة بكل آية.
توصية تقنية
يفضل عدم إنشاء iframe لكل آية داخل الصفحة، خصوصًا إذا كان المحتوى طويلًا.
الأفضل أن يُحمّل التضمين فقط بعد اختيار المستخدم للآية، داخل نافذة واحدة يتغير رابطها بحسب الآية المختارة. ويمكن استخدام:
loading="lazy"
لتأخير التحميل وتحسين أداء الصفحة.
الخدمة متاحة حاليًا، ويسعدنا أن تستفيد منها المشاريع القرآنية المختلفة.
ومن يطبقها في مشروعه أو يواجه إشكالًا أثناء الربط، يمكنه مشاركة تجربته أو سؤاله هنا حتى يستفيد منه بقية المطورين.
جزاكم الله خيرًا، وبارك في كل جهد يخدم كتاب الله.
