Viewer: شاهد المنتج
عرض النموذج ثلاثي الأبعاد ومظهره. يفيد عندما يكون الهدف الأساسي عرض المنتج من زوايا مختلفة دون إتاحة تحرير الطباعة.
تكامل التجارة الإلكترونية - من التصميم إلى الطلب
أضف عرض المنتجات ثلاثي الأبعاد وإعداد المتغيرات وتخصيص المنتجات إلى موقعك. يشاهد العميل المنتج ويختار الخيارات ويجهّز التصميم داخل متجرك، بينما تدير أنت الكتالوج والطلبات في نظامك.
اختر إضافة WordPress مع تثبيت WooCommerce لإكمال الإعداد دون كتابة كود التكامل. وإذا كنت تطوّر موقعك أو متجرك الخاص، فاربط الأدوات المضمّنة بالخادم الخلفي وسلة التسوق عبر Public API وأحداث postMessage.
تعرض الصور الواجهة الفعلية من التسجيلات ولوحة الإضافة. أسماء الأزرار في اللقطات بالإنجليزية؛ ويعتمد مظهر الأداة على إعداد المتجر.
يمكنك إعداد تصميم المنتج نفسه للعرض أو لاختيار التكوين أو لتحرير الطباعة. اختر طريقة الربط بالمتجر وفق موقعك وحجم العمل البرمجي المطلوب.
توفّر الإضافة وظائف جاهزة لـ WordPress وWooCommerce. وتتيح API بناء اتصال مخصص بمنصة أخرى أو تطبيق headless أو نظام قائم لإدارة الطلبات.
| المجال | WordPress + WooCommerce | نظامك الخاص عبر API |
|---|---|---|
| البدء | تثبيت الإضافة ومعالج الاتصال في لوحة WordPress. | تنفيذ الاتصال في الخادم الخلفي والتضمين في الموقع. |
| المنتجات والمتغيرات | ربط التصميم بمنتج WooCommerce ومزامنة المتغيرات. | ربط معرّفات المنتجات والخيارات ببيانات متجرك. |
| السلة والطلبات | إدارة جاهزة للتكوين وتصميم العميل والمعاينات في WooCommerce. | معالجة أحداث الأداة المضمّنة ومزامنة الطلبات في نظامك. |
| الملفات والأصول | المكتبة المحلية والتصاميم وملفات الطلبات على خادم WordPress. | تخزين البيانات والوصول إليها وفق وضع التكامل المختار. ويتطلب استخدام التخزين الخاص بك تنفيذ إدارته من جانبك. |
اختر الأداة وفق ما يحتاج العميل إلى فعله في الموقع. جهّز التصميم وقواعد التخصيص مسبقًا في Designer.
عرض النموذج ثلاثي الأبعاد ومظهره. يفيد عندما يكون الهدف الأساسي عرض المنتج من زوايا مختلفة دون إتاحة تحرير الطباعة.
اختيار خيارات المنتج المعدّة مسبقًا، مثل المقاس أو اللون أو الخامة. يرى العميل التغيير على النموذج ويرسل التكوين إلى السلة.
تخصيص المنتج باستخدام الأدوات والرسومات والنصوص والقوالب التي تتيحها. يرتبط تصميم العميل المحفوظ بعنصر في السلة أو الطلب.
مساحة عمل مالك المتجر. تجهّز هنا التكوين البصري والمتغيرات ومناطق الطباعة وإعدادات أدوات العملاء. الوصول إلى التحرير الإداري منفصل عن استخدام المتجر للتسوق.
Alter Product إضافة لـ WordPress. يتطلب تكامل المتجر تثبيت WooCommerce وتفعيله. تنفّذ الإعداد المعتاد في اللوحة دون بناء إدارة خاصة لـ API وسلة التسوق.
يتطلب تضمين Alter Product في موقعك اشتراك Business نشطًا أو خطة أعلى تشمل هذه الميزة. ينطبق ذلك على إضافة WordPress + WooCommerce وعلى التكامل المخصص عبر API. لا تشمل خطتا Personal FREE وPersonal التضمين في متجرك.
عند استخدام الإضافة، جهّز WordPress مع WooCommerce مثبتًا ومفعّلًا وحساب Alter Product. تخزين الملفات على استضافتك لا يحل محل الاشتراك المطلوب: يظل Alter Product يوفّر التطبيق ويصرّح بتشغيله.
يعمل Alter Product داخل إطار iframe مضمّن في صفحة المتجر. تقيّد المتصفحات الوصول إلى بعض الميزات التي يستخدمها التطبيق إذا لم توفّر الصفحة سياقًا آمنًا. يشفّر HTTPS الاتصال، وتتيح الشهادة الصالحة للمتصفح التحقق من النطاق.
يتحقق المتصفح أيضًا من الصفحة التي تحتوي على iframe. لذلك لا يكفي أن يكون عنوان تطبيق Alter Product عبر HTTPS إذا كان المتجر يعمل عبر HTTP. يجب أن تستخدم صفحتك التي تضمّن الأداة HTTPS أيضًا. وهذا ناتج عن قواعد أمان المتصفحات للتطبيقات المضمّنة.
يرشدك الاتصال التلقائي خلال تفويض حساب Alter Product وإعداد المتجر. لا تحتاج إلى نقل مفاتيح API يدويًا عند استخدام هذه الطريقة.

في محرر منتج WooCommerce، افتح تبويب Alter Product. أنشئ تصميمًا جديدًا أو اختر تصميمًا قائمًا، ثم افتح Designer. اضبط الطباعة والخيارات المتاحة ومناطق الطباعة لهذا المنتج.

تخزّن النماذج والتصاميم والرسومات وملفات الطلبات على الاستضافة التي يعمل عليها WordPress. الأصول المضافة محليًا تخدم متجرك، ولا تصبح بذلك عناصر في مكتبة Alter Product العامة للمتاجر الأخرى.
تحفظ الإضافة ملفات النماذج والمكتبات والتصاميم والـ mockups والطلبات في مساحة WordPress. وتُحفظ بيانات مشاريع المولّد ومراجعاتها أيضًا في قاعدة بيانات هذا التثبيت.
يمكنك إضافة موادك واستيراد أصول مختارة من Alter Product. بعد التنزيل تستخدم نسخة محلية. الاستيراد والتحقق من التحديثات وتنزيل الإصدارات الجديدة عمليات منفصلة.
| المكان في اللوحة | ما الذي تفعله هناك |
|---|---|
| الأصول | تدير النماذج والرسومات والقوالب والخلفيات والشعارات والأنسجة والبيئات وغيرها. تختلف طرق الإضافة المتاحة بحسب نوع الأصل. |
| مولّد النماذج | تنشئ مشاريع محلية من القوالب وتعمل على النماذج المرتبطة بالمولّد. |
| تصاميم المنتجات / Designer | تجهّز تصميمًا أو تستورده، ثم تعدّله وتربطه بمنتج في المتجر. |
| طلبات WooCommerce | تستخدم تصاميم العملاء المحفوظة والمعاينات والملفات اللازمة لتنفيذ الطلب. |

تخزّن الأصول لديك، بينما تُحمّل واجهة الأدوات من Alter Product داخل iframe. تتحقق خدمة Alter Product من وصول الحساب والخطة والجلسات وتوفّر كتالوج الاستيراد. يتطلب التكامل الاتصال بهذه الخدمة.
احتفظ في النسخ الاحتياطية بقاعدة البيانات ومجلد الملفات ومفاتيح WordPress وقيم salt اللازمة لقراءة بيانات الإضافة المشفّرة. يتيح ذلك استعادة الرسومات الظاهرة والبيانات اللازمة لمواصلة العمل أيضًا.
يمكن أن يكون التضمين جزءًا من صفحة المنتج أو صفحة WordPress مستقلة. يبقى العميل ضمن مسار الشراء في متجرك، بينما يتولى WooCommerce السلة والطلب.
اختر طريقة العرض المناسبة لتخطيط المتجر: أداة داخل صفحة المنتج، أو زر ينقل إلى صفحة مخصصة، أو تضمين عبر الكتل والأكواد القصيرة المتاحة. تؤدي أدوات Viewer وConfigurator وCustomizer أدوارًا مختلفة، فلا يلزم إتاحتها جميعًا في الوقت نفسه.

كيّف عرض المنتج مع علامتك التجارية. تدير في الإضافة الخلفيات والشعارات المحلية وإعدادات مظهر الأدوات المضمّنة. يعتمد توفر الخيارات الفردية على الخطة.
يختار العميل المتغير ويجهّز التخصيص. تربط الإضافة التكوين والتصميم المحفوظ بعنصر السلة، ثم بطلب WooCommerce. تساعد الـ mockups المتاحة على تمييز الطباعة المطلوبة.
ربط المتجر بأدوات ثلاثية الأبعاد هو بداية العملية. يمكنك تنزيل ملفات التصميم المُعدّ لإنتاجك الخاص أو استخدام تكامل مزوّد الطباعة عند الطلب المتاح في الإضافة.
اضبط الاتصال بالمزوّد المختار في إعدادات الإضافة. ثم اربط المنتج والمتغيرات ومواضع الطباعة بكتالوج المزوّد، وجهّز الملفات وأرسل طلب WooCommerce للتنفيذ.
يمكنك إعداد اتصالك الخاص بمزوّد AI واستخدام ميزات إنشاء الصور أو تحسينها أثناء العمل على التصميم. تنتقل طلبات الإضافة من WordPress إلى المزوّد المختار وتُحتسب على حسابك لدى ذلك المزوّد.
الجلسة تصريح مؤقت لفتح أداة محددة في متجرك. تساعد على إتاحة المنتجات للعملاء بأمان وتُحتسب ضمن الحد الشهري لجلسات التضمين. وهي ليست نقرة واحدة أو زائرًا فريدًا أو طلبًا.
عند تشغيل الأداة المضمّنة، يحصل التكامل على رمز قصير الأجل، أي مفتاح جلسة. تبقى بيانات الوصول الدائمة للحساب على الخادم. لا يحتاج العميل إلى نسخ المفاتيح أو تسجيل الدخول إلى حساب Alter Product الخاص بالمالك.
مدة صلاحية الرمز الافتراضية في التنفيذ الحالي هي 15 دقيقة. قد يحدد الخادم مدة مختلفة، لذا يستخدم التكامل وقت انتهاء الجلسة المستلمة. لا تمدّد إعادة استخدام الرمز وقت انتهاء صلاحيته. ويتطلب التفويض التالي بعد انتهاء الصلاحية جلسة جديدة.
يعتمد ذلك على الأداة وعلى استمرار وجود جلسة مناسبة وصالحة. لا تستخدم الإضافة جلسة واحدة مشتركة لكل الزوار والمنتجات. تصف القواعد التالية سلوكها الحالي.
| الحالة | ماذا يحدث للجلسة؟ | الأثر في الحد |
|---|---|---|
| فتح الأداة لأول مرة دون جلسة مطابقة | يطلب التكامل رمزًا جديدًا للأداة وسياق المنتج المحددين. | إصدار رمز جديد بنجاح يستهلك جلسة واحدة. |
| تدوير النموذج أو تغيير اللون أو تحرير النص داخل الأداة المفتوحة | يستمر العمل ضمن الجلسة التي بدأت بالفعل. | لا تعني هذه الإجراءات بذاتها إصدار رموز إضافية. |
| تحديث كامل للصفحة التي تحتوي على Viewer أو Configurator | تحصل الإضافة عادةً على رمز جديد بعد إعادة تحميل الصفحة. لا تُحفظ ذاكرة جلسة هذه الأدوات بين التحديثات الكاملة. | إصدار رمز جديد بنجاح يستهلك جلسة إضافية. |
| تحديث Customizer في علامة التبويب نفسها | يمكن لـ Customizer إعادة استخدام الجلسة المحفوظة إذا طابقت المتجر والمنتج والطلب ووضع العمل ولم تكن قريبة من انتهاء الصلاحية. | إعادة الاستخدام لا تزيد العداد. إذا لم تتحقق الشروط، تلزم جلسة جديدة. |
| انتهاء الرمز أو الانتقال إلى منتج آخر أو تغيير سياق العمل | قد يلزم تفويض جديد ورمز جديد. كما يؤثر توفر تخزين المتصفح في إمكانية إعادة الاستخدام. | يزيد الرمز الصادر حديثًا مقدار استخدام الحد. |
يزداد العداد عندما تصدر API رمزًا جديدًا بنجاح. استخدام رمز صالح سبق إصداره ليس إصدارًا جديدًا. لذلك عند اختيار الخطة، راعِ تشغيل الأدوات وتحديث الصفحات وإعادة فتحها، لا عدد الطلبات أو الزوار فقط.
تتشارك الأدوات المضمّنة داخل المتجر نفسه الحد الشهري للجلسات. يُحسب العداد بصورة مستقلة لكل متجر حسب الأشهر التقويمية بتوقيت UTC. وتزيد جلسات Designer ومولّد النماذج المضمّنين الجديدة في لوحة WordPress هذا العداد أيضًا. تنزيل نموذج متاح عبر API الاستيراد وحده لا يفتح جلسة محرر.
بعد بلوغ الحد، يرفض النظام إصدار جلسات إضافية. هذا حد استخدام ضمن الاشتراك؛ راجع خطتك لمعرفة الحصة الحالية.
هل لديك متجر مخصص أو تطبيق headless أو نظام طلبات خاص؟ يمكنك بناء طبقة تكامل باستخدام Public API من Alter Product وتضمين الأدوات المطلوبة في موقعك. يتطلب هذا المسار عملًا برمجيًا.
تعتمد Public API على طلبات HTTP وبيانات JSON. لذلك يمكنك كتابة تكاملك بلغة وبيئة الخادم الخلفي لديك. لا تحتاج إلى إعادة بناء المتجر على WordPress لتضمين أدوات Alter Product.
فيما يلي أمثلة على تقنيات إنشاء الاتصال من جانب الخادم. تنفّذ في كل منها المراحل نفسها: تفويض API وإنشاء جلسة الأداة وربط المنتجات والسلة والطلبات بنظامك.
أضف التكامل إلى خادم خلفي يعمل بـ Node.js، مثل Express أو NestJS. استدعِ API من الخادم وأرسل إلى الواجهة الأمامية البيانات اللازمة لتضمين الأداة.
اربط تطبيق Python قائمًا، مثل Django أو FastAPI، بمنتجات Alter Product وجلساته وطلباته عبر طلبات HTTP.
استخدم PHP في متجر أو تطبيق مخصص، مثل Laravel أو Symfony. يمكنك إعداد تكامل API خاص مستقل عن إضافة WordPress الجاهزة.
اربط الأدوات بخادم خلفي بلغة Java، مثل Spring، واربط بيانات التصاميم بكتالوج منتجاتك وإدارة الطلبات لديك.
استخدم خادمًا خلفيًا بـ .NET، مثل ASP.NET Core، للتفويض وإنشاء الجلسات وتمرير البيانات إلى عمليات متجرك القائمة.
جهّز الاتصال في خدمة مكتوبة بلغة Go. يتيح عميل HTTP القياسي معالجة طلبات API واستجابات JSON.
أضف التكامل إلى تطبيق Ruby، مثل Ruby on Rails، واستخدم نموذجك الخاص للمنتجات والسلة وتنفيذ الطلبات.
اربط خادم Rust الخلفي بعميل HTTP ومعالجة JSON. يمكنك إدخال الجلسات وأحداث التسوق ضمن بنية خدماتك.
في المتصفح، يمكنك استخدام React أو Vue أو Angular أو HTML وJavaScript العاديين. يناسب TypeScript تنفيذ الاتصال أيضًا. تضمّن الصفحة iframe وتعالج أحداث postMessage وتتصل بخادمك الخلفي.
تتولى الواجهة الأمامية مظهر الصفحة وتفاعلات السلة، بينما يتولى الخادم الخلفي استدعاءات Public API الموثّقة. في أطر العمل التي تجمع الطبقتين، مثل Next.js، ضع إدارة المفاتيح الدائمة وإنشاء الجلسات في الجزء الخاص بالخادم فقط.
يمكنك الاحتفاظ بعملية الدفع ونظام المدفوعات وCMS ومسار تنفيذ الطلبات لديك. أثناء التنفيذ، تربط هذه العناصر ببيانات التصميم وأحداث أداة Alter Product المختارة.
يوفّر Alter Product الأدوات ثلاثية الأبعاد وبيانات التصاميم وآليات الجلسات. يربط خادمك الخلفي هذه العناصر بالمنتجات وحسابات العملاء والسلة وإدارة الطلبات. ويمكنك إنشاء نقاط نهاية وسيطة لواجهتك الأمامية دون كشف بيانات وصول Alter Product في المتصفح.
| الطبقة | المهمة |
|---|---|
| الواجهة الأمامية لموقعك | تعرض iframe وتستجيب لرسائل الأداة وتحدّث واجهة المتجر. |
| خادمك الخلفي | يوثّق طلبات Public API وينشئ الجلسات ويتحكم في وصول العميل ويحفظ الارتباطات بالسلة أو الطلبات لديك. |
| Public API من Alter Product | توفّر وظائف الاتصال والمنتجات وروابط الأدوات والطلبات والوصول إلى الملفات والأصول. |
| الأداة المضمّنة | تعرض النموذج وتتيح اختيار التكوين أو التخصيص وفق الوضع المختار والتصميم المُعدّ. |

ابدأ بالاتصال وجلسة تضمين لمنتج واحد. ثم أضف معالجة التكوين وحفظ التصميم والطلبات بحسب الأداة المختارة.
تجد المعلمات والأمثلة في تعليمات التضمين. تشرح فصول postMessage الاتصال بالصفحة، وتصف وثائق API العمليات التي ينفّذها الخادم الخلفي.
اختبر المنتج كما يستخدمه العميل: من فتح الصفحة إلى ظهور التصميم ضمن الطلب. اختبره على الكمبيوتر والهاتف، وكذلك دون تسجيل الدخول إلى لوحة الإدارة.
بعد إعداد منتج واحد، مرّ بجميع الخطوات. ثم طبّق طريقة الإعداد التي تحققت منها على بقية منتجات الكتالوج.