• Resolved jamminjames

    (@jamminjames)


    I’m using a function added to my child theme’s function.php file for the purpose of adding the Post Avatar image to Facebook’s required meta property og:image list in the url.

    The code was suggested in this forum exchange, and I used it and it worked. However, I just noticed that when there is no Post Avatar on the page, it leaves a line like this:

    <meta property=”og:image” content=””/>

    …and Facebook doesn’t like that. Their debugger says:

    Errors That Must Be Fixed
    Object Missing a Required Value Object at URL ‘http://www.humortimes.com/34003/humor-times-founder-editor-to-appear-on-radio-paralax-show-april-2nd/&#8217; of type ‘article’ is invalid because a required property ‘og:image:url’ of type ‘url’ was not provided.

    What can I do to address this? Can I add an ‘else’ statement to the function, so that if there is no avatar, there’s a default image to use?

    https://wordpress.org/plugins/post-avatar/

Viewing 15 replies - 1 through 15 (of 32 total)
  • Plugin Author Vicky Arulsingam

    (@garinungkadol)

    You can check to see if the avatar array has a null value and display a default url

    e.g.

    if( is_single() ){
         $avatar_array = gkl_get_postavatar($post); 		
    
         If( isnull( $ avatar_array ) ) {
                $og_image = '<meta property="og:image" content="default url here" />';
         } else {
                 $og_image = '<meta property="og:image" content="' . esc_url( $avatar_array['avatar_url'] ) . '" />' . "\n";
         }
    }

    Thread Starter jamminjames

    (@jamminjames)

    Thanks. Sorry for sounding like the novice that I am, but should I leave the other ‘if’ statement in there? And if so, it seems like that first one is missing brackets, now that I look at it closer. Also, should the second and third ‘if’s be ‘elseif’?

    Here’s the whole thing as I have it, with your part added:

    // Below to add Post Avatar image to og image for Facebook shares
    add_action( 'wpseo_opengraph', 'gklpa_ogimage', 99 );
    function gklpa_ogimage(){
    	global $post;
    	$og_image = '';
    	if( has_post_thumbnail( $post->ID ) )
    		return;
    	if( is_single() ){
    		$avatar_array = gkl_get_postavatar($post);
        if( isnull( $ avatar_array ) ) {
                $og_image = '<meta property="og:image" content="default url here" />';
    	}
    	else {
                 $og_image = '<meta property="og:image" content="' . esc_url( $avatar_array['avatar_url'] ) . '" />' . "\n";
    	}
    }
    	echo $og_image;
    }
    Plugin Author Vicky Arulsingam

    (@garinungkadol)

    This is how the code should look.

    add_action( 'wpseo_opengraph', 'gklpa_ogimage', 99 );
    function gklpa_ogimage(){
    	global $post;
    	$og_image = '';
    
    	// featured image exists, no need to proceed
    	if( has_post_thumbnail( $post->ID ) )
    		return;
    
    	// Only display on the post itself
    	if( is_single() ){
    		$avatar_array = gkl_get_postavatar($post);
    
    		// If there's not post avatar set a default image
    		if( isnull( $ avatar_array ) ) {
                       $og_image = '<meta property="og:image" content="default url here" />';
    		} else {
                       $og_image = '<meta property="og:image" content="' . esc_url( $avatar_array['avatar_url'] ) . '" />' . "\n";
    		}
    
    	}
    	echo $og_image;
    }

    Thread Starter jamminjames

    (@jamminjames)

    It didn’t like that, got a blank white page, couldn’t access the site until I replaced the file via FTP. All I did was plug in the default image url:

    add_action( 'wpseo_opengraph', 'gklpa_ogimage', 99 );
    function gklpa_ogimage(){
    	global $post;
    	$og_image = '';
    
    	// featured image exists, no need to proceed
    	if( has_post_thumbnail( $post->ID ) )
    		return;
    
    	// Only display on the post itself
    	if( is_single() ){
    		$avatar_array = gkl_get_postavatar($post);
    
    		// If there's not post avatar set a default image
    		if( isnull( $ avatar_array ) ) {
                       $og_image = '<meta property="og:image" content="http://www.humortimes.com/wp-content/uploads/images1/HT-cover.jpg" />';
    		} else {
                       $og_image = '<meta property="og:image" content="' . esc_url( $avatar_array['avatar_url'] ) . '" />' . "\n";
    		}
    
    	}
    	echo $og_image;
    }
    Plugin Author Vicky Arulsingam

    (@garinungkadol)

    Sorry about that.

    There shouldn’t be a space between the $ and avatar_array

    add_action( 'wpseo_opengraph', 'gklpa_ogimage', 99 );
    function gklpa_ogimage(){
    	global $post;
    	$og_image = '';
    
    	// featured image exists, no need to proceed
    	if( has_post_thumbnail( $post->ID ) )
    		return;
    
    	// Only display on the post itself
    	if( is_single() ){
    		$avatar_array = gkl_get_postavatar($post);
    
    		// If there's not post avatar set a default image
    		if( isnull( $avatar_array ) ) {
                       $og_image = '<meta property="og:image" content="default url here" />';
    		} else {
                       $og_image = '<meta property="og:image" content="' . esc_url( $avatar_array['avatar_url'] ) . '" />' . "\n";
    		}
    
    	}
    	echo $og_image;
    }
    Thread Starter jamminjames

    (@jamminjames)

    Okay, thanks so much for your help. Now, whole the site isn’t turning blank — but just post pages, with or without a Post Avatar image, are blank. Pages are okay.

    What does

    content=”‘ . esc_url( $avatar_array[‘avatar_url’] ) . ‘”

    look for, a default avatar? If so, where would you set that?

    Plugin Author Vicky Arulsingam

    (@garinungkadol)

    That bit is to display the post avatar if it exists.

    You’ll need to change the bit of code isnull( to is_null(
    I forgot to put in the underscore.

    This is what I get for writing code on my phone. 🙂

    Thread Starter jamminjames

    (@jamminjames)

    You’re awesome! That did it, thank you so much.

    I would recommend adding that to Post Avatars basic code, as I would think everyone would want the avatar image available for FB shares, if the author photo is the only one on the page.

    You seem to be so good at coding, can I ask you a question unrelated to Post Avatar?

    It’s a very similar problem – I can’t seem to get images to be picked up for the website’s RSS feed. I’ve found something that’s supposed to help, but it’s not working. It may be due to the fact that I’m using WordPress SEO’s feed settings. The code I’m using in the function.php file is:

    // Below to add image to RSS feed. medium can be replaced with: thumbnail
    add_filter( 'the_content', 'featured_image_in_feed' );
    function featured_image_in_feed( $content ) {
     global $post;
     if( is_feed() ) {
      if ( has_post_thumbnail( $post->ID ) ){
      $output = get_the_post_thumbnail( $post->ID, 'medium', array( 'style' => 'float:right; margin:0 0 10px 10px;' ) );
      $content = $output . $content;
      }
     }
    return $content;
    }
    Thread Starter jamminjames

    (@jamminjames)

    I’m not sure, but this new code you helped me with seems to be causing a problem with posts that do not have post avatars. It seems that when using the share buttons on the site (AddtoAny), the main image is no longer an option, it just goes straight to the default image. Before using this code, the main image (not used as ‘featured image’, but it’s the only image in the post) was always picked up when using the FB share button.

    It does show up if I copy & paste the article’s url directly into a FB post, however.

    Perhaps it’s overriding the WordPress SEO by Yoast settings, because of the ’99’ value? Can I somehow add the post’s main image into this code?

    I would rather not have to designate each image as the ‘featured post,’ as it’s an extra step, and I didn’t have to do that before.

    Plugin Author Vicky Arulsingam

    (@garinungkadol)

    Is the Add to Any button different from the WordPress SEO plugin?

    If I understand correctly, on posts without avatars, you want the main image (part of the post content) to show up on the link instead of the default?

    Because in the current code setup which image will be shown follows this heirarchy:

    Featured Image
    Post Avatar
    Default Image

    Images that are part of the post content will not be taken into account.

    Can you give me further details on how you include images? Are they added from attachments in the Media Library or are they external images?

    Thread Starter jamminjames

    (@jamminjames)

    Add to Any just creates the share buttons, but it doesn’t choose the image to share, that’s determined by the Open Graph meta data, I believe.

    Yes, I’d like the attached image to show before the default image. The images are added via the Media Library.

    WordPress SEO adds the Open Graph meta data to the head, and includes a default image if the post/page being shared does not contain any images.

    In the hierarchy you show, would “Featured Image” include an image added via Media Library, even if it is not set as the Featured Image in the post? That’s what used to happen, automatically, but doesn’t seem to be happening now.

    Plugin Author Vicky Arulsingam

    (@garinungkadol)

    No, Featured Image refers to an image selected from the Media Library that you set as the “Featured Image”.

    I’ll look further into how WordPress SEO does it and make code revisions.

    Plugin Author Vicky Arulsingam

    (@garinungkadol)

    Does the open graph code all need to be together?

    e.g.

    <head>
    <meta property="og:title" content="Post Title" />
    <meta property="og:type" content="article" />
    <meta property="og:url" content="http://url/to/post/" />
    <meta property="og:image" content="http://url/to/post/avatar/image" />
    <!-- other meta content here -->
    </head>

    or can it be spread out
    e.g.

    <meta property="og:title" content="Post Title" />
    <meta property="og:type" content="article" />
    <meta property="og:url" content="http://url/to/post/" />
    <!-- other meta content here -->
    <meta property="og:image" content="http://url/to/post/avatar/image" />

    If the latter one is allowed you can change this:
    add_action( 'wpseo_opengraph', 'gklpa_ogimage', 99 );

    to

    add_action( 'wp_head', 'gklpa_ogimage', 99 );

    Thread Starter jamminjames

    (@jamminjames)

    It has to be in the <head> section, but I think that’s the only requirement. I’ll try your suggestion, thanks!

    Thread Starter jamminjames

    (@jamminjames)

    Seems to be working okay, but FB and Google+ still seem to want to grab the default image instead of either the attached image or the Post Avatar image. It seems the only exception is when the attached image is very large.

    All the images I use are over 200x200px, which is what FB says is the minimum they’ll use, so I don’t really understand it — it’s frustrating.

    Is there any way you know of that would give a higher priority to images other than the default?

Viewing 15 replies - 1 through 15 (of 32 total)
  • The topic ‘Problem with custom function that adds Post Avatar og:image’ is closed to new replies.