شرح طرقة إعداد جوجل AMP على موقع مدونة بلوجر 2021
هل تريد إضافة / إعداد Google AMP في موقع Blogger / Blogspot؟ يعد Blogger أو AMP for blogger الخاص بصفحات الجوال المسرَّعة طريقة لجعل موقع Blogger الخاص بك يتم تحميله بشكل أسرع على الأجهزة المحمولة. تقدم مواقع التحميل السريع تجربة مستخدم أفضل ويمكن أن تحسن حركة المرور الخاصة بك. في هذه المقالة ، سنوضح لك كيفية إعداد Google AMP في موقع Blogger.
يجب أن تقرأ - كيفية إضافة إعلانات Google Adsense في WordPress.
AMP سيعزز سرعة موقعك.
صحة Google AMP في Blogger
دليل متدرج لإضافة / إعداد Google AMP في موقع Blogger
تسجيل الدخول إلى مدونة Blogger الخاصة بك.
انتقل إلى التصميم وانقر فوق تحرير القالب.
عدّل العلامات الحالية لمزامنتها مع العلامات بتنسيق AMP. استبدل الكود الحالي بالرمز المعدل.
احفظ القالب.
تم تكوين AMP الخاص بك في Blogger الآن. يمكنك التحقق من صحة موقع الويب الخاص بك.
رمز معدل لإضافة / إعداد AMP في Blogger / Blogspot
استبدل نموذج الرموز أدناه وستكون جاهزًا باستخدام AMP في Blogger. هذا مجاني تمامًا. ملاحظة لعمل نسخة احتياطية من مدونتك قبل المتابعة.
الخطوة 1: إنشاء AMP HTML
قم بعمل نسخة احتياطية من قالب Blogger الخاص بك لتكون في مأمن من أي نوع من المشاكل. انتقل الآن إلى لوحة تحكم Blogger -> نموذج -> تحرير القالب.
استبدل كود <html> بالكود التالي:
<html amp = 'amp'>
الخطوة 2: إضافة مجموعة أحرف وعلامات تعريف لإطار العرض:
ابحث وتحقق من مجموعة الأحرف وعلامات إطار العرض الوصفية. إذا لم يكن موجودًا ، فانسخ الكود التالي والصقه بعد علامة <head>:
<meta charset = ”utf-8 ″>
<meta name =” viewport ”content =” width = device-width، min-scale = 1، initial-scale = 1 ″>
الخطوة 3: إضافة العلامات الأساسية:
اجعل مدونتك قابلة للاكتشاف باستخدام العلامة الأساسية. تحقق من وجود علامات الارتباط الأساسي. إذا لم يكن موجودًا ، أضف الرابط الأساسي مثل <link rel = ”canonical” href = ”http://example.blogspot.in/article-metadata.html” /> والذي سيشير إلى نفسه ببساطة.
انسخ الكود التالي والصقه بعد علامة منفذ العرض:
<link expr: href = 'data: blog.url' rel = 'canonical' />
الخطوة الرابعة: إعداد AMP CDN:
الصق هذه الشفرة أعلى العلامة </head> مباشرةً:
<style amp-boilerplate = 'amp-boilerplate'> body {-webkit-animation: -amp-start 8s steps (1 ، end) 0s 1 normal both؛ -moz-animation: -amp-start 8s steps (1، end ) 0 ثانية 1 عادي على حد سواء ؛ -ms-animation: -amp-start 8s (1 ، النهاية) 0s 1 عادي كليهما ؛ الرسوم المتحركة: -amp-start 8s (1 ، end) 0s 1 normal both} @ - webkit-keyframes -amp-start {من {visibility: hidden} إلى {visibility: visual}} @ - moz-keyframes -amp-start {من {visibility: hidden} إلى {visibility: visual}} @ - ms-keyframes -amp-start {from {visibility: hidden} إلى {visibility: visual}} @ - o-keyframes -amp-start {من {visibility: hidden} إلى {visibility: visual}} @ keyframes -amp-start {من {visibility: hidden} إلى {visibility: visual}} </style> <noscript> <style amp-boilerplate = 'amp-boilerplate'> body {-webkit-animation: none؛ -moz-animation: none؛ -ms-animation: none؛ animation : none} </style> </noscript>
<script async = 'async' src = 'https: //cdn.ampproject.org/v0.js'> </script>
الخطوة الخامسة: إعداد صورة AMP:
قم بتغيير علامات الصورة إلى علامات amp-image مثل رمز المثال التالي:
<amp-img src = ”AmpImage.jpg” alt = ”amp-img” height = ”500 width =” 500 ″> </amp-img>
الآن كل شيء انتهى.
نصيحة مهمة جدًا: يرجى تغيير شباب استضافة الويب. هذا له دور رئيسي في تحسين محركات البحث الخاصة بك. أوصي بشدة بتجربة استضافة الويب A2 وتثبيت مدونة بلوجر الخاصة بك على ذلك. تقدم هذه الشركة ضمان استعادة الأموال ، لذا فهذا يعني أنك إذا لم تكن راضيًا ، فستسترد أموالك بالكامل.
انقر فوق اللافتة أدناه واستخدم رمز القسيمة - "ZIP51" للاستفادة من خصم 51٪.
ماهو AMP
AMP أو Google AMP هي Accelerated Mobile Pages . كما يوحي الاسم ، فإنه يساعد في تسريع تحميل الموقع على أجهزة الإنترنت الأبطأ. إنها مبادرة مفتوحة المصدر تدعمها شركات التكنولوجيا مثل Google و Twitter. على الرغم من أنه يقلل من تجربة مستخدم الموقع. يقوم بتصفية بيانات البرامج النصية الثقيلة مما يجعل تحميل الموقع أسرع. إذا كنت موافقًا على المساومة على تجربة المستخدم ، يمكنك تجربة Google AMP. يمكنك بسهولة إضافة Google AMP في Blogger. بهذه الطريقة ستتمكن من إعداد Google AMP في Blogger.
التحقق من صحة Google AMP في Blogger
للتحقق من صحة صفحات Google AMP الخاصة بك في Blogger ، يمكنك زيارة الموقع الرسمي لـ Google AMP. إذا كان هناك أي خطأ ، فإن المدقق سيرمي الخطأ.
إليك عنوان URL للتحقق من صحة صفحات AMP في Blogger / Google Blogspot
https://validator.ampproject.org/
تعليقات
إرسال تعليق