تخصيص موضع الواجهة باستخدام JavaScript

يمكنك تخصيص الموضع الدقيق لواجهة الدردشة الخاصة بك باستخدام خاصية customStyle في واجهة برمجة التطبيقات (API) الخاصة بـ tawk.to، مما يمنحك تحكمًا دقيقًا على مستوى البكسل يتجاوز أوضاع الشاشة الستة الافتراضية.

يكون هذا مفيدًا في الحالات التالية:

• عندما ترغب في منع الواجهة من التداخل مع القائمة أو التذييل.

• عندما تقوم بإدراج الواجهة داخل تصميم أو تخطيط مخصص.

• عندما ترغب في تعيين مواضع مختلفة لعرض الأجهزة المحمولة وأجهزة سطح المكتب

يمكنك ضبط الواجهة لتظهر في أي من هذه المواضع القياسية الستة:

يمكن تعديل كل موضع بشكل أدق باستخدام الإزاحات (offsets) والتدوير (rotation).

تساعد الإزاحات في تحريك الواجهة قليلاً بعيدًا عن موضعها الأساسي:

• xOffset: ينقل الواجهة إلى اليسار أو اليمين.

• yOffset: ينقل الواجهة إلى الأعلى أو الأسفل.

كيفية عمل الإزاحات:

• في الزاوية السفلية اليمنى (br)، يؤدي زيادة قيمة xOffset إلى تحريك الواجهة نحو اليسار.

• في الزاوية السفلية اليسرى (bl)، تؤدي زيادة قيمة xOffset إلى تحريك الواجهة نحو اليمين.

• في الزاوية العلوية اليمنى (tr)، تؤدي زيادة قيمة yOffset إلى تحريك الواجهة إلى الأسفل.

• في المواضع الوسطى (cl وcr)، يؤدي ضبط قيمة yOffset إلى تحريك الواجهة للأعلى أو للأسفل.

يُعد التدوير مفيدًا للتصاميم العمودية أو الإبداعات المرئية.

فيما يلي نموذج تعليمي يوضح القيم المقبولة للموضع والإزاحة والتدوير:

• يجب دائمًا تعريف customStyle قبل كود تضمين الواجهة، وإلا فلن يتم تطبيق التغييرات التي أجريتها.

• قم بتخصيص تخطيط الواجهة بشكل منفصل لأجهزة سطح المكتب والهواتف المحمولة لضمان عدم تعارضها مع تصميم موقعك. اختبر الواجهة على أحجام شاشات مختلفة للتأكد من أن كل شيء يبدو كما هو متوقع.

• لا تحتاج إلى تعديل إعدادات لوحة التحكم (Dashboard)، لأن الإعدادات التي تُعرّف على مستوى الكود تتجاوزها تلقائيًا.

اطّلع على أدلة JavaScript API الأخرى لمعرفة المزيد من الطرق لتعديل سلوك الواجهة ومظهرها.

إذا كان لديك ملاحظات حول هذه المقالة، أو إذا كنت بحاجة إلى مزيد من المساعدة:

• اضغط على أيقونة الدردشة المباشرة الخضراء
• حدد موعدًا للاتصال بنا
• زر مجتمعنا