كيفية إنشاء مقالات أو مشاركات AMP HTML صالحة

Accelerated Mobile Pages أو اختصارها كـ AMP هي خدمة مجانية تعمل على تحميل الصفحات على الأجهزة المحمولة بشكل أسرع وأخف وزناً.

للوهلة الأولى ، لا يوجد فرق بين كيفية كتابة مقالات لـ AMP و Non-AMP ، فالأمر الأكثر جاذبية هو استدعاء الصور التي لا تستخدم العلامة <img /> ولكن بدلاً من ذلك استخدام العلامة <amp-img /> ، لذلك إذا قمت بالترحيل باستخدام قالب AMP ثم عليك تغيير جميع الصور في مشاركتك.

ضع الصورة الرئيسية (الصورة المصغرة) من المشاركة

كما نعلم جميعًا ، لا يمكن لـ Blogger قراءة الصور باستخدام <amp-img /> ، لذلك لن تظهر الصور المصغرة للنشر على الصفحة الرئيسية ، أو عند مشاركة المقالات على وسائل التواصل الاجتماعي ، لن تظهر الصور المصغرة للمقال.

للتغلب على ذلك ، استخدم الرمز أدناه في بداية مشاركتك.

<noscript><img alt='judul-alt-gambar' src='url-gambar.jpg' title='judul-gambar'/></noscript>

استبدل الجزء في كتلة اللون بعنوان URL للصورة التي تريد استخدامها كصورة مشاركة رئيسية.

أضف صورًا إلى محتويات المقالة

كما هو موضح أعلاه ، تختلف الصورة على AMP عن الصورة على Non-AMP ، ونموذج التعليمات البرمجية لتثبيت الصورة على النحو التالي:

<amp-img alt='judul-alt-gambar' height='300' layout='responsive' src='url-gambar.jpg' width='430'/>

قم بتغيير حجم الصورة وتخطيطها حسب رغبتك.

تضمين مقاطع فيديو Youtube على المشاركات (اختياري)

استخدم الكود أدناه لعرض مقاطع الفيديو من Youtube في مشاركتك.

1. استخرج رمز الفيديو من عنوان URL لفيديو Youtube الذي تريد استخدامه.
2. ضعه على رمز amp-youtube.
3. احفظ الرمز في منشورك.

كود amp-youtube

<amp-youtube data-videoid='xxxxxxxxxxx' height='270' layout='responsive' width='480'/>

قم بتغيير كتلة اللون باستخدام رمز فيديو Youtube الذي تختاره.