قالب موقع دورات إلكترونية
ابتداءً من 29.00 US$
قالب موقع ودود للأكاديميات ومنصات التعليم الإلكتروني، بالعربية والإنجليزية مع دعم كامل للكتابة من اليمين إلى اليسار: كتالوج دورات مع بحث وتصفية، وصفحات دورات بمناهجها، والمدرّبون، والأسعار بدفع شهري أو سنوي، وقصص المتعلمين، والأسئلة الشائعة، والتسجيل.
- دفع آمن عبر PayPal
- تسليم رقمي فوري
- ترخيص واضح
- الدعم متاح
نظرة عامة
موقع متكامل لأكاديمية تعليمية أو منصة دورات إلكترونية أو شركة تدريب أو معسكر تدريبي، يصلك بنسختين كاملتين: العربية والإنجليزية. الصفحات العربية مصممة فعلًا من اليمين إلى اليسار: قوائم التنقل والبطاقات وخيارات التصفية والأقسام القابلة للطي والنماذج والأيقونات التي يهمها الاتجاه كلها معكوسة، مع خطوط عربية مضمّنة، وتواريخ وصيغ جمع مكتوبة كما يتوقعها القارئ العربي.
الصفحات (بكل لغة): الرئيسية، وكتالوج الدورات، وتفاصيل الدورة، والمدرّبون، والأسعار، وقصص المتعلمين، والأسئلة الشائعة، والتسجيل والتواصل، وصفحة 404، إضافة إلى صفحة لاختيار اللغة.
مبني حول دوراتك. جميع الدورات والمدرّبين والمجالات موجودة في ملف واحد سهل التعديل هو data/courses.js، والنص العربي فيه إلى جانب الإنجليزي. أضف دورة هناك فتظهر في الكتالوج، وتحصل على صفحة تفاصيل خاصة بها مع منهجها، وتُحتسب في الصفحة الرئيسية وفي بطاقة مدرّبها، باللغتين معًا. يُحسب عدد الدروس والمدة الإجمالية تلقائيًا، دون قاعدة بيانات أو أي خطوات بناء.
ما يستطيع الزائر فعله
- البحث في الكتالوج وتصفية الدورات حسب المجال والمستوى والسعر ولغة التدريس والدورات المحفوظة، وترتيبها حسب الشعبية أو التقييم أو الأحدث أو السعر أو المدة، ومشاركة نتائج التصفية عبر الرابط
- فتح صفحة الدورة لمعرفة ما سيتعلمه، وتصفح المنهج في قائمة قابلة للطي مع زر لفتح كل الوحدات، والاطلاع على المتطلبات والمدرّب وتوزيع التقييمات والمراجعات والدورات المشابهة
- حفظ الدورات في قائمته الخاصة ونسخ رابط الدورة
- المقارنة بين الخطط مع خيار الدفع الشهري أو السنوي وجدول للمزايا
- تصفح المدرّبين حسب المجال، وتصفية قصص المتعلمين، والبحث في الأسئلة الشائعة مع تمييز الكلمات المطابقة
- تعبئة نموذج التسجيل (مع مؤشر لقوة كلمة المرور واختيار الخطة) أو نموذج التواصل، مع رسائل تحقق واضحة وشاشة تأكيد
رسومات أصلية: 14 غلافًا مرسومًا للدورات، و6 صور مرسومة للمدرّبين، ورسم رئيسي للواجهة ورسومات مساندة، كلها بصيغة SVG ومن تصميمنا، ويسهل استبدالها بصورك.
التصميم مشرق وودود دون أن يكون طفوليًا: أزرق سماوي وأصفر عبّاد الشمس ومرجاني على خلفية بيضاء، وخطوط مستديرة الحواف (Baloo Bhaijaan 2 وAlmarai للعربية، وFredoka وNunito للإنجليزية)، وأزرار بيضاوية، وبطاقات كبيرة مستديرة الزوايا، وعناصر توحي بالتقدّم مثل حلقات التقدّم وأشرطة الإتمام وخط تقدّم القراءة. الخطوط مضمّنة في الملف، فلا يُحمَّل شيء من خارج موقعك.
تتحقق النماذج من البيانات داخل المتصفح وتعرض رقمًا مرجعيًا للتأكيد، وهي تعمل افتراضيًا في وضع تجريبي فلا ترسل أي بيانات. ولاستقبال الرسائل فعليًا، أضف عنوان استقبال واحدًا في الملف assets/js/config.js، ويشرح ملف README الطريقة. أما نموذج التسجيل فهو تصميم للواجهة الأمامية تربطه بمنصتك التعليمية.
ما الذي يتضمنه
- ملفات المنتج كاملة (ZIP)
اللغات
وصف المنتج وتفاصيله متوفرة بهذه اللغات.
المزايا
- نسختان كاملتان بالعربية (من اليمين إلى اليسار) والإنجليزية، مع زر لتبديل اللغة في كل صفحة يحتفظ بالصفحة الحالية وخيارات التصفية
- 9 صفحات لكل لغة: الرئيسية، والكتالوج، وتفاصيل الدورة، والمدرّبون، والأسعار، وقصص المتعلمين، والأسئلة الشائعة، والتسجيل والتواصل، و404، إضافة إلى صفحة اختيار اللغة
- كل الدورات والمدرّبين والمجالات في ملف بيانات واحد، والنص العربي فيه إلى جانب الإنجليزي
- بحث في الكتالوج وتصفية حسب المجال والمستوى والسعر ولغة التدريس والدورات المحفوظة
- ستة خيارات للترتيب، وروابط قابلة للمشاركة لنتائج التصفية، وشارات تصفية قابلة للإزالة، ورسالة مفيدة عند عدم وجود نتائج
- صفحات تفاصيل الدورات تُنشأ من ملف البيانات، مع منهج في قائمة قابلة للطي وزر لفتح كل الوحدات
- حساب تلقائي لعدد الدروس والمشاريع والاختبارات والمدة الإجمالية لكل دورة
- توزيع التقييمات ومراجعات المتعلمين والدورات المشابهة في كل صفحة دورة
- صندوق تسجيل يعرض السعر والخصم ومحتويات الدورة، مع حفظ الدورة ونسخ رابطها
- بطاقات للمدرّبين تعرض عدد الدورات والمتعلمين ومتوسط التقييم، مع التصفية حسب المجال والبحث
- خطط أسعار مع مفتاح سهل الاستخدام للتبديل بين الدفع الشهري والسنوي، وجدول لمقارنة المزايا
- قصص متعلمين قابلة للتصفية وحلقات توضح نتائج التعلّم
- أسئلة شائعة قابلة للبحث ومقسّمة إلى فئات، مع تمييز الكلمات المطابقة
- نموذجا تسجيل وتواصل في تبويبين، مع التحقق من البيانات وملخص للأخطاء ومؤشر لقوة كلمة المرور وشاشة تأكيد
- إعداد اختياري لعنوان استقبال النماذج، ووضع تجريبي يعمل مباشرة دون أي إعداد
- 14 غلافًا أصليًا للدورات و6 صور للمدرّبين ورسومات للصفحات، كلها بصيغة SVG
- تصميم مشرق وودود: أزرق سماوي وأصفر عبّاد الشمس ومرجاني، وخطوط مستديرة، وأزرار بيضاوية، وعناصر توحي بالتقدّم
- خطوط مضمّنة في الملف: Baloo Bhaijaan 2 وAlmarai وFredoka وNunito (برخصة SIL المفتوحة للخطوط)
- تصميم متجاوب من الهواتف إلى الشاشات الكبيرة، مع قائمة للجوال وخيارات تصفية قابلة للطي
- قوائم وتبويبات وخيارات تصفية تعمل بلوحة المفاتيح، وتركيز مرئي، وتباين ألوان بمستوى WCAG AA، واحترام إعداد تقليل الحركة
- HTML وCSS وJavaScript فقط: دون خطوات بناء أو أطر عمل، ويعمل دون اتصال وبمجرد فتحه من جهازك
- ملف README مفصّل يشرح التشغيل وتعديل الدورات والصور والخطوط والألوان والنماذج والنشر
المتطلبات
لا يحتاج إلى خادم أو قاعدة بيانات أو أدوات بناء. القالب مكتوب بـ HTML5 وCSS3 وJavaScript فقط، دون أطر عمل أو مكتبات خارجية. افتح الملف index.html مباشرة من جهازك أو ارفع المجلد إلى أي استضافة للمواقع الثابتة، ويكفيك محرر نصوص لتعديله.
التوافق
مبني بلغات الويب القياسية ليعمل على الإصدارات الحالية من Chrome وEdge وFirefox وSafari على الحاسوب وأجهزة Android وiOS. متجاوب من الهواتف الصغيرة (360 بكسل) إلى الشاشات الكبيرة.
التثبيت
- فك ضغط الملف
online-courses-website-template-1.0.0.zip. - انقر نقرًا مزدوجًا على
index.htmlواختر العربية أو English. كل شيء يعمل من جهازك مباشرة، بما في ذلك تصفية الكتالوج وصفحات الدورات والنماذج. - أو اعرض الموقع عبر خادم محلي من داخل المجلد، مثلًا بالأمر
python3 -m http.server 8000، ثم افتح http://localhost:8000/. - للنشر، ارفع محتويات المجلد
online-courses-website-templateإلى أي استضافة للمواقع الثابتة (Netlify أو Vercel أو Cloudflare Pages أو GitHub Pages أو استضافة تقليدية عبر FTP).
يشرح ملف README كل خطوة بالتفصيل، بما في ذلك صفحة 404 المخصصة واختيار اللغة الافتراضية.
دليل الاستخدام
عدّل الدورات والمدرّبين والمجالات في الملف data/courses.js، ولكل نص قيمة إنجليزية "en" وأخرى عربية "ar". انسخ كتلة دورة لإضافة دورة جديدة، فتظهر في الكتالوج وتحصل على صفحتها الخاصة على الرابط course.html?id=معرّف-دورتك. اجعل "featured": true لعرضها في الصفحة الرئيسية، و"price": 0 لجعلها مجانية.
عدّل نصوص الصفحات في ملفات HTML: الصفحات العربية في المجلد ar/ والإنجليزية في en/ بأسماء الملفات نفسها.
غيّر الألوان عبر متغيرات CSS في أعلى الملف assets/css/style.css (مثل --sky-600 و--sun-400 و--coral-400 و--ink).
غيّر الخطوط بإضافة ملفات WOFF2 إلى assets/fonts/ وتحديث قواعد @font-face والمتغيرين --font-display و--font-body.
استبدل الصور بوضع صورك في assets/img/courses/ (بنسبة 16:10) وassets/img/instructors/ (مربعة) وتحديث مساراتها في ملف البيانات.
لاستقبال النماذج اكتب في formEndpoint داخل assets/js/config.js عنوانًا يستقبل طلبات JSON من نوع POST. ودون ذلك تعمل النماذج في الوضع التجريبي وتعرض شاشة التأكيد فقط، ولا تُرسل كلمة المرور أبدًا.
خطط الأسعار تُعدَّل في ar/pricing.html وen/pricing.html: النص الظاهر، وقيمتا data-monthly وdata-yearly اللتان يستخدمهما مفتاح التبديل، وملاحظة الدفع السنوي في data-note-yearly.
الترخيص
| شخصي29.00 US$ | تجاري45.00 US$ | ممتد149.00 US$ | |
|---|---|---|---|
| عدد المشاريع | 1 | 5 | غير محدود |
| عدد المستخدمين أو المواقع | 1 | 1 | 5 |
| الاستخدام التجاري | غير مسموح | مسموح | مسموح |
| التعديل | مسموح | مسموح | مسموح |
| إعادة البيع | غير مسموح | غير مسموح | غير مسموح |
| إعادة التوزيع | غير مسموح | غير مسموح | غير مسموح |
| التحديثات | 12 شهرًا | 12 شهرًا | مدى الحياة |
| مدة الدعم | 6 أشهر | 12 شهرًا | 12 شهرًا |
| مفتاح ترخيص | نعم | نعم | نعم |
ادفع عبر PayPal أو ببطاقة خصم أو ائتمان. نرسل لك المنتج بعد تأكيد الدفع.
الدعم والتحديثات
لديك سؤال أو واجهت مشكلة؟ تواصل مع دعم TowerCaty عبر البيانات الموجودة في رسالة طلبك. يرجى ذكر اسم المنتج وإصداره (قالب موقع دورات إلكترونية 1.0.0) والمتصفح الذي تستخدمه، مع وصف مختصر للمشكلة أو لقطة شاشة لها.
سجل التغييرات
1.0.0
- الإصدار 1.0.0: أول إصدار في المتجر.
آخر تحديث
- آخر تحديث
- 07/10/2026
- الإصدار
- 1.0.0
