Как добавить поддержку AMP в тему WordPress: практическое руководство

Автор: Михаил Петров | Опубликовано: 21.02.2026

AMP (Accelerated Mobile Pages) — это технология, которая позволяет создавать максимально быстрые и оптимизированные для мобильных устройств страницы. Добавление поддержки AMP в тему WordPress существенно улучшит скорость загрузки сайта на мобильных устройствах и повысит удобство пользователей.

Зачем нужна поддержка AMP в теме WordPress

С ростом мобильного трафика важность ускоренной загрузки страниц становится ключевой для удержания посетителей и улучшения SEO. Google активно продвигает AMP, поэтому сайты с поддержкой AMP получают преимущество в поисковой выдаче на мобильных устройствах.

Поддержка AMP в теме WordPress позволяет:

Ускорить загрузку страниц на мобильных устройствах;
Снизить показатель отказов;
Улучшить позицию в мобильной выдаче Google;
Обеспечить единый стиль и корректное отображение контента.

Основные способы добавить AMP в тему WordPress

Существует два основных подхода:

Использовать официальный плагин AMP от команды WordPress;
Реализовать поддержку AMP вручную, создавая отдельные шаблоны и стили.

Рассмотрим оба варианта подробнее.

Вариант 1. Официальный плагин AMP для WordPress

Плагин AMP позволяет автоматически генерировать AMP-версии страниц. Он поддерживает три режима:

Стандартный режим — сайт полностью AMP;
Трансформационный режим — AMP-версии доступны по отдельным URL;
Классический режим — отдельные страницы AMP по специальному адресу.

Для установки плагина:

1. Перейдите в админку WordPress → Плагины → Добавить новый.
2. Найдите плагин «AMP».
3. Установите и активируйте его.
4. В разделе «AMP» настроьте режим и внешний вид.

Плагин автоматически создаст AMP-версии записей, страниц и архивов. Однако, для полной интеграции темы может потребоваться доработка шаблонов.

Вариант 2. Ручная интеграция AMP в тему WordPress

Ручная интеграция дает полный контроль над отображением AMP-страниц, но требует знания PHP и специфики AMP.

Основные шаги:

Создать отдельный шаблон AMP, например single-amp.php.
Использовать валидный AMP HTML — заменять теги img на amp-img, video на amp-video.
Добавить необходимый AMP boilerplate и скрипты в <head>.
Обеспечить корректную загрузку стилей — только inline CSS, не более 50 Кб.

Пример базового шаблона AMP:

<!doctype html>
<html amp lang="ru">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
  <link rel="canonical" href="<?php the_permalink(); ?>">
  <style amp-boilerplate>
    body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}
  </style>
  <script async src="https://cdn.ampproject.org/v0.js"></script>
  <title><?php wp_the_theme_wp_themes_amp_title(); ?></title>
  <style amp-custom>
    /* Ваши стили не более 50 Кб */
  </style>
</head>
<body>
  <article>
    <h1><?php the_title(); ?></h1>
    <div class="content">
      <?php echo wp_themes_wp_themes_amp_content(get_the_content()); ?>
    </div>
  </article>
</body>
</html>

Здесь wp_themes_wp_themes_amp_title() и wp_themes_wp_themes_amp_content() — пользовательские функции для подготовки данных под AMP. Пример реализации функции для преобразования контента:

function wp_themes_wp_themes_amp_content($content) {
  // Заменяем теги img на amp-img
  $content = preg_replace('/<img([^>]+)>/i', '<amp-img layout="responsive" $1></amp-img>', $content);
  // Удаляем все скрипты
  $content = preg_replace('/<script.*?<\/script>/is', '', $content);
  return $content;
}

Плагины для расширенной работы с AMP

Помимо официального плагина, есть полезные дополнения:

Clearfy Pro — оптимизация AMP и базовые настройки SEO.
WPRemark — улучшение комментариев в AMP.

Эти плагины помогут дополнить функционал AMP и сделать сайт более удобным для посетителей.

Особенности и ограничения AMP

При добавлении AMP важно понимать, что:

Запрещены пользовательские JS-скрипты — только разрешенные компоненты AMP.
CSS должен быть встроен и не превышать 50 Кб.
Некоторые сложные элементы темы придется адаптировать или исключить.

Поэтому стоит тщательно тестировать AMP-страницы через AMP Validator и в инструментах Google Search Console.

Заключение

Добавление поддержки AMP в тему WordPress — эффективный способ улучшить мобильную производительность сайта. Можно воспользоваться официальным плагином или создать собственный AMP-шаблон для полной кастомизации. Важно учитывать ограничения AMP и оптимизировать стили и контент. Дополнительные плагины, такие как Clearfy Pro, помогут упростить настройку и улучшить SEO.