انتقل إلى المحتوى الرئيسي

تطوير القوالب (Theme Development)

قم ببناء واجهات متاجر مخصصة لمتاجر Qumra الإلكترونية.

البداية السريعة​

# 1. تثبيت واجهة سطر الأوامر
npm install -g qumra-cli

# 2. تسجيل الدخول (مطلوب أولاً)
qumra user login

# 3. إنشاء قالب
qumra theme init

# 4. بدء التطوير
cd my-theme
qumra theme dev
تسجيل الدخول مطلوب

يجب تشغيل qumra user login قبل استخدام أي أوامر أخرى.

إضافة VS Code

قم بتثبيت إضافة Qalab للحصول على الإكمال التلقائي وتمييز الصيغة.

هيكل القالب (Theme Structure)​

my-theme/
├── .qumra/              # إعدادات القالب
├── assets/              # CSS, JS, الصور
├── layouts/             # قوالب HTML
├── locales/             # الترجمات
├── pages/               # تعريفات الصفحات
├── settings/            # إعدادات القالب
├── templates/           # Header, footer
├── ui/                  # مكونات قابلة لإعادة الاستخدام
└── widgets/             # أقسام الصفحات

عرض الهيكل الكامل ←

المفاهيم الأساسية​

المفهومالوصف
Widgetsأقسام الصفحة مع الإعدادات والـ blocks
Settingsخيارات القالب القابلة للتخصيص
Layoutsهيكل HTML للصفحة
Qalabلغة القوالب

أوامر CLI​

الأمرالوصف
qumra theme initإنشاء قالب جديد
qumra theme devبدء خادم التطوير
qumra theme publishنشر القالب للمتجر
qumra gen widget <name>إنشاء widget

مرجع CLI الكامل ←

إنشاء Widgets​

qumra gen widget hero-slider

هذا ينشئ:

  • widgets/hero-slider/schema.json - إعدادات الـ widget
  • widgets/hero-slider/widget.njk - قالب الـ widget

تعرف على المزيد حول widgets ←

النشر​

# نشر وتفعيل
qumra theme publish

# تحديثات الإصدار
qumra theme patch   # 1.0.0 → 1.0.1
qumra theme minor   # 1.0.0 → 1.1.0
qumra theme major   # 1.0.0 → 2.0.0

الموارد​