• I am currently installing schema code into the image tags and I am running into some trouble.

    I have got to a point where I can get the width and height to display correctly for the main header image, but because I have related images at the bottom of the post, it puts the wrong image size in those image tags.

    Is there a better way to do this? Any help is much appreciated.

    /* adds the schema width and height for image */
    function add_opening_span_before_img_tags_with_schema(){
    add_filter('post_thumbnail_html','add_big_beginning_to_thumbnail');
    function add_big_beginning_to_thumbnail($thumb) {
    $image_data = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), "entry-thumbnail cherry-thumb-l aligncenter large" );
    $image_width = $image_data[1];
    $image_height = $image_data[2];
    $feat_image_url = wp_get_attachment_url( get_post_thumbnail_id() );
    $thumb = str_replace('<img', '<span itemprop="image" itemscope itemtype="https://schema.org/ImageObject"><meta itemprop="width" content="' . $image_width . '" ><meta itemprop="height" content="' . $image_height . '"><meta itemprop="url" content="' . $feat_image_url . '"><img', $thumb);
    return $thumb;
    }
    }

    I am currently editing my functions.php file to get schema to be inserted into the various relevant sections of my page. And one of the sections is the <img> tag. on the blog post pages the header image at the top displays and I insert the schema into that <img> tag using the above code. But on that page I also have the relevant content images at the bottom of the post. The code above seems to be inserting the main image width and height schema into the relevant article images width and height as well. I think I am targeting the wrong function.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator bcworkz

    (@bcworkz)

    You have the right function, but are using the wrong $post->ID. The one you’re using relates to the current post’s featured image, which is inappropriate for the the images below. The filter hook actually can pass more useful data to your callback when requested, including the proper thumbnail ID for the image being processed. To make use of this data, replace the first 3 lines of the containing function with this:

    add_filter('post_thumbnail_html','add_big_beginning_to_thumbnail', 10, 5 );
    function add_big_beginning_to_thumbnail( $thumb, $post_id, $post_thumbnail_id, $size, $attr ) {
       $image_data = wp_get_attachment_image_src( $post_thumbnail_id, "entry-thumbnail cherry-thumb-l aligncenter large" );

    And after the image sizes are assigned, use this instead:
    $feat_image_url = wp_get_attachment_url( $post_thumbnail_id );

    Thread Starter schemaishard

    (@schemaishard)

    Hi bcworkz,

    Thanks for your help with this.
    Makes sense what you’re saying and I updated the code with your code. I think i’m getting closer.

    Unfortunately the simillar article images are still picking up the header image width and height tags. And googles schema tester shows the same height and width for the main header image and the simillar articles images. My simillar article images are only thumbnail sizes.

    I am starting to wonder if I shoud be looking at using an “if” statement to target only the header image

    Moderator bcworkz

    (@bcworkz)

    I see the problem now. Try this for the image src line:
    $image_data = wp_get_attachment_image_src( $post_thumbnail_id, $size );

    I focused on the problem I first identified and didn’t go looking for more. There was more ??

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘simillar article images display wrong meta data’ is closed to new replies.