如何在“单页”上的社交共享按钮上使用元标记

Question

I got a wordpress "single-page" with different posts on it, that doesnt need to reload. A post is loaded in when you click on a post name without reloading the whole page.

All posts have a individual ID & subURL though. Each post also has share buttons for facebook, twitter, google+, linkedin and xing.

I want to provide the shares with the information about the individual post the user wants to share, for example ID, image, some text content and so on.

This is what my share buttons look like atm:

    <div class="share-twitter"> 
<a href="https://twitter.com/share?url=http://example.de/%23/?p=<?php the_id();?>/<?php the_title();?>" class="twitter-share-button" target="_blank"><img src="exampleimg.jpg"></a>
 </div> 

Now I read in another article here on stackoverflow that i should use meta tags to give them the information.

This is how i tried to do this:

<!-- for Google -->
<meta name="description" content="<?php the_content();?>" />
<meta name="keywords" content="app" />

<meta name="author" content="<?php the_author();?>" />
<meta name="copyright" content="corporate name" />
<meta name="application-name" content="<?php the_title();?>" />

<!-- for Facebook -->          
<meta property="og:title" content="<?php the_title();?>" />
<meta property="og:type" content="article" />
<meta property="og:image" content="imgexample.png" />
<meta property="og:url" content="http://example.de/%23/?p=<?php the_id();?>/<?php the_title();?>" />
<meta property="og:description" content="<?php the_content();?>" />

<!-- for Twitter -->          
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="<?php the_title();?>" />
<meta name="twitter:description" content="<?php the_content();?>" />
<meta name="twitter:image" content="imgexample.png" />

Well, my actual problem now is that the meta tags I added change nothing. the link URL is provided correctly as before, cause i already do this with href, but it still uses a random img of the page, no content provided or anything else I provided over the meta tags...

Any clues why this doesnt work?

Answer 1

Try this:

<php if(is_single()) { ?>
  <meta property="og:image" content="<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), '' ); ?>" />
<?php } else { ?>
  <meta property="og:image" content="imgexample.png" />