Do you build things with AMP? Fill out the AMP Developer Survey!
AMP

تضمين المحتوى من جهات خارجية

Important: this documentation is not applicable to your currently selected format email!

تعرَّف على كيفية تضمين مكوّنات من جهات خارجية في صفحاتك.

تضمين تغريدة

يمكنك تضمين إحدى تغريدات Twitter في صفحتك باستخدام العنصر amp-twitter.

لتضمين تغريدة في صفحتك، عليك أولاً بتضمين النص البرمجي التالي في <head>:

<script async custom-element="amp-twitter" src="https://cdn.ampproject.org/v0/amp-twitter-0.1.js"></script>

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

<amp-twitter width="500"
  height="583"
  layout="responsive"
  data-tweetid="638793490521001985">
</amp-twitter>
فتح هذه القصاصة في الساحة

تضمين Instagram

يمكنك تضمين Instagram في صفحتك باستخدام العنصر amp-instagram.

لتضمين Instagram، عليك أولاً بتضمين النص البرمجي التالي في <head>:

<script async custom-element="amp-instagram" src="https://cdn.ampproject.org/v0/amp-instagram-0.1.js"></script>

يمكنك تضمين الرمز القصير لبيانات Instagram والمتوفّر في عنوان URL لصورة Instagram. على سبيل المثال، في https://instagram.com/p/fBwFP، يكون fBwFP هو الرمز القصير للبيانات. كما يستخدم Instagram أيضًا نسبة ثابتة للعرض إلى الارتفاع للتنسيقات سريعة الاستجابة، وهكذا يجب أن تكون قيمة العرض والارتفاع عامة.

<amp-instagram data-shortcode="fBwFP"
  width="320"
  height="392"
  layout="responsive">
</amp-instagram>
فتح هذه القصاصة في الساحة

عرض مشاركة أو فيديو Facebook

يمكنك عرض مشاركة أو فيديو Facebook في صفحتك باستخدام العنصر amp-facebook.

يجب تضمين النص البرمجي التالي في <head>:

<script async custom-element="amp-facebook" src="https://cdn.ampproject.org/v0/amp-facebook-0.1.js"></script>
مثال - تضمين مشاركة

مصدر الرمز:

<amp-facebook width="486" height="657"
    layout="responsive"
    data-href="https://www.facebook.com/zuck/posts/10102593740125791">
</amp-facebook>

معاينة:

مثال - تضمين فيديو

مصدر الرمز:

<amp-facebook width="476" height="316"
    layout="responsive"
    data-embed-as="video"
    data-href="https://www.facebook.com/nasaearth/videos/10155187938052139">
</amp-facebook>

معاينة:

تضمين فيديو youtube

يمكنك تضمين فيديو youtube في صفحتك باستخدام العنصر amp-youtube.

يجب تضمين النص البرمجي التالي في <head>:

<script async custom-element="amp-youtube" src="https://cdn.ampproject.org/v0/amp-youtube-0.1.js"></script>

يمكن العثور على مُعرّف data-videoid لموقع Youtube في كل عنوان URL لصفحة فيديو على Youtube. فمثلاً، في https://www.youtube.com/watch?v=Z1q71gFeRqM، يكون Z1q71gFeRqM هو معرّف الفيديو.

استخدم layout="responsive" لعرض التنسيقات الصحيحة لمقاطع الفيديو بنسبة عرض إلى ارتفاع تبلغ 16:9:

<amp-youtube data-videoid="lBTCB7yLs8Y"
  layout="responsive"
  width="560"
  height="315">
</amp-youtube>
فتح هذه القصاصة في الساحة

عرض أحد الإعلانات

يمكنك عرض إعلان في صفحتك باستخدام العنصر amp-ad. والإعلانات المعروضة من خلال HTTPS هي وحدها المعتمدة.

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

يجب تحديد عرض وارتفاع الإعلان، ونوع الشبكة الإعلانية. ويُحدد type نموذج الشبكة الإعلانية. وتتطلب أنواع الإعلانات المختلفة سمات data-* مختلفة.

<amp-ad width="300"
  height="250"
  type="a9"
  data-amzn_assoc_ad_mode="auto"
  data-divid="amzn-assoc-ad-fe746097-f142-4f8d-8dfb-45ec747632e5"
  data-recomtype="async"
  data-adinstanceid="fe746097-f142-4f8d-8dfb-45ec747632e5">
</amp-ad>
فتح هذه القصاصة في الساحة

إذا كان ذلك متاحًا من الشبكة، يمكنك تضمين placeholder لعرضه إذا لم يكن الإعلان متاحًا:

Have a great day!
<amp-ad width="300"
  height="250"
  type="a9"
  data-amzn_assoc_ad_mode="auto"
  data-divid="amzn-assoc-ad-fe746097-f142-4f8d-8dfb-45ec747632e5"
  data-recomtype="async"
  data-adinstanceid="fe746097-f142-4f8d-8dfb-45ec747632e5">
  <div placeholder>Have a great day!</div>
</amp-ad>
فتح هذه القصاصة في الساحة

يتوافق AMP مع مجموعة كبيرة من الشبكات الإعلانية. راجع إشارة إلى قائمة كاملة.