Как да използваме AMP с WordPress

АМП е общински усилия, които обещават по-добра производителност при зареждане на страници за уебсайтове в мобилната среда. Но, както можете да откриете от предишния ни урок, ще трябва да пожертвате фантастични неща от уебсайта си и стриктно да спазвате правилата, да спазвате указанията и да проверявате страниците. Звучи като много за вършене, нали??

За щастие, ако сте построили уебсайта си с WordPress, можете да приложите AMP към уебсайта си с помощта на плъгин, наречен AMP-WP. Той се доставя с повече функции, отколкото отговаря на окото. Така че, нека да видим как работи.

активиране

Първо, влезте в уебсайта си, отидете на Добавки> Добавяне на нов екран. Търся “AMP; инсталирайте и активирайте тази от Automattic.

Веднъж активирана, можете да прегледате AMP-конвертирания пост, като добавите / Усилвател / пътека в края на URL адреса на публикацията (напр. http://wp.com/post/amp/), или с ?усилвател = 1 (например. http://wp.com/post/?amp=1), ако не използвате функцията Pretty Permalinks на уебсайта си.

Както можете да видите по-горе, на публикацията са дадени основни стилове, които можете допълнително да персонализирате.

За да отбележи

Има няколко неща, които трябва да знаете за състоянието на приставката в момента:

• архиви - категория, свободен край и Потребителска таксономия - понастоящем не се поддържат. Те няма да бъдат преобразувани в AMP-съвместим формат. Въпреки това, потребителските типове постове могат да бъдат инициирани в AMP чрез филтър.
• Той не се добавя в нов екран за настройка в таблото за управление. Персонализирането се извършва на ниво код с действия, филтри, клас.
• Понастоящем плъгинът не обхваща всички потребителски елементи на AMP, като например усилвател-анализ и усилвател-реклама извън кутията. Ако имате нужда от тези елементи, ще трябва да го включите, като се включите в действията или филтрите на плъгина.

персонализиране

Приставката предоставя многобройни действия и филтри, които осигуряват гъвкавост при персонализиране на стиловете, съдържанието на страницата и дори HTML маркировката на страницата AMP като цяло..

Стилове

Сигурен съм, че това е едно нещо, което искате да промените веднага след активирането на приставката, като промяна на цвета на фона на заглавката, семейството на шрифтовете и размера на шрифта, за да отговарят по-добре на марката и личността на уебсайта Ви.

За да направим това, можем да използваме amp_post_template_css Действие в functions.php файл на нашата тема.

функция theme_amp_custom_styles () ?> nav.amp-wp-title-bar цветен фон: оранжев;   
Ако разгледаме Chrome DevTools, тези стилове се добавят в