كيفية تنفيذ Clerk.io لـ Magento PWA: دليل خطوة بخطوة
نشرت: 2023-05-25يتيح لك دمج Clerk.io مع تطبيق الويب التقدمي Magento (PWA) تقديم توصيات مخصصة وتتبع المبيعات بفعالية. سيرشدك منشور المدونة هذا خلال الخطوات لتنفيذ Clerk.io بسلاسة لـ Magento PWA ، مما يتيح لك تعزيز مشاركة العملاء وزيادة التحويلات.
لماذا تكامل Clerk.io مع Magento PWA؟
يوفر دمج Clerk.io مع Magento PWA العديد من المزايا الرئيسية لمتجرك عبر الإنترنت:
- التوصيات المخصصة: يوفر Clerk.io أدوات توصية قوية يمكن دمجها بسلاسة في صفحة عربة التسوق وصفحة الفئة وصفحة المنتج. تتيح لك هذه الأدوات عرض توصيات منتجات مخصصة لعملائك ، مما يعزز فرص البيع المتبادل والبيع الإضافي.
- تتبع المبيعات المحسن: يوفر Clerk.io إمكانات قوية لتتبع المبيعات ، مما يسمح لك بجمع رؤى قيمة حول سلوك العملاء وقياس فعالية حملاتك التسويقية. من خلال تتبع بيانات المبيعات ، يمكنك تحسين استراتيجياتك وزيادة نمو الإيرادات.
الميزات الرئيسية للتكامل
قبل الغوص في عملية التنفيذ ، دعنا نستكشف الميزات الرئيسية التي يقدمها Clerk.io للتكامل السلس مع Magento PWA:
- أداة التوصيات: تتيح لك أداة التوصيات عرض توصيات المنتجات المخصصة ديناميكيًا. قم بتنفيذه على عربة التسوق ، والفئة ، وصفحات المنتج لزيادة تفاعل العملاء وتحويلاتهم.
- مزامنة بيانات المتجر: يوفر Clerk.io عملية مزامنة لضمان توصيل Magento PWA الخاص بك بسلاسة ، مما يمكّن النظام الأساسي من استرداد البيانات ذات الصلة واستخدامها بفعالية.
7 خطوات لتطبيق Clerk.io لـ Magento PWA
1. إنشاء حساب كاتب وتسجيل الدخول
ابدأ بإنشاء حساب Clerk.io وتسجيل الدخول إلى لوحة معلومات Clerk.io.
2. إضافة متجر
بعد تسجيل الدخول إلى my.clerk.io ، فإن الخطوة الأولى هي إضافة متجرك:
- أدخل اسم ومجال متجر الويب الخاص بك
- اختر Magento 2 كمنصة
- حدد عملتك
- انقر فوق إضافة متجر جديد للمتابعة
3. تثبيت وتكوين الامتداد
لدمج Clerk.io مع Magento PWA ، تحتاج إلى تثبيت امتداد Clerk.io وتكوينه. اتبع هذه الخطوات:
- قم بتشغيل الأوامر التالية في جهازك الطرفي:
يتطلب الملحن كاتب / magento2 php bin / magento module: قم بتمكين Clerk_Clerk php bin / magento setup: ترقية php bin / magento setup: di: compile
- بعد تثبيت الامتداد ، قم بتكوينه بالانتقال إلى Store → Configuration → Clerk وإدخال مفتاح Clerk.io API الخاص بك.
4. مزامنة متجرك
بعد تكوين الامتداد ، من المهم مزامنة متجر Magento الخاص بك مع Clerk.io:
- ارجع إلى دليل الإعداد في لوحة معلومات Clerk.io وانقر على مزامنة بياناتك .
- أدخل تفاصيل متجرك وانقر فوق بدء المزامنة لبدء عملية المزامنة. تضمن هذه الخطوة أن بيانات متجرك متصلة بـ Clerk.io.
5. إعداد وتكوين أداة التوصيات
ارجع إلى الخطوات الأولى للتوصيات حول Magento 2 من أجل:
- إنشاء أشرطة تمرير التوصية
- تحديد محتويات القطعة
- تكوين عرض المحتوى من خلال الواجهة الخلفية لـ Magento
6. اعرض أداة التوصيات برمجيًا
لإظهار أداة التوصيات برمجيًا في سلة التسوق ، والفئة ، وصفحات المنتج ، تحتاج إلى تنفيذ الخطوات التالية:
قم بإنشاء وحدة لاسترداد تكوين محتوى عنصر واجهة المستخدم من الواجهة الخلفية لماجينتو.
- حدد متغيرات التكوين في ملف di.xml .
- قم بإنشاء ملف schema.graphqls مع الحقول المطلوبة لاسترجاع API.
قم بتطوير وظيفة إضافية لـ PWA للاستعلام عن بيانات تكوين المتجر وجلب محتوى عنصر واجهة المستخدم.
- استعلام GraphQl لاسترداد بيانات تكوين المخزن.
- بعض الروابط المخصصة للاستعلام عن نقطة نهاية Clerk API
https://api.clerk.io/v2?payload=
لجلب بيانات محتوى عنصر واجهة المستخدم. - المكونات الممتدة من المكون الأساسي PWA ، مع اعتراضات قابلة للاستهداف برمجيًا تستدعي الخطافات المخصصة وتدرج بيانات المحتوى بناءً على التكوين.
- بعض أوراق الأنماط لتتوافق مع الموضوع الحالي.
الكود ذو الصلة:
<! - حدد متغير التكوين في ملف di.xml. -> <type name = "Magento \ StoreGraphQl \ Model \ Resolver \ Store \ StoreConfigDataProvider"> <الحجج> <اسم الوسيطة = "extensionConfigData" xsi: type = "array"> <item name = "clerk_general_public_key" xsi: type = "string"> كاتب / عام / public_key </item> <item name = "clerk_category_enabled" xsi: type = "string"> كاتب / فئة / ممكن </ em> <item name = "clerk_category_content" xsi: type = "string"> كاتب / فئة / محتوى </item> <item name = "clerk_product_enabled" xsi: type = "string"> كاتب / منتج / ممكّن </ em> <item name = "clerk_product_content" xsi: type = "string"> كاتب / منتج / محتوى </item> <item name = "clerk_cart_enabled" xsi: type = "string"> كاتب / سلة التسوق / ممكن </ em> <item name = "clerk_cart_content" xsi: type = "string"> كاتب / سلة تسوق / محتوى </ item </argument> </ الحجج> </type>
// قم بإنشاء ملف schema.grapqls اكتب StoreConfig { clerk_general_public_key: Stringdoc (الوصف: "clerk public key") clerk_category_enabled: منطقيdoc (الوصف: "حالة محتوى فئة كاتب") clerk_category_content: Stringdoc (الوصف: "فئة محتوى فئة الكاتب") clerk_product_enabled: Booleandoc (الوصف: "حالة محتوى منتج كاتب") clerk_product_content: Stringdoc (الوصف: "فئة محتوى المنتج كاتب") clerk_cart_enabled: Booleandoc (الوصف: "حالة محتوى عربة التسوق") clerk_cart_content: Stringdoc (الوصف: "حالة محتوى عربة التسوق") }
// استعلام GraphQl لاسترداد بيانات تكوين المتجر. تصدير const GET_STORE_CONFIG_DATA = gql` الاستعلام عن getStoreConfigClerk { # eslint-disable-next-line @ graphql-eslint / need-id-when-available storeConfig { store_code كاتب_العام_المفتاح العام كاتب_فئة_تمكين كاتب_الفئة_محتوى clerk_product_enabled clerk_product_content clerk_cart_enabled clerk_cart_content } } "؛
7. تمكين تتبع المبيعات برمجياً
لتنفيذ تتبع المبيعات باستخدام Clerk.io في Magento PWA ، اتبع الخطوات التالية:
- قم بإنشاء مكونات ومخالب لتوسيع ملفات سمة Venia الأساسية والتعامل مع استدعاءات واجهة برمجة التطبيقات لتتبع المبيعات إلى نقطة نهاية Clerk.io
https://api.clerk.io/v2/log/sale
للكاتب بعد تقديم الطلب. - قم بتوسيع ملفات السمات المتعلقة بطرق الدفع الخاصة بك ، مثل SagePay و Stripe ، لتضمين تتبع المبيعات.
- قم بتوسيع
@magento/peregrine/lib/store/actions/checkout/asyncActions.js
لدمج الوظائف الضرورية.
باتباع هذه الخطوات ، يمكنك دمج Clerk.io بنجاح مع Magento PWA والاستفادة من ميزاته القوية لتعزيز تجربة التسوق لعملائك.
مثال عرض
للحصول على تمثيل مرئي لتكامل Clerk.io أثناء العمل ، قم بزيارة موقعنا التجريبي.
- صفحة الفئة
- صفحة المنتج
- صفحة عربة التسوق
- تتبع المبيعات
الكلمات الأخيرة
يوفر دمج Clerk.io مع Magento PWA مزايا قوية لمتجرك عبر الإنترنت. باتباع الخطوات المقدمة ، يمكنك تنفيذ Clerk.io بسلاسة والاستمتاع بالتوصيات المخصصة وتتبع المبيعات الفعال.
إذا واجهت أي تحديات أثناء عملية الاندماج أو كنت تفضل أن يتعامل معها الخبراء نيابة عنك ، فإن فريق Tigren هنا لمساعدتك. مع أكثر من 5 سنوات من الخبرة في تطوير Magento PWA ، لدينا معرفة وخبرة متعمقة لمساعدتك. سواء أكنت بحاجة إلى إنشاء Magento PWA قوي من البداية ، أو استخدام سمة Magento PWA ، أو دمجها مع برنامج تابع لجهة خارجية ، فإن فريقنا جاهز لتقديم حلول مخصصة لتلبية متطلباتك الخاصة.
لا تتردد في التواصل مع فريق Tigren للحصول على مساعدة الخبراء في تعظيم إمكانات Magento PWA وضمان التكامل السلس مع Clerk.io.
المنشورات ذات الصلة:
لا يمكن معاينة حملة في تنظيم محتوى Magento PWA؟ إليك كيفية إصلاحه