تضمين كود مخصص - مساعدة Webflow

Last updated on 10/23/2025@mrbirddev
تضمين كود مخصص - مساعدة Webflow

أضف كتل كود مخصصة لموقعك باستخدام عنصر تضمين الكود لفتح جميع أنواع الوظائف المخصصة.

يدعم عنصر تضمين الكود فقط HTML، وCSS في علامات <style>، وJS في علامات <script>. لا يمكنك دمج لغات الخادم (مثل Perl، PHP، Python، Ruby) في عنصر تضمين الكود.
الكود المخصص هو تعديل متقدم قد يتعارض مع الوظائف الأساسية لـ Webflow. لذلك، لا يمكن لـ Webflow ضمان الوظائف أو التوافق الكامل لأي كود مخصص. بالإضافة إلى ذلك، لا يمكن لفريق الدعم لدينا تقديم مساعدة مباشرة في إعداد الكود المخصص أو استكشاف الأخطاء وإصلاحها، حيث أن هذه المواضيع تقع خارج نطاق سياسة دعم العملاء لدينا. إذا واجهت مشاكل مع الكود المخصص، يرجى إعلامنا في منتدى Webflow، حيث يمكن للمجتمع بأكمله (بما في ذلك الموظفين) تقديم مساعدة وموارد إضافية.

كيفية إضافة عنصر تضمين الكود

يمكنك تضمين كود من طرف ثالث أو كود مخصص خاص بك في أي مكان في تصميمك أو في عنصر نص غني.

لا يمكن أن يتجاوز الكود المخصص في عنصر تضمين الكود 50,000 حرف. إذا كان الكود الذي تريد تضمينه أطول، يمكنك تخزينه على خادم آخر والإشارة إلى السكربت في التضمين. يمكنك أيضًا تصغير الكود المخصص باستخدام أداة طرف ثالث أو تقسيم الكود إلى عناصر تضمين متعددة (بشرط ألا يكسر ذلك أي وظائف JavaScript).

كيفية إضافة كود مخصص مباشرة إلى تصميمك

  • انسخ الكود الذي ترغب في تضمينه إلى الحافظة الخاصة بك
  • افتح لوحة الإضافة وأضف عنصر تضمين الكود إلى لوحة Webflow
  • الصق الكود المخصص الذي نسخته في الخطوة 1
  • احفظ وأغلق النافذة المنبثقة
إذا كان لديك في الكود المخصص علامات فتح و/أو إغلاق، تأكد من إضافتها لضمان عمل الكود كما هو متوقع. بالإضافة إلى ذلك، لا تتضمن علامات <html>، <body>، أو <head> في الكود المخصص، وإلا سيتعطل موقعك/التخطيط.
يتم تمكين التفاف الأسطر افتراضيًا لسهولة عرض وتحرير الكود، ولكن يمكنك إيقاف هذا الإعداد بإلغاء تحديد مربع التفاف الأسطر في محرر الكود. يمكنك أيضًا تمكين التحرير بملء الشاشة بالنقر على أيقونة “تكبير”.
نصيحة احترافية: إذا كنت ترغب في إعادة استخدام نفس المحتوى المضمن في جميع أنحاء موقعك، يمكنك استخدام المكونات لتحويل عنصر تضمين الكود إلى مكون قابل لإعادة الاستخدام.

كيفية إضافة كود مخصص إلى عنصر نص غني

  • انسخ الكود الذي ترغب في تضمينه إلى الحافظة الخاصة بك
  • ضع المؤشر في عنصر النص الغني حيث ترغب في إضافة الكود المخصص
  • انقر على أيقونة “زائد” لفتح قائمة الإدراج وانقر على زر الكود المخصص
  • الصق الكود المخصص الذي نسخته في الخطوة 1

كيفية استخدام المحتوى الديناميكي داخل الكود المخصص

يمكنك دمج حقول المجموعة في الكود المضمن لسحب المعلومات ديناميكيًا لأغراض مختلفة. تعرف على المزيد: راجع التضمينات الديناميكية في مركز مساعدة Webflow.

كيفية تحرير عنصر تضمين الكود

هناك عدة طرق لفتح محرر الكود وتحرير الكود في عنصر تضمين الكود. يمكنك:

  • تحديد عنصر تضمين الكود على اللوحة والنقر المزدوج
  • تحديد عنصر تضمين الكود على اللوحة والضغط على إدخال
  • تحديد عنصر تضمين الكود على اللوحة والنقر على أيقونة الإعدادات “ترس
  • تحديد عنصر تضمين الكود على اللوحة والنقر على فتح محرر الكود في لوحة الإعدادات تحت إعدادات تضمين الكود
من الجيد أن تعرف: إذا لم تتمكن من رؤية عنصر تضمين الكود على اللوحة، يمكنك العثور عليه وتحديده من لوحة الملاحة. ثم افتح لوحة الإعدادات وانقر على فتح محرر الكود تحت إعدادات تضمين الكود لتحرير الكود الخاص بك.

كيفية تعيين الأبعاد على عنصر تضمين الكود

إذا لم يقم الكود المخصص داخل عنصر تضمين الكود بتعيين الحجم أو الأبعاد بشكل صريح، يمكن أن يشغل المحتوى غالبًا العرض الكامل لعنصره الأب. قد تتمكن من إضافة height="100%" width="100%" في الكود المخصص الخاص بك، مما سيسمح لك بتعديل عرض وارتفاع عنصر التضمين والمحتوى من لوحة التنسيق.

كيفية معاينة المحتوى المضمن

سيظهر الكود المخصص المغلف في علامات <iframe></iframe> أو <style> معاينة على اللوحة أو داخل عنصر النص الغني الخاص بك، ولكن بعض تضمينات الكود يمكن عرضها فقط على الموقع المباشر. في أي وقت يتم استخدام علامة في محرر الكود، سترى عنصرًا نائبًا لهذا العنصر في المصمم.

بمجرد المعاينة أو النشر أو تصدير موقعك، سيتم عرض السكريبت والكود المخصص في المكان الذي وضعته فيه.

تظهر تأثيرات الكود المخصص في وضع المعاينة، لكنها لن تصبح مباشرة حتى يتم نشر موقعك.
لاستبعاد السكريبتات المخصصة من وضع المعاينة ووضع التعليق، قم بتغليف الكود الخاص بك في التعليق التالي لـ HTML:
سيتم استبعاد كل الكود هنا

تعرف على المزيد: انظر استخدام .webflow.io كنطاق مرحلي للاختبار والتغذية الراجعة.

الأسئلة الشائعة ونصائح استكشاف الأخطاء وإصلاحها

هل يمكنني استخدام لغات الخادم في عنصر تضمين الكود؟ لا يمكنك دمج لغات الخادم (مثل Perl، PHP، Python، Ruby) في عنصر تضمين الكود. يدعم عنصر تضمين الكود فقط HTML، CSS في علامات <style>، وJS في علامات <script>.

هل يمكنني زيادة الحد الأقصى لعدد الأحرف البالغ 50,000 لعنصر تضمين الكود؟
لا يمكن أن يتجاوز الكود المخصص في عنصر تضمين الكود 50,000 حرف. إذا كان الكود الذي تريد تضمينه أطول، يمكنك تخزينه على خادم آخر والإشارة إلى السكربت في التضمين الخاص بك. يمكنك أيضًا تقليل حجم الكود المخصص باستخدام أداة خارجية أو تقسيم الكود إلى عناصر تضمين الكود متعددة (بشرط ألا يؤدي ذلك إلى كسر أي وظائف JavaScript).

المساعدة! الكود المخصص الخاص بي لا يعمل!
تحقق جيدًا من أن الكود الخاص بك يتضمن العلامات الافتتاحية و/أو الختامية المناسبة ولا يتضمن علامات <html>، <body>، أو <head>.

اعتبارًا من أغسطس 2020، تتضمن المواقع المنشورة حديثًا على Webflow jQuery v3.5.1. قد يتسبب استيراد إصدارات أخرى من jQuery مع الكود المخصص في حدوث تعارضات وسلوك غير متوقع على موقعك. قد تتسبب السكربتات التي تؤثر على أحداث DOM مثل onClick، onHover، إلخ، أيضًا في سلوك غير متوقع.

من المهم أن تضع في اعتبارك أن الكود المخصص هو تعديل متقدم قد يتعارض مع الوظائف الأساسية لـ Webflow. وبالتالي، لا يمكن لـ Webflow ضمان الوظائف أو التوافق الكامل لأي كود مخصص.

فريق الدعم لدينا غير قادر على تقديم مساعدة مباشرة في إعداد الكود المخصص أو استكشاف الأخطاء وإصلاحها، حيث أن هذه المواضيع تقع خارج نطاق سياسة دعم العملاء لدينا. إذا واجهت مشاكل مع الكود المخصص، يرجى إخبارنا في منتدى Webflow، حيث يمكن للمجتمع بأكمله (بما في ذلك الموظفين) تقديم مساعدة وموارد إضافية.

العودة إلى مساعدة Webflow

Last updated on 10/23/2025@mrbirddev
Recent Articles
Loading...