Идет загрузка.
Пожалуйста, подождите

Open Graph протокол для WordPress

Материал обновлен: 10.08.2017

Метаданные протокола Open Graph позволяют Вашим страницам и записям корректно отображаться при шаринге в социальные сети.

Шаринг без протокола Open Graph

 

Шаринг с протоколом Open Graph

Основные мета-теги Open Graph:

<meta property="og:title" content="Заголовок">
<meta property="og:locale" content="ru_RU"> <!-- Локализация -->
<meta property="og:type" content="article"> <!-- Тип -->
<meta property="og:url" content="http://site.ru"><!-- ссылка на страницу или запись -->
<meta property="og:site_name" content="Название сайта">
<meta property="og:description" content="Описание">

Все мета-теги, а также информацию о протоколе Open Graph можно прочитать:
http://ogp.me/ — официальный сайт
http://ruogp.me/ — перевод

Адаптированный протокола Open Graph под WordPress может выглядеть так (код необходимо добавить в файл header.php, до тега </head>):

<meta property="og:title" content="<?php the_title(); ?>">
<meta property="og:locale" content="ru_RU"> <!-- Локализация -->
<meta property="og:type" content="article"> <!-- Тип -->
<meta property="og:url" content="<?php echo get_permalink(); ?>"><!-- ссылка на страницу или запись -->
<meta property="og:site_name" content="<?php echo get_bloginfo('title'); ?>">
<meta property="og:description" content="<?php the_content(); ?>">

К сожалению, данный код не универсален. И в зависимости от других типов (категории, архивы, теги, кастомизированные шаблоны) может работать некорректно.

Выход: использование плагина Open Graph Protocol Framework
Плагин не требует настройки. Просто установите его и Ваш WordPress будет полностью соответствовать протоколу Open Graph

Если же Вам необходимо установить другие значения определенных мета-тегов, воспользуйтесь фильтром.
В примере — установка произвольного изображения для главной страницы (вставьте в functions.php):

add_filter('open_graph_protocol_metas','open_graph_protocol_change_front_image');
function open_graph_protocol_change_front_image($metas) {
	if (is_front_page()) {
		$metas['og:image'] = 'абсолютная ссылка на изображение';
	}
	return $metas;
}

Через данный фильтр, можно изменять и другие значения мета-тегов протокола Open Graph:

add_filter('open_graph_protocol_metas','open_graph_protocol_change_front_og');
function open_graph_protocol_change_front_og($metas) {
	if (is_front_page()) {
		$metas['og:image'] = 'абсолютная ссылка на изображение';
		$metas['og:title'] = 'другой заголовок';
		$metas['og:description'] = 'другое описание';
	}
	return $metas;
}
Звёзд: 1Звёзд: 2Звёзд: 3Звёзд: 4Звёзд: 5 (оценок: 5, в среднем: 5,00 из 5)
Загрузка...

Материал оказался полезным?
Поблагодарите авторов за старание и таких материалов будет больше.





Категория: Оптимизация
Теги: , ,

95 0
06.08.2017


Комментарии

Комментариев пока нет

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

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