إذا كنت تستخدم أحد قوالب AMP لمدونات بلوجر، وقمت بتغيير جميع أكواد المقالات اللازمة بما في ذلك رمز <img> إلى <amp-img>، ثم لاحظت أن الصور المصغرة لا تظهر على الصفحة الرئيسية، فقد تتساءل عن السبب ولماذا؟ في هذه المقالة أخي العزيز سنوضح لك السبب وكيف يمكنك معالجته.
إذا استخدمت الرمز القديم <img alt="عنوان الصورة" src="رابط الصورة"/> فقط فسيؤدي ذلك إلى حدوث خطأ في التحقق من صحة HTML لصفحات الجوال المسرعة والذي يرمز له ب AMP HTML، لذا يجب عليك كتابته بالشكل الصحيح كما يظهر أدناه.
...<amp-img alt="عنوان الصورة" data-original-height="400" data-original-width="800" height="320" layout="responsive" src="رابط الصورة" width="640"></amp-img>
اعتمادا على AMP HTML فقد تم تغيير علامة img إلى amp-img، لكن لن يتم قراءة الصور المصغرة اعتمادا على هذا التغيير فقط، لكن مع دمج الرمز القديم img والرمز الجديد amp-img يمكن حل مشكلة إظهار الصور المصغرة في قوالب بلوجر AMP.
أكيد أن الصورة ستظهر بشكل جيد داخل المقالة اذا استخدمت amp-img لوحدها. لكنها لن تظهر الصورة المصغرة على صفحة مدونتك الرئيسية، وللتغلب على هذا المشكل يجب عليك إضاف علامة noscript إلى الرمز القديم img ومن تم اتباعه بالرمز أعلاه amp-img فيصبح على الشكل التالي:
...<noscript><img alt="عنوان الصورة" src="رابط الصورة"/></noscript><amp-img alt="عنوان الصورة" data-original-height="400" data-original-width="800" height="320" layout="responsive" src="رابط الصورة" width="640"></amp-img>
يمكنك نسخ هذا الرمز وإضافته داخل مقالاتك، مع الأخذ بالاعتبار اجراء بعض التغييرات على هذا الرمز:
- قم بتغيير عنوان الصورة إلى عنوان صورة المقالة التي أنت بصدد كتابتها.
- تغيير رابط الصورة برابط الصورة المراد ارفاقها بالمقالة.
- تغيير data-original-width بالعرض الفعلي لصورتك.
- تغيير data-original-height بالارتفاع الحقيقي للصورة الأصلية.
أرجوا أن تكون هذه المقالة قد ساعدتك في حل مشكلة إظهار الصور المصغرة على الصفحة الرئسية لمدونتك، ونسأل الله التوفيق والسداد.
أنا محمد، مالك مدونة صور نت للمعلوميات والرقمنة، أمتلك خبرة واسعة في تحسين محركات البحث (السيو)، ومهتم بشكل خاص بمجالات التسويق الرقمي والتكنولوجيا المالية الرقمية.