Как исправить изображения Facebook Opengraph на защищенных сайтах с помощью WordPress

  1. Симптом
  2. Диагноз
  3. Исправление
  4. Как автоматизировать исправление
  5. NB
  6. Около Сэм Мишель

<tl; dr> Использование тегов Opengraph для указания изображений и описаний, которые Facebook должен использовать при публикации ссылки, часто нарушается для защищенных сайтов, использующих https. Они ключи? Использование og: image: secure_url для указания ссылки. Вот быстрое решение, используя Yoast чрезвычайно популярный плагин для WordPress SEO . </ TL; др>

Извиняюсь, это идет вразнос. Я не знаю почему, но эта крошечная мелочь свела меня с ума, поэтому я засучил рукава и глубоко погрузился в WordPress (вроде).

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

К счастью, есть много замечательных, простых в использовании, фантастически хорошо оснащенных плагинов WordPress, которые делают это бризом, особенно знаменитым WordPress SEO плагин это скачало 51 230 245 загрузок.

Симптом

После создания великолепного изображения только для акций Facebook (1200 x 630 пикселей, поклонников статистики) и создания привлекательного описания (не более 300 символов), вы загружаете эти детали в раздел SEO своей страницы или поста и вуаля.

Вот что должно появиться при публикации URL в посте Facebook:

Вот что должно появиться при публикации URL в посте Facebook:

Подождите. Что случилось с прекрасным образом, который я провел целую вечность, собирая?

Диагноз

После некоторого ругательства и изрядного количества Googleage, оказывается, что Facebook не играет хорошо, когда изображение подается через https, но указано с помощью тега og: image.

Изображение для доли выше, которая не работает, живет здесь:

https://ceprogramme.com/wp-content/uploads/2017/06/Facebook-Promo-Image.jpg

Как правило, плагин WordPress SEO говорит Facebook использовать это изображение, вставив метатег Opengraph, добавив его в заголовок страницы:

<meta property = "og: image" content = "https://ceprogramme.com/wp-content/uploads/2017/06/Facebook-Promo-Image.jpg" />

Оказывается, Facebook не нравится, когда изображение отправляется с защищенной ссылки на тег og: image.

Что делать?

Исправление

К счастью, тег og: image имеет множество структурированных свойств, которые позволяют нам указать безопасный URL-адрес изображения, поэтому:

<meta property = "og: image" content = "https://ceprogramme.com/wp-content/uploads/2017/06/Facebook-Promo-Image.jpg" />

будет выглядеть так:

<meta property = "og: image: secure_url" content = "https://ceprogramme.com/wp-content/uploads/2017/06/Facebook-Promo-Image.jpg" />

и, эй престо! Оно работает.

Ура.

Как автоматизировать исправление

Обработка этого вручную - главная боль в шее.

К счастью, плагин WordPress SEO предоставляет множество возможностей, поэтому с помощью нескольких строк PHP мы можем подключиться к коду плагина и правильно обрабатывать изображения, обслуживаемые через https.

К счастью, вам просто нужно добавить несколько строк в файл functions.php в вашем файле темы WordPress. Если он не существует, вы можете создать его и добавить:

/ ** / ** Плагин Yoast SEO неправильно обрабатывает теги изображений с открытым графом *, если они размещены на безопасном сервере. К счастью, они предоставляют множество * полезных фильтров для регулировки этого значения. Эта функция * проверяет, находится ли изображение в защищенной ссылке, и если да, добавляет secure_url * в тег og, чтобы он был правильно отформатирован. * @param string $ image URL для изображения с открытым графом * @return none * / function check_ssl_facebook_opengraph_image ($ image) {$ og = "og: image"; if (preg_match ('/ ^ https /', $ image)) {echo '<meta property = "'. $ og. ': secure_url" content = "'. $ image. '" />'. "\ П"; $ image = preg_replace ("/ ^ https /", "http", $ image); } // Скорее всего, изображение также доступно через http, поэтому давайте добавим //, чтобы Facebook Linter был доволен эхом '<meta property = "'. $ Og. '" Content = "'. $ Image. '" /> '. "\ П"; } // Подключаем к подключаемому модулю Yoast для обработки изображения OG add_action ('wpseo_opengraph_image', 'check_ssl_facebook_opengraph_image');

Это должно делать свое дело. Он также содержит ссылку на небезопасную версию изображения с использованием http для полноты, но это не является строго обязательным.

NB

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

Facebook Sharing Debugger твой друг:

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

Благодаря Публикация Syed в переполнении стека это указало мне в правильном направлении.

Надеюсь, это поможет. Если я что-то пропустил, у вас есть лучший способ справиться с этим, или что-то не работает должным образом, позвольте мне знать.

фото Уильям Ивен на Unsplash

Также опубликовано на Средняя ,

Около Сэм Мишель

Пытливый. Hopeful. Jovial. Вздорный. Цифровой маркетолог. Организатор мероприятия. Давний поклонник технологий, сотрудничества и инноваций. Изучение цифровых, социальных, бизнес, технологий, общества, психологии и стартапов. основатель болтовня , Цифровая миссия , Pitch NYC , ChinwagPsych , Бывший исполнительный директор, Неделя социальных медиа в Лондоне , Более короткие вещи @toodlepip в Твиттере.

связанные с

Похожие

Оптимизация SEO на WordPress
Использование хорошей тактики поисковой оптимизации (SEO) является неотъемлемой частью создания успешного веб-сайта. SEO относится ко всем вещам, которые вы можете сделать, чтобы помочь вашему сайту занять более высокое место в результатах поиска, что является абсолютным лучшим способом увеличить
Сканирование сайтов, защищенных паролем
От версия 7.0 SEO Spider можно сканировать версии разработки веб-сайтов, которые используют веб-формы для аутентификации, таких как частный сайт WordPress. Это очень мощная функция, поэтому ее следует использовать с большая ответственность , SEO Spider нажимает на каждую ссылку на странице; когда вы вошли в систему,
Facebook Открыть График Теги для SEO
Это вторая часть нашей серии из трех статей о метаданных. Используйте метатеги для увеличения трафика от Google и Bing
Как повысить свой рейтинг Alexa
Ваш рейтинг Alexa является важной частью вашего онлайн-бизнеса и помогает определить стоимость вашего бренда. Рейтинг Alexa используется для оценки состояния вашего веб-сайта или бизнеса, а также того, имеет ли он тенденцию к повышению или понижению. Рейтинги Alexa также можно использовать
Wordpress против Joomla! - Перспектива SEO
... как Joomla ! и Wordpress вносят свой вклад в то, чтобы позволить даже начинающим блоггерам погрузиться в мир разработки веб-контента. Вероятно, эти две системы остаются наиболее широко используемыми, с заметным преимуществом Wordpress, на котором в настоящее время размещается более 80 миллионов веб-сайтов, включая некоторые из самых популярных, таких как Mashable, New York Times и т. Д. Конечно, существует множество причин, по которым
7 типов обратных ссылок и как их получить
Не секрет, что ссылки ценны для любого сайта. Они не только доказывают поисковой системе, что ваш сайт обладает авторитетом, но у вас также есть потенциал для охвата неиспользованной аудитории (которая потенциально может превратиться в клиентов), если вы используете правильные методы. Link-здание по этим точным причинам является важной частью многих стратегий SEO, но нельзя с уверенностью утверждать, что
Лучшие плагины Wordpress SEO - писец против Wordpress SEO
Мы любим хорошую конкуренцию, и в этой статье плагин WordPress SEO конкурирует с Scribe (теперь часть колдун,
Как оптимизировать ваш Pinterest для SEO
Когда я начал вести блог почти пять лет назад, Pinterest была все еще большой «it» платформой. Все были в восторге от того, насколько эффективно это было, и я наконец-то поверил в магию, когда я увеличил количество просмотров в день до 30 000 благодаря единственной булавке, которая стала вирусной. Сейчас? Блестящая новизна платформы стерлась, а эффективность - нет. Pinterest является одним из самых значительных драйверов социального трафика для блога Teachable
SEO и SEM как маркетинговые стратегии
6 июля 2017 г. - Что это такое, чем они отличаются и как их применять - вот некоторые моменты, которые мы разъясним по этой теме. SEO и SEM - это стратегии цифрового маркетинга, которые помогают вам позиционироваться в поисковых системах, но знаете ли вы, что они собой представляют и как применять их на практике?
Лучшая структура постоянных ссылок WordPress для SEO
... какое-то время использовали указанную выше структуру URL по умолчанию и у вас есть несколько входящих ссылок на ваш сайт, будет лучше изменить ее и попытаться обновить все свои входящие ссылки, чем оставить ее как есть. Если вы не можете обновить ссылки на свой сайт, я предлагаю вам использовать замечательный плагин Redirection WordPress. С его помощью вы можете управлять 301 перенаправлениями и отслеживать 404 ошибки. Другими словами, перенаправьте свои ошибочные входящие ссылки на новые
Обмен SEO-плагинов WordPress с платины на Yoast
Изменение WordPress SEO ОК, пришло время изменить мой плагин для WordPress SEO , я хочу перейти на использование Yoast SEO плагин , До сих пор я использовал Platinum SEO , но не могу не заметить больше наворотов, с которыми поставляется плагин Yoast. Похоже, разработчик Joost de Valk работает над WordPress и SEO, и пришло время перейти к нему. Нет ничего плохого в Platinum

Комментарии

Что такое пост WordPress, что такое страница WordPress и в чем разница между постом WordPress и страницей?
Что такое пост WordPress, что такое страница WordPress и в чем разница между постом WordPress и страницей? В этом руководстве по WordPress мы обсудим основное различие между Post и страницей в WordPress, мы рассмотрим аспекты, включая настройки времени, категорию, шаблон и их влияние на SEO. Что такое пост или страница WordPress? WordPress Post относится к контентным записям, которые широко перечислены в обратном хронологическом порядке. Вы можете получить его в списке категорий,
Хотите узнать, как сделать ваш блог успешным с помощью маркетинга в социальных сетях и заразительного контента?
Хотите узнать, как сделать ваш блог успешным с помощью маркетинга в социальных сетях и заразительного контента? Моя книга - « Блоггинг Smart Way - Как создать и продать блог-убийцу в социальных сетях » - покажу вам, как. Теперь доступно для скачивания. Я покажу вам, как создать и создать блог,
Хотите узнать, как наша команда может помочь вашему бизнесу в Сан-Антонио увеличить ваши лиды, продажи и доходы с помощью SEO?
Хотите узнать, как наша команда может помочь вашему бизнесу в Сан-Антонио увеличить ваши лиды, продажи и доходы с помощью SEO? Позвоните нам. Мы хотели бы обсудить ваши цели. Работает ли SEO для бизнеса в Сан-Антонио? Перейдите в Google и найдите несколько ключевых слов, имеющих отношение к вашей компании. Вы видите свой сайт несколько раз на первой странице результатов поиска? Если
Как вы думаете, какие плагины WordPress SEO являются лучшими?
Как вы думаете, какие плагины WordPress SEO являются лучшими? Каков ваш лучший подход для оптимизации сообщений в блоге? У вас есть вопросы, которые вы хотели бы задать? Примечание: в этом обзоре нет партнерских ссылок. Если бы мы хотели заработать на этом посте, мы бы порекомендовали Scribe, потому что это платный сервис !! кредит фото: Эрик Лэнгли с помощью
Вы знакомы с разработкой WordPress, оптимизацией веб-сайтов и SEO и чувствуете себя как дома в Большом Берлине?
Вы знакомы с разработкой WordPress, оптимизацией веб-сайтов и SEO и чувствуете себя как дома в Большом Берлине? Кроме того, вы ищете проект в короткие сроки? Тогда, возможно, наш проект месяца для вас! Описание проекта провайдера описание работы Мы ищем поддержку для запуска
Он ответил на такие вопросы, как «какова хорошая оценка ACT?
Он ответил на такие вопросы, как «какова хорошая оценка ACT?» Или «на что обращают внимание колледжи от студентов, подающих заявление?» Мы знали, что люди, ищущие эти темы, были нашим целевым рынком. Мы хотели, чтобы они нашли ответ у нас, чтобы мы могли тогда побудить их проверить продукт, который мы предлагали.
Если вы создаете или поддерживаете сайты WordPress для клиентов, как вы узнаете, какие плагины действительно стоят того?
Если вы создаете или поддерживаете сайты WordPress для клиентов, как вы узнаете, какие плагины действительно стоят того? Давайте посмотрим на некоторые из наших лучших вариантов ниже. 1. Безопасность Wordfence Wordfence Security - это самый популярный плагин для межсетевого экрана и сканирования безопасности, доступный для WordPress, с более чем 2 миллионами активных установок. Это очень настраиваемый инструмент, который защищает ваш сайт с помощью:
Вы ищете лучшие плагины WordPress для SEO, чтобы повысить индексацию вашей поисковой системы и получить больше трафика на ваш сайт WordPress?
Вы ищете лучшие плагины WordPress для SEO, чтобы повысить индексацию вашей поисковой системы и получить больше трафика на ваш сайт WordPress? Поисковые системы - лучший способ продвижения, рекламы и помощи людям в обнаружении вашего контента. Вот 25 лучших плагинов для WordPress SEO, которые помогут вам безопасно оптимизировать ваши блоги WordPress, чтобы поисковые системы могли найти ваш контент и хорошо его проиндексировать. Все эти плагины SEO невероятно, используйте это, чтобы оптимизировать
Хотите узнать, как использовать SEMrush как профессионал?
Хотите узнать, как использовать SEMrush как профессионал? ПРИМЕЧАНИЕ: позже я объясню шаг за шагом, как проводить эти конкурентные анализы, и вы сможете увидеть видеоурок о том, как я делаю это сам. Тем не менее, у вас также есть другие инструменты для ключевых слов, один из которых анализирует конкуренцию Длинный хвост про у этого есть показатель конкурентоспособности в каждом
Как работает (домашняя) страница, как создание ссылок и является ли содержание оптимальным?
Хотите узнать, как использовать SEMrush как профессионал? ПРИМЕЧАНИЕ: позже я объясню шаг за шагом, как проводить эти конкурентные анализы, и вы сможете увидеть видеоурок о том, как я делаю это сам. Тем не менее, у вас также есть другие инструменты для ключевых слов, один из которых анализирует конкуренцию Длинный хвост про у этого есть показатель конкурентоспособности в каждом
Как вы начинаете как выпускник средней школы?
Как вы начинаете как выпускник средней школы? В то время я читал статью в WirtschaftsWoche о поисковой оптике в США. Потом я посмотрел в классе, кто самый умный и с кем мне хорошо ладить. Я спросил Себастьяна, хотим ли мы начать бизнес вместе. Несмотря на компанию, мы оба начали там учиться. Но когда у нас появились первые клиенты, мы перестали учиться. Если вы не изучали бизнес-администрирование или маркетинг, откуда вы получаете свои знания?

Они ключи?
В конце концов, мы все о создании сказочных вещей, которые будут делиться, не так ли?
Что случилось с прекрасным образом, который я провел целую вечность, собирая?
Что делать?
Хотите узнать, как использовать SEMrush как профессионал?
Как вы начинаете как выпускник средней школы?
Если вы не изучали бизнес-администрирование или маркетинг, откуда вы получаете свои знания?