Default website image for social sharing
Set an og:image in the <head> of your HTML document like this:
<meta property="og:image" content="http://example.com/ogp.jpg" />
This is part of the Open Graph Protocol, respected by at least the following social media sites:
- Facebook (see https://developers.facebook.com/docs/sharing/webmasters/#images)
- Twitter (see https://dev.twitter.com/cards/getting-started#opengraph)
- LinkedIn (see https://developer.linkedin.com/docs/share-on-linkedin)
- Google+ (see https://developers.google.com/+/web/snippet/)
- Pinterest (see https://developers.pinterest.com/docs/rich-pins/reference/)
(... and probably plenty more besides.)
In addition to setting the tag above, you may also want to:
- Clear the social media platform's cached version of your page's image (e.g. by using the platform's developer tools), so that you can see the change reflected immediately. For example, you can do this for Facebook, at https://developers.facebook.com/tools/debug/
- Add additional "structured properties" to specify things like the image's width or height, using the syntax described at http://ogp.me/#structured. This is described as a "best practice" by Facebook at https://developers.facebook.com/docs/sharing/best-practices#images.
You need to set the open graph image meta tag:
<meta property="og:image" content="http://example.com/logo.jpg">
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="1024">
<meta property="og:image:height" content="1024">
For more info check the docs