تضمين مساحة في موقع ويب آخر

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

الرابط المباشر

يُمنح كل Space عنوان URL فريد يمكنك استخدامه لمشاركة Space الخاص بك أو تضمينه في موقع ويب.

يكون شكل هذا الرابط: "https://<space-subdomain>.hf.space". على سبيل المثال، يحمل الـ Space NimaBoscarino/hotdog-gradio الرابط المقابل "https://nimaboscarino-hotdog-gradio.hf.space". النطاق الفرعي فريد ولا يتغير إلا إذا قمت بنقل الـ Space الخاص بك أو تغيير اسمه.

يتم تقديم مساحتك دائمًا من جذر هذا النطاق الفرعي.

يمكنك العثور على رابط المساحة (Space) إلى جانب مقتطفات أمثلة على كيفية تضمينه مباشرةً من قائمة الخيارات:

الدمج باستخدام إطارات IFrames

طريقة التضمين الافتراضية لمساحة هي استخدام إطارات IFrames. أضف العنصر التالي في موضع HTML الذي تريد تضمين مساحتك فيه:

<iframe
    src="https://<space-subdomain>.hf.space"
    frameborder="0"
    width="850"
    height="450"
></iframe>

على سبيل المثال، باستخدام مساحة NimaBoscarino/hotdog-gradio :

الدمج باستخدام WebComponents

إذا كان المساحة التي ترغب في تضمينها مبنية على Gradio، يمكنك استخدام Web Components لتضمين مساحتك. تُعد Web Components أسرع من IFrames وتتكيف تلقائيًا مع صفحة الويب الخاصة بك بحيث لا تحتاج إلى ضبط width أو height لعنصرك. أولاً، عليك استيراد مكتبة Gradio JS التي تتوافق مع إصدار Gradio في المساحة عن طريق إضافة السكربت التالي إلى HTML الخاص بك.

ثم، أضف عنصر gradio-app في المكان الذي تريد فيه تضمين مساحتك.

<gradio-app src="https://<space-subdomain>.hf.space"></gradio-app>

اطّلع على توثيق Gradio لمزيد من التفاصيل.