البدء

​

المتطلبات الأساسية

• حساب Shopify (تجربة مجانية متاحة)
• الوصول إلى لوحة تحكم Shopify الخاصة بك

​

الخطوة 1: إنشاء متجر Shopify الخاص بك

إذا لم يكن لديك متجر Shopify بالفعل، اتبع هذه الخطوات (إذا كان لديك حساب بالفعل، انتقل إلى الخطوة 2):

1. انتقل إلى shopify.com وانقر على ابدأ التجربة المجانية.
2. أدخل بريدك الإلكتروني، وأنشئ كلمة مرور، واختر اسم متجرك
3. أكمل عملية الإعداد - أضف تفاصيل عملك، واختر خطة، وقم بتكوين التفضيلات
4. أضف المنتجات، ونظم المجموعات، وقم بإعداد بوابات الدفع

​

الخطوة 2: تثبيت تطبيق Headless

يتصل Framerfy بمتجرك عبر Storefront API الخاص بـ Shopify لجلب البيانات. لتمكين هذا:

1. في لوحة تحكم Shopify، انتقل إلى الإعدادات → التطبيقات وقنوات البيع
2. انقر على متجر تطبيقات Shopify
3. ابحث عن Headless وافتح التطبيق من Shopify
4. انقر على تثبيت، ثم فتح

​

الخطوة 3: إنشاء Storefront

1. في تطبيق Headless، انقر على إضافة Storefront
2. أدخل اسمًا لـ Storefront الخاص بك
3. ضمن قسم Storefront API، انقر على إدارة
4. قم بتمكين جميع النطاقات المطلوبة (قراءة الوصول إلى المنتجات والمجموعات وعمليات الدفع والعملاء)
5. انسخ رمز الوصول العام - هذا هو مفتاح API الخاص بك لـ Framerfy.

​

الخطوة 4: الحصول على نطاق المتجر الخاص بك

1. انتقل إلى الإعدادات → النطاقات
2. انسخ النطاق الأساسي الخاص بك (التنسيق: your-store.myshopify.com)

​

الخطوة 5: تكوين Framerfy

الآن قم بربط متجر Shopify الخاص بك بـ Framerfy:

1. زر framerfy.ae وسجل الدخول باستخدام بريدك الإلكتروني
2. بمجرد تسجيل الدخول، انتقل إلى صفحة نظرة عامة
3. انقر على + إضافة متجر
4. أدخل اسم متجر (لا يحتاج إلى مطابقة اسم متجر Shopify - إنه فقط لراحتك)
5. الصق عنوان URL لنطاق Shopify و رمز الوصول العام (من الخطوة 3)
6. انقر على حفظ

لقد انتهيت! متجرك متصل الآن بـ Framerfy.

​

الخطوة 6: الوصول إلى الإضافة

لاستخدام Framerfy داخل Framer:

1. افتح مشروع Framer الخاص بك
2. انقر على الإضافات في شريط الأدوات
3. ابحث عن Framerfy وافتحه
4. انقر على تسجيل الدخول وأدخل بيانات اعتمادك (البريد الإلكتروني وكلمة المرور من الخطوة 5)
5. حدد متجرك وانقر على متابعة
6. ستصل إلى الصفحة الرئيسية - اكتمل إعداد الإضافة الخاصة بك ✅

​

الخطوة 7: جلب البيانات في CMS

لمزامنة منتجات Shopify الخاصة بك مع CMS الخاص بـ Framer:

1. انتقل إلى صفحة CMS في Framer
2. انقر على إدارة (متاح في الرأس)
3. حدد جميع الحقول التي تحتاجها لبناء موقعك
4. انقر على تأكيد
5. ستتم الآن مزامنة بيانات Shopify الخاصة بك مع CMS الخاص بـ Framer

::: tip ملاحظة إذا قمت بإجراء تغييرات على منتجات Shopify الخاصة بك، انقر على زر المزامنة في الرأس لسحب أحدث التحديثات. :::

​

الخطوة 8: استخدام المكونات المخصصة

بمجرد اكتمال الإعداد، افتح الإضافة للوصول إلى مكتبة المكونات. تتضمن مكونات جاهزة للاستخدام لتكامل Framer × Shopify الخاص بك:

• منتقي المتغيرات
• معارض صور المتغيرات
• عرض السعر
• زر إضافة إلى العربة
• زر الشراء
• نافذة العربة
• مرشحات الأسعار
• منتقي الألوان
• منتقي الكمية

اسحب وأفلت هذه المكونات في مشروع Framer الخاص بك لبناء متجرك. ::: tip ملاحظة نحن حاليًا في المرحلة التجريبية. إذا كنت تحتاج إلى مكون مفقود، أرسل طلبًا عبر نموذج المساعدة والملاحظات مع اسم المكون والوصف. نحن نبني بنشاط بناءً على ملاحظات المستخدمين - لا تتردد في التواصل. :::

​

تفاصيل الاتصال

لديك الآن كل ما تحتاجه للاتصال: أدخل هذه في إعدادات اتصال متجر Framerfy لإكمال التكامل.