Good day.

When we insert a link to a site in WYSIWYG editor of social networks, sometimes we get a preview of the site:

alt text

Can you please tell me how to optimize the code of your site in order to get its preview when inserted into WYSIWYG social media editors?

It seems to me, it's in the markup.

I have enough links to the article or technology names to google.

UPD: In the end, I figured out a few "permissions" of the semantic layout. I adapted the page in accordance with http://schema.org/ and http://ogp.me/ Also added the standard ones:

 <meta name="title" content="тайтл"> <meta name="description" content="дескрипшн"> 

Not sure what social sphere that grasps, but I think it will not be superfluous :). Facebook understands ogp. Vkontakte seems to be enough standard meta title and meta description.

Pitfalls: Facebook as a preview image needs a picture of at least 200x200 px.

klopp , void , thanks for the answers!

    2 answers 2

    As an option - you can take a screenshot, "write to the picture", and then substitute it with

     <meta property="og:image" content="http://www.site.ru/images/screen.jpg" />