وصف جاهز لعرض المشروع في مستقل (قابل للنسخ واللصق)
Landing Page + Multi-Category E-Commerce Front-End Website
قمت بتطوير واجهة متجر إلكتروني احترافية Hazber Studio باستخدام HTML, CSS, JavaScript مع تصميم تفاعلي وتجربة مستخدم عالية الجودة. الموقع يدعم عدّة أقسام مثل: الشوكولاتة – الهدايا – المواليد – المنتجات الموسمية، مع نظام عرض ديناميكي للمنتجات.
أبرز مميزات المشروع
1) صفحة رئيسية تفاعلية بتقنية الـ Swiper
سلايدر رئيسي احترافي مع خلفيات عالية الدقة وانتقالات سلسة.
كل سلايد يحتوي CTA جاهز (Shop – WhatsApp).
Lazy Loading لتحسين الأداء.
طبقة Overlay لتثبيت الهوية البصرية.
(موجود في ملف index.html)
index
2) نظام منتجات ديناميكي بالكامل
ربط الموقع بملف JSON يعرض المنتجات تلقائيًا حسب الكلمات المفتاحية والصفحات.
دعم:
Featured Products
New Arrivals
Pagination
Category Filtering (Baby / Chocolate / Gifts)
كل منتج يحتوي:
صور متعددة
عنوان
وصف
سعر
(مأخوذ من ملف المنتجات)
products
3) صفحات كاتالوج متعددة جاهزة للاستخدام
لكل قسم صفحة مخصصة:
صفحة مواليد baby.html
صفحة شوكولاتة chocolate.html
صفحة هدايا gift.html
كل صفحة تسحب بياناتها من JSON وتعرض المنتجات بطريقة متجاوبة على جميع الأجهزة.
4) صفحة تفاصيل المنتج Product Page
عرض صورة رئيسية وصور مصغّرة قابلة للتغيير.
معلومات كاملة:
Category
Title
Price
Description
زر Order via WhatsApp مع تعبئة تفاصيل المنتج تلقائيًا.
(من ملف product.html)
product
5) Header & Footer جاهزين وإعادة استخدامهم عبر جميع الصفحات
باستخدام include عبر JavaScript لتحميل نفس الهيدر والفوتر في كل الصفحات بدون تكرار أكواد.
6) تجربة مستخدم احترافية
شاشة تحميل (Loading Screen)
زر واتساب ديناميكي لكل قسم
تصميم كامل متجاوب للهاتف والتابلت
7) قابل للتطوير
يمكن تحويله بسهولة إلى:
لوحة تحكم (Dashboard)
نظام إدارة منتجات
ربط API
ربط Payment Gateways