Viewer – التنسيق (معلمات URL)

التنسيق باستخدام معلمات URL

تتيح لك معلمات URL تخصيص مظهر Viewer وسلوكه دون تعديل الكود. يمكن ضبط المعلمات مباشرة في التطبيق (مثلًا في علامة تبويب «المشاركة» أو داخل Viewer)، وتسمح بالتحكم في وضع الخلفية وتأثيرات صور الخلفية وإضاءة البيئة ثلاثية الأبعاد وظهور الواجهة وزر الإضافة إلى السلة. الاختيار المسبق للمتغيرات (سمات WooCommerce): يمكنك أيضًا اختيار متغير منتج معين مسبقًا باستخدام معلمات استعلام مثل attribute_pa_color أو pa_size أو size. تُفسّر هذه المعلمات وفق ربط السمات وقيمها في متجرك، وتتيح فتح Viewer مضبوطًا على لون أو مقاس أو خامة أو طريقة طباعة أو لون مخصص محدد.

قائمة معلمات URL المتاحة

المعلمةالنوعالوصفالقيمة الافتراضية
nav0 / 1إخفاء (0) أو إظهار (1) التنقل. متاح فقط في Business.1
add_to_cart0 / 1إخفاء (0) أو إظهار (1) زر «إضافة إلى السلة».0
bcgstringوضع خلفية المشهد: grad_f6f7fb_e8fff6 أو app_img_123 أو uploaded أو theme أو env.القيمة الافتراضية للمتجر
envintمعرّف بيئة HDRI المستخدمة لإضاءة المشهد. عند تعيين bcg=env، تُستخدم البيئة أيضًا خلفية مرئية للمشهد.1
light_intensity0 - 2شدة إضاءة المشهد ثلاثي الأبعاد.0.6
bcg_blur0 - 100التمويه المطبق على صور الخلفية المحددة باستخدام bcg=app_img_* أو bcg=uploaded أو bcg=theme.0
bcg_brightness0 - 3مستوى السطوع/الانبعاث لصور الخلفية.1
bcg_underlaystringالطبقة الموجودة خلف صور الخلفية. استخدم grad_ffffff_f5f7fb لتدرج لوني أو none لإزالتها.القيمة الافتراضية للخلفية
attribute_pa_*stringتحديد قيمة سمة منتج WooCommerce مسبقًا. تشمل صيغ المفاتيح المقبولة attribute_pa_color وpa_color وcolor؛ وتشمل الأسماء البديلة المدعومة المقاس واللون والخامة ونوع الطباعة والنمط.
custom_color0 / 1 / trueطلب متغير اللون المخصص إذا كان المنتج يدعمه. يمكن تحقيق ذلك أيضًا باستخدام color=custom.0
picked_colorsstringتجاوزات الألوان المخصصة، مفصولة بفواصل، بالصيغة detailKey:%23hex، مثل front:%23ff6b6b,back:%2300ff88. يجب ترميز الحرف # في URL بالصيغة %23.

مثال

عنوان URL: https://alterproduct.com/app/viewer/1?bcg=grad_f6f7fb_e8fff6&env=8&light_intensity=1.2&bcg_underlay=none&add_to_cart=1&nav=0&attribute_pa_color=white&attribute_pa_size=m

<iframe
  loading="lazy"
  title="Product Viewer"
  src="https://alterproduct.com/app/viewer/1?bcg=grad_f6f7fb_e8fff6&env=8&light_intensity=1.2&bcg_underlay=none&add_to_cart=1&nav=0&attribute_pa_color=white&attribute_pa_size=m"
  width="100%"
  height="100%"
  frameBorder="0"
  allowFullScreen
></iframe>