Краткое руководство по использованию отладчика Facebook для исправления изображений WordPress

Это невероятно раздражающая проблема… вы написали фантастический пост для своего блога WordPress, тщательно создали изображение для поста и, наконец, опубликовали его. Пришло время поделиться им со всем миром на Facebook. Вы копируете ссылку на страницу, пишете остроумное описание и вставляете ссылку в Facebook. Через несколько секунд появится превью ссылки. Но подождите… он показывает совершенно неправильное изображение и описание! В чем дело? Хорошая новость заключается в том, что это распространенная проблема. Еще лучшая новость заключается в том, что это можно легко исправить с помощью отладчика Facebook.

Вот как вы это делаете.

В чем проблема и при чем тут Facebook Debugger?

Прежде чем мы сможем использовать отладчик Facebook для решения проблемы с неправильным отображением предварительного просмотра ссылки, нам нужно понять, в чем проблема.

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

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

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

Таким образом, неправильный предварительный просмотр ссылки может отображаться, когда:

1. Facebook удалил неверную информацию о вашей странице.
2. Страница была обновлена, но информация о старой странице хранится в кеше Facebook, и этот кеш не обновлялся.

Мы можем решить обе эти проблемы, используя два инструмента. Плагин Yoast SEO и отладчик Facebook.

Метатеги Open Graph

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

Метатеги Open Graph содержат всю информацию, которую Facebook может захотеть показать пользователям о вашей веб-странице. Другими словами, он сообщает Facebook, чем вы делитесь.

Если вы используете Yoast (или аналогичный плагин для поисковой оптимизации), информация Open Graph автоматически добавляется в заголовки ваших страниц. Вы можете изменить то, что отображается на вашей странице, с помощью этих плагинов. Когда будут добавлены правильные метатеги Open Graph, мы можем использовать отладчик Facebook, чтобы сообщить Facebook о повторной очистке вашей страницы, чтобы он обновил свой кеш с правильной информацией.

Использование Yoast для редактирования метатегов Open Graph

Самый простой способ редактировать метатеги Open Graph — использовать плагин Yoast SEO. Это не только плагин номер 1, который поможет вам оптимизировать ваш веб-сайт, чтобы он эффективно ранжировался, но также имеет удобный инструмент, который позволяет очень легко настроить страницы вашего веб-сайта для отображения правильной информации для Facebook. Если вы не хотите использовать Yoast, попробуйте плагин Open Graph и Twitter Card Tags.

Сначала установите плагин Yoast SEO (если вы еще этого не сделали), а затем откройте страницу, которой хотите поделиться на Facebook. Прокрутите страницу вниз, пока не найдете вкладку Yoast SEO. В Yoast вы увидите вкладку «Социальные сети». Нажмите на это, и у вас будет два варианта. Один для Facebook и один для Twitter. Выберите Facebook, и вы увидите следующее:

Yoast пытается автоматически отображать правильную информацию Open Graph для вашей страницы, но это не всегда правильно. Вместо того, чтобы полагаться на их автоматизированную систему, вы можете заполнить поля Facebook деталями, которые вы хотите, чтобы Facebook отображал вместе с изображением, которое вы хотите использовать. Когда вы закончите, это будет выглядеть примерно так:

Нажмите «Обновить», чтобы опубликовать эти изменения на своей странице, и теперь у вас будет правильная информация Open Graph, отображаемая в заголовках вашего веб-сайта.

Очистите кеш WordPress

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

Если вы размещаете свой сайт с помощью Pressidium, вы можете быстро очистить кеш с помощью плагина Pressidium, который можно найти в верхней части левого меню.

Очистив кеш с вашей стороны, теперь вы можете перейти к очистке кеша на серверах Facebook.

Использование отладчика Facebook

Перво-наперво, и нам нужно сначала увидеть, как Facebook в настоящее время «видит» вашу страницу. Для этого перейдите на страницу отладчика Facebook и введите URL-адрес своей страницы в инструмент. Нажмите «Отладка», и вы увидите сводную информацию о том, как отображается ваша страница, а также предварительный просмотр ссылки. Если это правильно, то все готово, так как это будет отображаться, когда ссылка на вашу страницу будет опубликована на Facebook.

Если это неверно, вам нужно еще раз проверить, правильно ли вы настроили Yoast и очистили кеш вашего сайта. Сделав это, нажмите «Очистить еще раз». Это заставляет Facebook обновлять свой кеш. Теперь это должно показывать правильную информацию! Если нет, не беспокойтесь о повторном нажатии «Очистить» во второй или третий раз. Иногда может потребоваться несколько попыток, чтобы заставить Facebook получить правильные данные для вашей страницы.

Дополнительные советы по отладке Facebook

Есть несколько других элементов, о которых стоит знать, если у вас возникнут какие-либо другие проблемы с отображением предварительного просмотра ссылок.

Размер изображения

По возможности используйте изображение размером 1200 на 630 пикселей. Это оптимальный размер для отображения изображения в предварительном просмотре ссылки на Facebook. Если соотношение сторон отличается, вы можете обнаружить, что элементы вашего изображения «обрезаны». Если вы хотите использовать более крупное изображение, попробуйте сохранить это соотношение сторон.

Если вы не видите отображаемого изображения, убедитесь, что оно достаточно большое. Если он меньше 200 x 200 пикселей, Facebook вообще не будет его отображать.

«Fb:app_id» отсутствует

Если вы посмотрите на снимок экрана отладчика Facebook выше, вы можете заметить, что есть ошибка «Отсутствуют свойства: отсутствуют следующие свойства: fb: app_id».

В большинстве случаев это предупреждение можно игнорировать. Это никак не повлияет на возможность делиться сообщениями. Однако это влияет на вашу возможность использовать данные Facebook Insights. Если это то, что вы хотите сделать, вот как исправить эту ошибку.

1. Зарегистрируйте приложение Facebook на https://developers.facebook.com/docs/apps#register (вам нужно будет преобразовать свою учетную запись Facebook в учетную запись разработчика)
2. Создайте приложение на странице https://developers.facebook.com/apps, а затем скопируйте свой идентификационный номер приложения.
3. Перейдите к своему администратору WordPress, а затем перейдите к плагину Yoast через меню боковой панели. Нажмите «Социальные сети», а затем «Facebook». Вверху вы увидите раздел для идентификатора вашего приложения. Вставьте это туда и сохраните.
4. Затем вы можете очистить кеш своего веб-сайта, а затем использовать отладчик Facebook, чтобы снова очистить свою страницу. Теперь эта ошибка должна исчезнуть.

Предварительно кэшируйте свою страницу с помощью Facebook

Наш последний совет — предварительно кэшировать страницу вашего веб-сайта с помощью Facebook. Тот, кто первым поделится вашей ссылкой на Facebook, может не увидеть предварительный просмотр ссылки. Это связано с тем, что Facebook еще не очистил эту страницу (он делает это только при публикации ссылки).

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

Резюме

Использование отладчика Facebook — редкая и легкая победа в сегодняшнем все более сложном цифровом мире! Это быстрый и эффективный инструмент для использования. Просто не забудьте очистить кеш своего веб-сайта, и все будет хорошо. Удачной отладки Facebook!