Микроразметка изображений wordpress

Добрый день!Есть функция микроразметки изображений:

//микроразметка изображений
    function micro_images_captions ($a , $attr, $content = null){
extract(shortcode_atts(array('id' => '', 'align' => 'alignnone', 'width' => '', 'caption' => ''), $attr));
 if ( 1 > (int) $width || empty($caption) )
 return $content;
 $caption = html_entity_decode( $caption ); 
 if ( $id ) $id = 'id="' . esc_attr($id) . '" ';
return '<div itemprop="image" itemscope itemtype="https://schema.org/ImageObject" ' . $id . 'class="wp-caption ' . esc_attr($align) . '" style="width: ' . (10 + (int) $width) . 'px">' . do_shortcode( $content ) . '<p class="wp-caption-text">' . $caption . '</p></div>';}
function micro_image($content) {
$ar_mk = '!<img (.*?) width="(.*?)" height="(.*?)" (.*?)/>!si';
$br_mk = '<span itemprop="image" itemscope itemtype="https://schema.org/ImageObject"><img itemprop="url" itemprop="image" \\1 width="\\2" height="\\3" \\4/><meta itemprop="width" content="\\2"><meta itemprop="height" content="\\3"></span>';
$content = preg_replace($ar_mk, $br_mk, $content); 
 return $content; 
}
add_filter('the_content', 'micro_image');
add_filter('img_caption_shortcode', 'micro_images_captions', 10, 3);
//микроразметка изображений

?>

Яндекс добавил дополнительные требования:ontentUrl или image – (URL) ссылка на изображение. Обязательное поле, если не заполнено thumbnail. Без заполнения одного из этих полей, данные не будут обработаны. Предпочтительно contentUrl, обязательно ссылка именно на файл изображения;thumbnail – (ImageObject) описание изображения предпросмотра типа ImageObject, обязательно в случае отсутствия contentUrl или image;name – (Text) название картинки;caption – (Text) подпись к картинке;description – (Text) описание изображения;height – (Distance) высота изображения;width – (Distance) ширина изображения.Сейчас выводится только url, размер изображений.А надо чтобы были еще:название, подпись, описание и т. д.Должно получиться что-то вроде этого:

<?php
<div itemscope itemtype="http://schema.org/ImageObject">
  <h2 itemprop="name">Винни-Пух</h2>
  <img src="vinni.jpg" itemprop="contentUrl" />
  <span itemprop="description">Винни-Пух залезает на дерево.</span>
</div>

?>

В функции micro_image($content) у вас у тега img два не правильных атрибута:

itemprop="url" itemprop="image"


замените это всё на 

itemprop="contentUrl"

ну и чтоб на каждую картинку не выводить описание и заголовок, можно это всё писать через meta-теги:

<div itemscope itemtype="http://schema.org/ImageObject">
    <img src="vinni.jpg" itemprop="contentUrl" />
    <meta itemprop="name" content="Винни-Пух" />
    <meta itemprop="description" content="Винни-Пух залезает на дерево." />
</div>


или для инлайн варианта:

<span itemscope itemtype="http://schema.org/ImageObject">
    <img src="vinni.jpg" itemprop="contentUrl" />
    <meta itemprop="name" content="Винни-Пух" />
    <meta itemprop="description" content="Винни-Пух залезает на дерево." />
</span>

Как это встроить в функцию?

открыть редактор кода и в строке ниже ввести нужный html

<?php
$br_mk = '<span itemprop="image" itemscope itemtype="https://schema.org/ImageObject"><img itemprop="url" itemprop="image" \\1 width="\\2" height="\\3" \\4/><meta itemprop="width" content="\\2"><meta itemprop="height" content="\\3"></span>';

?>

или у вас есть вопросы по выводу заголовка/описания изображения или что-то ещё вызывает вопросы? уточните это, пожалуйста

<?php
//микроразметка изображений
    function micro_images_captions ($a , $attr, $content = null){
extract(shortcode_atts(array('id' => '', 'align' => 'alignnone', 'width' => '', 'caption' => ''), $attr));
 if ( 1 > (int) $width || empty($caption) )
 return $content;
 $caption = html_entity_decode( $caption ); 
 if ( $id ) $id = 'id="' . esc_attr($id) . '" ';
return '<div itemprop="image" itemscope itemtype="https://schema.org/ImageObject" ' . $id . 'class="wp-caption ' . esc_attr($align) . '" style="width: ' . (10 + (int) $width) . 'px">' . do_shortcode( $content ) . '<p class="wp-caption-text">' . $caption . '</p></div>';}
function micro_image($content) {
$ar_mk = '!<img (.*?) width="(.*?)" height="(.*?)" (.*?)/>!si';
$br_mk = '<span itemprop="image" itemscope itemtype="https://schema.org/ImageObject"><img itemprop="url" itemprop="image" \\1 width="\\2" height="\\3" \\4/><meta itemprop="width" content="\\2"><meta itemprop="height" content="\\3"></span>';
$content = preg_replace($ar_mk, $br_mk, $content); 
 return $content; 
}
add_filter('the_content', 'micro_image');
add_filter('img_caption_shortcode', 'micro_images_captions', 10, 3);
//микроразметка изображений

?>
Сделайте изменения в этой функции. Что-то совсем не понимаю что Вы говоорите

Сейчас данная функция выводит только ширину и длину, а надо чтобы выводились еще и описание название и т. д.

https://yandex.ru/support/images/schema-org.html?utm_source=yandex.webmaster&utm_medium=landing&utm_campaign=site_in_search&utm_content=link_13

в общем у вас достаточно большая задача, решение которой не описывается в пределах одной темы. решение делится на 2 части:

1. подготовить обработчик для вывода изображений записи
2. подготовить обработчик для контента страниц/записей
Решение
1. первое решается через фильтр post_thumbnail_html (https://wp-kama.ru/hook/post_thumbnail_html)
2.решений второго несколько сложнее. всё решается в пределах фильтра the_content (https://wp-kama.ru/hook/the_content).

тут следующий алгоритм:
1. разобрать html страницы с помощью либы  http://sourceforge.net/projects/simplehtmldom/
2. получить список всех изображений
3. по src изображений получить attachment_id каждого из изображений (https://stackoverflow.com/questions/25671108/get-attachment-id-by-file-path-in-wordpress/31743463)
4. по attachment_id получить title изображения (https://wordpress.stackexchange.com/questions/59061/get-attachment-title-based-on-attachment-id)
5. по attachment_id получить описание каждого изображения (https://wp-kama.ru/function/wp_get_attachment_caption)
6. из полученных данных сформировать новый html для каждого изображения.
7. сохранить

ничего не понял, но все равно спасибо:) А просто модифицировать данную функцию нельзя?
p.s. 

<?php
itemprop="url" itemprop="image"

?>
при замене этих атрибутов этим

<?php
itemprop="contentUrl"
?>

валидатор выдает ошибку

скрин ошибки в студию

Можете сами прогнать в валидаторе

Новое поступление товара — Apple iPhone

верните вот этот атрибут тегу img

itemprop="url"

Теперь ошибки нет. Разницы до и после замены не видно.

<?php
//микроразметка изображений

function micro_images_captions ($a , $attr, $content = null){
	extract(shortcode_atts(array('id' => '', 'align' => 'alignnone', 'width' => '', 'caption' => ''), $attr));
		if ( 1 > (int) $width || empty($caption) )
			return $content;
		$caption = html_entity_decode( $caption ); 
		if ( $id ) $id = 'id="' . esc_attr($id) . '" ';
	return '<div itemprop="image" itemscope itemtype="https://schema.org/ImageObject" ' . $id . 'class="wp-caption ' . esc_attr($align) . '" style="width: ' . (10 + (int) $width) . 'px">' . do_shortcode( $content ) . '<p class="wp-caption-text">' . $caption . '</p></div>';
}




function micro_image($content) {
$ar_mk = '!<img (.*?) src="(.*?)" alt="(.*?)" width="(.*?)" height="(.*?)" (.*?)/>!si';
$br_mk = '<span itemprop="image" itemscope itemtype="https://schema.org/ImageObject"><img itemprop="url" itemprop="contentUrl" \\1 src="\\2" alt="\\3" width="\\4" height="\\5" url="\\2"\\6/><meta itemprop="width" content="\\4"><meta itemprop="height" content="\\5">
			<meta itemprop="description" content="\\3">
			<meta itemprop="name" content="\\3">
			<meta itemprop="caption" content="\\3">
		</span>
';
$content = preg_replace($ar_mk, $br_mk, $content); 
 return $content; 
}
add_filter('the_content', 'micro_image');
add_filter('img_caption_shortcode', 'micro_images_captions', 10, 3);
//микроразметка изображений
?>

немного модернизировал, теперь выдает ошибки по url и почему то только на двух изображений из 4

можно вот так сделать:

<?php
$br_mk = '<span itemprop="image" itemscope itemtype="https://schema.org/ImageObject"><img itemprop="contentUrl" \\1 src="\\2" alt="\\3" width="\\4" height="\\5" url="\\2"\\6/><meta itemprop="url" content="\\2"><meta itemprop="width" content="\\4"><meta itemprop="height" content="\\5"> <meta itemprop="description" content="\\3"> <meta itemprop="name" content="\\3"> <meta itemprop="caption" content="\\3"> </span> ';

?>

добавил

<meta itemprop="url" content="\\2">

Сайт упал.
Parse error: syntax error, unexpected ‘the_content’ (T_STRING) in /home/users/k/kazinsergey/domains/apple-pnz.com/wp-content/themes/rowling/functions.php on line 415На сайте возникла критическая ошибка.

а куда вы добавили этот код?

<meta itemprop="url" content="\\2">

функция срабатывает через раз. Два изображения прошли – два нет

http://apple-pnz.com/iphone/iphone-6s/novoe-postuplenie-tovara-apple-iphone.html



https://search.google.com/structured-data/testing-tool#url=http%3A%2F%2Fapple-pnz.com%2Fiphone%2Fiphone-6s%2Fnovoe-postuplenie-tovara-apple-iphone.html

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

еще яндекс ругается
ПРЕДУПРЕЖДЕНИЕ: Не выполнено обязательное условие для передачи данных в Яндекс.Картинки: поле contentUrl или image или thumbnail отсутствует или пусто

ОШИБКА: В свойстве content тега meta не может содержаться ссылка

вот тут:
https://search.google.com/structured-data/testing-tool#url=http%3A%2F%2Fapple-pnz.com%2Fiphone%2Fiphone-6s%2Fnovoe-postuplenie-tovara-apple-iphone.html

но на страницах с ошибками кликаете на Articles и смотрите какие ошибки показывает валидатор. он укажет чего именно ему не хватает

Гугл не ругается, вот красные блоки он нормально разметил, а зеленые не до конца

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

в том то и дело, что старая версия их нормально размечает. Дело именно в самой функции.

тогда я не понял изначальной задачи ?‍♂️

Изначально функция микроразметки размечает только ссылку на картинку и ее размеры, а нужно чтобы еще описание, название и т.д.

Сейчас если несколько картинок на странице она размечает через раз, а если одна, то выдает ошибку

вот в этом ответе я вам описал порядок действий, который надо сделать, чтоб всё было в порядке

Понял. А сколько будет стоить заказать данную услугу у Вас?

напишите нам сюда
https://t.me/wprobots

Anonymous
Отправить
Ответ на: