Микроразметка open graph

Что такое open graph и какие преимущества это дает для сайта

июнь 09 , 2016

Open graph - это формат микроразметки разработанный в facebook. Он используется исключительно для социальных сетей при формировании превью в посте, когда пользователь делиться ссылкой на сайт. Эта разметка не используется поисковыми роботами, для них есть свои форматы в schema.org.

Как сделать себе на сайте open graph

Для покупателей модуля MicrodataPro - достаточно включить настройку в главной вкладке модуля. Для тех кто хочет самостоятельно поставить себе микроразметку open graph надо вставить код на страницы где она нужна:

<meta property="og:type" content="website">
<meta property="og:title" content="Заголовок">
<meta property="og:description" content="Описание">
<meta property="og:image" content="Изображение">
<meta property="og:url" content="Ссылка">

Где в коде:

  • og:type - тип страницы website или article.
  • og:title - заголовок страницы.
  • og:description - краткое описание, которое должно заинтересовать потенциального посетителя.
  • og:image - изображение для превью.
  • og: url -  ссылка на страницу

Как видим сложного здесь ничего нет, но надо помнить о некоторых правилах.

  • Для информационный страниц og:type надо делать article, для остальных website
  • В og:title надо формировать стиснутый заголовок, но это не критично т.к. facebook сам обрезает заголовок нужной длины.
  • Когда в og:image формируете изображение - ссылка должна быть абсолютная т.е. с доменом сайта. Многие CMS формируют ссылки относительные. Для og:image нет лимитов если надо предоставить более одной фотографии пишем

<meta property="og:image" content="https://site.com/photo1.jpg">
<meta property="og:image" content="https://site.com/photo2.jpg">
и т.д

Для владельцев модуля MicrodataPro настройку Формировать open graph настоятельно рекомендуется включать. Сейчас много людей делятся в социальных сетях ссылками на интересные ресурсы и правильно сформированный сниппет привлекает больше внимания из-за чего процент переходов на сайт увеличивается.