Customizer - التنسيق (معلمات URL)

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

تتيح معلمات URL فتح Customizer بإعدادات مرئية وخيارات منتج محددة مسبقًا دون تغيير كود التضمين. يقرأ Customizer هذه المعلمات عند التحميل ويطبقها على خلفية مساحة العمل والبيئة ثلاثية الأبعاد وشدة الإضاءة واختيار المتغيرات. تُفسّر المتغيرات المحددة عبر URL باستخدام ربط سمات WooCommerce وقيمها. الألوان المخصصة: للمنتجات التي تدعم متغيرات الألوان المخصصة، يمكنك طلب اللون المخصص وتمرير قيم الألوان المختارة مباشرة في URL. رمّز # بالصيغة %23 ضمن قيم الاستعلام.

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

المعلمةالنوعالوصفالقيمة الافتراضية
bcgstringوضع خلفية Customizer: grad_f6f7fb_e8fff6 أو app_img_123 أو env. يستخدم وضع env معاينة البيئة المحددة خلفيةً لمساحة العمل.القيمة الافتراضية للتصميم/القالب
envintمعرّف بيئة التشغيل. يحدد بيئة HDRI للوحة الرسم ثلاثية الأبعاد، ويحدد أيضًا خلفية معاينة البيئة عند استخدام bcg=env.القيمة الافتراضية للتصميم
light_intensity0 - 2شدة إضاءة البيئة للوحة الرسم ثلاثية الأبعاد. تُضبط القيم الخارجة عن النطاق إلى أقرب حد مسموح.القيمة الافتراضية للتصميم
bcg_blur0 - 100التمويه المطبق على صور خلفية Customizer، بما فيها app_img_* وخلفيات المعاينة bcg=env.0
bcg_brightness0 - 3سطوع صور خلفية Customizer.1
bcg_underlaystringطبقة تدرج لوني خلف صور الخلفية، مثل grad_ffffff_f5f7fb.القيمة الافتراضية للتصميم/القالب
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/customizer/1?bcg=grad_f6f7fb_e8fff6&env=8&light_intensity=1.2&bcg_blur=0&bcg_brightness=1&bcg_underlay=grad_ffffff_f5f7fb&custom_color=1&picked_colors=front:%23ff6b6b

<iframe
  loading="lazy"
  title="Product Customizer"
  src="https://alterproduct.com/app/customizer/1?bcg=grad_f6f7fb_e8fff6&env=8&light_intensity=1.2&bcg_blur=0&bcg_brightness=1&bcg_underlay=grad_ffffff_f5f7fb&custom_color=1&picked_colors=front:%23ff6b6b"
  width="100%"
  height="100%"
  frameBorder="0"
  allowFullScreen
></iframe>