آموزش نصب و فعال سازی AMP وردپرس

آموزش نصب و فعال سازی AMP وردپرس

 

راهنمای ۷ مرحله ای سریع راه اندازی و تست AMP برای وردپرس

 

آیا به دنبال شروع کار با Accelerated Mobile Pages (AMP) هستید؟ به همین دلیل این راهنما را برای شما و تمامی کاربران وردپرس تهیه  کردیم. در جهان موبایل محور امروز، صفحاتی که سرعت لود بالایی دارند برای جلب رضایت کاربران ضروری هستند. اما فقط همین نیست، سرعت لود پایین صفحات با از دست رفتن سرمایه و البته باعث خروج مخاطبان از این صفحات می شود.

کاربران انتظار دارند که سرعت بارگذاری صفحات در تلفن همراه آن ها همتای دسکتاپ شان باشد. در حقیقت آمازون که یکی از بزرگترین فروشگاه های آنلاین است، محاسبه کرده است که یک ثانیه تاخیر در سرعت لود صفحات باعث $۱٫۶B کاهش درآمد در هر سال می شود.
Accelerated Mobile Pages (AMP) به سرعت در حال تبدیل شدن به یک استاندارد برای ساختن صفحاتی با سرعت بارگذاری بالا هستند. با استفاده از تکنولوژی AMP می توان ۱۵ تا ۸۰ در صد، سرعت بارگذاری صفحات را نسبت به صفحات استاندارد موبایل افزایش داد بدون این که کارایی و قابلیت این صفحات به خطر بیفتد. در حالی که سهولت اجرای AMP بسته به CMS (سیستم مدیریت محتوا) متفاوت است، وردپرس می تواند یک محیط خوب برای تست پیش نمایش AMP باشد تا ببینید صفحات AMP شما چگونه هستند.

 

این راهنمای سریع ۷ مرحله ای را دنبال کنید و AMP را برای وردپرس تان فعال کنید.

 

توجه: در این راهنما فرض شده که شما پلاگین Yoast SEO را نصب کرده اید. در صورتی که از این افزونه استفاده نمی کنید می توانید مرحله ای که به این پلاگین اشاره کرده است را نادیده بگیرید ، البته بدون این پلاگین هم می توان AMP را فعال کرد. اما به شدت توصیه می کنیم که این پلاگین را برای بهبود سایت خود حتما نصب کنید.

 

مرحله ی اول: پلاگین AMP را نصب و فعال کنید.

 

افزونه AMP نیاز به اجرای AMP توسط وردپرس دارد. این یک افزونه ی پایه است که برای AMP نیاز دارید، تا کار را شروع کنید.

 

نصب پلاگین AMP

 

افزونه ی AMP به طور خودکار یک نسخه ی AMP سازگار برای همه ی پست های شما ایجاد می کند و شما می توانید ببینید که به آخر آدرس پست های شما عبارت /amp/ اضافه شده است. به مثال زیر توجه کنید.

آدرس اصلی:

http://ift.tt/2tACkcC

آدرس amp:

 

http://ift.tt/2u9eD8D

 

اما توجه کنید که با این افزونه ی پایه فقط پست های شما با AMP سازگار خواهد شد و هنوز صفحات یا پیج های شما با AMP سازگار نیستند. برای اینکه صفحات سایت هم با AMP سازگار شوند ، نیاز به نصب افزونه ی دیگری دارید.

زمانی که شما افزونه ی AMP را نصب می کنید، می توانید یک لایه به این افزونه اضافه کنید تا قابلیت های بیشتری را در اختیار داشته باشید. چندین افزونه رایگان وجود دارد که شما می توانید آن ها را انتخاب کنید اما افزونه هایی که ما در این راهنما به شما پیشنهاد می دهیم ، به شرح زیر است :

 

    AMP for WP — Accelerated Mobile Pages

 

از ویژگی های چشم گیر این افزونه هماهنگی با Google AdSense و پشتیبانی از تگ canonical است. در این افزونه AMP می توان صفحات ساخته شده را کشید و در صفحه رها کرد و همچنین این توانایی را دارد که محتوای AMP ای را ایجاد کند که متفاوت با محتوا در صفحات استاندارد موبایل باشد.

 

افزونه AMP for wp

 

Glue for Yoast SEO & AMP

 

یکی از مزایای استفاده از این افزونه این است که به شما اجازه می دهد تا صفحات، پست ها و رسانه ها را سازگار با AMP بسازید. همچنین پلاگین Glue for Yoast تضمین می کند که پلاگین AMP در همه ی متادیتاها به درستی انجام شود. مانند پلاگین قبلی که توضیح دادیم ، امکان طراحی ظاهر سفارشی برای صفحات AMP را فراهم می کند و حتی می توانید آیکون لوگوی سایت در صفحات AMP را سفارشی کنید. (توجه کنید برای کار کردن با این پلاگین باید افزونه ی Yoast SEO را نصب کنید)

 

افزونه Glue for Yoast SEO & AMP

 

مرحله دوم: تنظیمات Google Analytics

به منظور تنظیم صفحات برای Google Analytics ، به tracking ID نیاز دارید .  وارد Google Analytics شوید و با ساخت اکانت  Tracking Code به شما تعلق خواهد گرفت ، کد خود را یادداشت کنید. این آی دی با UA شروع می شود.

tracking ID را کپی کنید و سپس وارد وردپرس شوید. و از زیرمنوی گزینه ی AMP در پنل سمت چپ وردپرس  روی گزینه ی Analytics کلیک کنید و در قسمت Google Analytics ، tracking ID را بنویسید. سپس تغییرات را ذخیره کنید.

 

تنظیمات Google Analytics

 

مرحله سوم: پیکربندی تنظیمات افزونه

 

در این مرحله بعضی از تنظیمات اولیه برای افزونه Glue for Yoast SEO که در مرحله اول ذکر شد، را شرخ خواهیم داد. اگر این پلاگین را نصب نکردید می توانید این مرحله را نادیده بگیرید و ادامه آموزش را دنبال کنید.

تنظیمات توصیه شده در این جا به شما اجازه می دهد تا ظاهر را سفارشی سازی کنید و سرعت را در صفحات موبایل خود به خوبی احساس کنید همچنین می توانید پشتیبانی از AMP را برای انواع مختلف محتوا فعال کنید.

برای شروع به مسیر Yoast SEOAMP  گزینه    و تب Post type بروید. در این قسمت شما می توانید انتخاب کنید که کدام نوع از پست ها باید پذیرای AMP باشند.

 

تنظیمات AMP در افزونه Yoast SEO

 

در تب دوم که Design است شما می توانید ظاهر را سفارشی سازی کنید و صفحات فعال AMP خود را ببینید. استایل های css را اعمال کنید،  محتوا و رنگ لینک ها را سفارشی کنید ، یک آیکون AMP سفارشی آپلود کنید و برای صفحاتی که تصویر ندارند یک تصویر پیش فرض تنظیم کنید.

 

مرحله چهارم: تست و تایید کردن تنظیمات AMP

 

حالا که URL های AMP را ایجاد کرده ایم، مهم است اطمینان حاصل کنیم که به درستی کار می کنند. اگر URL ها به درستی پیکربندی نشده باشند، گوگل آن ها را در موتورهای جستجو نمایش نخواهد داد. در حالی که این محافظت شما در برابر عملکرد نیمه کاره ی صفحات AMP ، می تواند نقطه ی درد خیلی از مدیران وب باشد.

خوشبختانه راه حل های متفاوتی برای تست URL  های AMP وجود دارد. چند صفحه ی مهم را انتخاب کنید و نسخه ی AMP را با استفاده از یکی از روش های زیر آزمایش کنید. همانطور که در مرحله ی اول گفتیم ، می توانید عبارت /amp/ را به آخر url استانداردی که در این آزمایش مشاهده می کنید ، اضافه کنید.

 

گزینه ی اول: Test  AMP

به آدرس http://ift.tt/2rSfkCy  بروید .
URL خود را وارد کنید و روی Run Test کلیک کنید، سپس نتیجه را یادداشت کنید. (معتبر/ غیر معتبر)

Test  AMP

 

گزینه ی دوم: Developer Console

 

این گزینه مخصوص کسانی است که از مرورگر کروم استفاده می کنند. اگر از سایر مرورگرها (Firefox، Safari، Microsoft Edge  و …) استفاده می کنید، این گزینه شامل شما نمی شود.

صفحه ی AMP را در مرورگر chrome باز کنید.
به URL تان عبارت #development=1 را اضافه کنید.

مثال:

http://ift.tt/2sDR4H8

 

Console Tool را Chrome باز کنید ( در منوی مرورگر chrome گزینه ی More tools و گزینه ی Developer tools را انتخاب کنید و سپس روی تب Console کلیک کنید.) و خطاها را بررسی کنید.  اگر همه چیز خوب باشد خطایابی موفقیت آمیز خواهد بود.

Developer Consoleدر chorme 

 

گزینه ی سوم:    AMP validator

به آدرس http://ift.tt/28TsPcA بروید.
در فیلد URL آدرس صفحه ی AMP را بنویسید و روی Validate کلیک کنید.
این ابزار هر خطایی را برجسته می کند و آن ها را در html علامت گذاری می کند.

 

AMP validator

نکته: می توانید از افزونه AMP Validator Chrome برای دیدن نتایجی مشابه  با این خروجی برای AMP URL خود استفاده کنید.

 

مرحله ی پنجم: مهم ترین URLهای AMP را برای ایندکس شدن ارسال کنید.

 

اگر AMP را در Search Console گوگل تست کردید ، می توانید زمانی که تست را انجام دادید و صفحه را تایید شد ، برای ارسال صفحات جهت ایندکس شدن روی دکمه ی submit to google کلیک کنید.

AMP در گوگل کنسول

اگر به اکانت گوگل کنسول خود وارد شدید ، می توانید submit to google  را جستجو کنید و URL را به طور مستقیم در نتایج جستجو ارسال کنید.

 

submit to google 

در هر حال ارسال صفحات AMP به گوگل الزامی نیست، گوگل صفحات AMP شما را فقط در صورتی ایندکس می کند که لینک داخلی به آن داده شده باشد یا در نقشه ی سایت XML ثبت شده باشند.

 

مرحله ششم: مشاهده در Search Console  گوگل برای رفع خطاها

 

Search Console گوگل راهی برای مدیریت همه ی صفحات AMP فراهم کرده است.

• وارد Search Console گوگل شوید.