Как исправить проблемы с кэшированием мобильного WooCommerce с помощью WP Rocket?

WP Rocket — один из популярных плагинов кеширования для WordPress. Мы используем облачный хостинг от SiteGround и получаем бесплатный плагин SG Optimizer. Однако WP Rocket хорошо работал у нас в течение последних многих лет, и с кешированием как таковым не было больших проблем. Недавно мы изменили тему с Highend на GeneratePress и заметили, что мобильное кеширование не работает со страницами WooCommerce. В этой статье давайте рассмотрим возможности решения проблем мобильного кеширования с помощью WP Rocket.



WP Rocket Разница

Хотя для WordPress доступно множество бесплатных плагинов кеширования, WP Rocket — отличный плагин по следующим причинам.

  • Супер простые настройки по сравнению с W3 Total Cache и многими другими плагинами.
  • Критическое создание CSS для оптимизации доставки контента
  • Отдельная опция мобильного кеширования
  • Предварительная загрузка, предварительная загрузка, отсрочка JS, оптимизация шрифтов и т. Д.

Вы можете ознакомиться с полным обзором WP Rocket и найти оптимизированные настройки для своего сайта. Однако проблема с мобильным кешированием WooCommerce показывает, что у плагина все еще есть улучшенная область для объединения и минимизации файлов.

Мобильное кеширование в WP Rocket

В отличие от многих других плагинов, WP Rocket предлагает отдельный вариант мобильного кеширования. Это поможет вам выбрать, хотите ли вы использовать один и тот же кеш рабочего стола или отдельную мобильную версию только для мобильных пользователей. Перейдите в раздел «Кэш» в настройках WP Rocket, чтобы найти опцию «Мобильный кэш».

В мобильном кешировании доступны два варианта:

  • Включить кеширование для мобильных устройств
  • Отдельные файлы кеша для мобильных устройств

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

Проблема с мобильным кешированием

Когда мы использовали сложную тему Highend, все работало. В этой теме есть настраиваемые шаблоны WooCommerce, которые также хорошо работают с WP Rocket из коробки. Однако, когда мы изменили тему на супер-простой GeneratePress, WP Rocket испортил отзывчивость магазина WooCommerce и страниц продуктов.

  • Макет магазина не будет складываться, чтобы показать один продукт, и вы увидите 3 или 4 столбца в соответствии с вашей настройкой.
  • Изображения на странице продукта не будут выровнены, и вы увидите изображение и контент рядом.
  • Сопутствующие товары не будут складываться должным образом.

По сути, все страницы WooCommerce на сайте потеряли адаптивный дизайн и ведут себя с фиксированным макетом как на настольных компьютерах, так и на мобильных устройствах. После детальной проверки проблемы мы обнаружили, что виновником была опция мобильного кеширования, включенная в WP Rocket.

Как исправить проблемы с кешированием мобильных устройств с помощью WP Rocket?

К сожалению, нет идеального способа исправить проблему мобильного кеширования с помощью WP Rocket. Однако есть несколько способов решить эту проблему в зависимости от ваших потребностей, отказавшись от кеширования определенных страниц или разделов на вашем сайте.

1. Отключить мобильное кеширование

Самый простой вариант — полностью отключить мобильное кеширование. Это хорошее решение, когда вам не нужно мобильное кеширование для вашего сайта. Перейдите в раздел «Кэш» в WP Rocket и отключите мобильное кеширование.

Мобильный кеш в WP Rocket
Мобильный кеш в WP Rocket

Однако, если вашему сайту требуется мобильное кеширование, отключение этого параметра повлияет на все остальные сообщения, страницы и настраиваемые типы сообщений на сайте. Когда вы отключите мобильное кеширование, WP Rocket перестанет обслуживать кэшированный контент для мобильных пользователей, и вы увидите множество предупреждений и ошибок в инструментах измерения скорости. Например, Google PageSpeed ​​Insights предложит использовать отложенную загрузку изображений Gravatar в вашем профиле автора и в разделе комментариев. Это существенно снизит оценку скорости, которая в нашем случае была ниже более чем на 50%.

2. Исключить тип контента из кеширования.

К сожалению, WP Rocket не имеет возможности отключить мобильное кеширование только для определенных типов сообщений или страниц. Это также было удивительно, хотя плагин не кэширует страницу магазина, макет не отвечал на мобильных устройствах. Единственный оставшийся нам вариант — полностью отключить кеширование для всех страниц WooCommerce. Перейдите в раздел «Дополнительные правила» и добавьте следующие две строки в раздел «Никогда не кешировать URL-адреса». Нажмите кнопку «Сохранить изменения», чтобы сохранить настройки.

/product/(.*)
/shop/

Это должно выглядеть так:

Исключить страницы WooCommerce из кеширования
Исключить страницы WooCommerce из кеширования

С этой настройкой WP Rocket не будет кэшировать ваши продукты и страницы магазинов. Вы можете увидеть правильный адаптивный макет без кеширования как на настольных, так и на мобильных устройствах.

3. Исключение отдельных страниц

Вместо отключения кеширования для всех продуктов вы также можете отключить кеширование для отдельных страниц продуктов. Когда вы создаете или редактируете продукт, выберите опцию «Никогда не кэшировать эту страницу» в мета-поле «WP Rocket Options».

Отключить кеширование для одной страницы
Отключить кеширование для одной страницы

Отключив кеширование для отдельных страниц, вы можете обслуживать некэшированные страницы из своей базы данных без нарушения макета.

4. Исключите WooCommerce CSS и JS из оптимизации.

Иногда уменьшение и объединение файлов CSS и JS WooCommerce также может создать проблему. Некоторым темам требуется правильная последовательность файлов для загрузки правильного макета. Уменьшение и объединение могут изменить последовательность загрузки и сломать макет. Вы можете исключить файлы CSS и JS WooCommerce на вкладке «Оптимизация файлов» для исключения. WP Rocket проигнорирует файлы в списке исключений, и страницы ваших продуктов могут загрузиться правильно.

Добавить исключение CSS
Добавить исключение CSS

Помните, что это загрузит некэшированные файлы CSS и JS WooCommerce на все другие страницы.

Похожие записи

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *