Задача: когда вашей страницей делятся в соц. сетях, сделать так, чтобы подтягивалась нужная информация со страницы.
Большинство социальных сетей поддержвают протокол Open Graph, разработанный facebook. С ним мы и будем работать.
Суть нашей работы заключается в добавлении свойств и значений в теги . Пример:
<html prefix="og: http://ogp.me/ns#"> <head> <title>Мета теги для соц. сетей</title> ... <!-- первые четыре основные --> <meta property="og:title" content="Мета теги для соц. сетей" /> <meta property="og:type" content="article" /> <meta property="og:url" content="http://thisis-blog.ru/" /> <meta property="og:image" content="http://thisis-blog.ru/" /> <meta property="og:description" content="Как добавить разметку Open Graph на сайт." /> <meta property="og:site_name" content="Блог 1с-Битрикс программиста" /> ... </head>
Если например на сайте используется компонент новостей или каталог и нужно добавить разетку на детальную страничку, то соответственно в шаблоне news.detail, либо в catalog.element добавить код в result_modifier.php :
<?php
$this->__component->SetResultCacheKeys(array(
"NAME",
"PREVIEW_TEXT",
"PREVIEW_PICTURE"
));?>
?>
Нужен для кэширования ключей( будем использовать их в component_epilog.php) $arResult.
в component_epilog.php добавляем следующий код:
<?php
$APPLICATION->AddHeadString('<meta property="og:title" content="'.$arResult['NAME'].'"/>');
$APPLICATION->AddHeadString('<meta property="og:type" content="article"/>');
$APPLICATION->AddHeadString('<meta property="og:image" content="http://thisis-blog.ru'.$arResult['PREVIEW_PICTURE']['SRC'].'"/>');
$APPLICATION->AddHeadString('<meta property="og:site_name" content="Блог 1с-Битрикс программиста"/>');
$APPLICATION->AddHeadString('<meta property="og:description" content="'.ucfirst($arResult['PREVIEW_TEXT']).'"/>');
?>
О необязательных метаданных и для более детального описания контента можно почитать тут http://ruogp.me
Оставить комментарий