Search code examples
htmlskype

How to make Skype-friendly links (preview image tags)


Sharing certain links on Skype triggers the program to show preview with image from the page. On a website I work on - there are big images on certain pages but Skype picks up the logo of the website instead. I was unable to find what meta tags would make Skype pick up the intended image and preview it.

I have a <link rel="image_src" href="http://www.example.com/path/to/img.png" /> that works for Facebook-sharing preview (img.png is used instead of the logo of the website) but doesn't work for Skype.

So how would you hint Skype which image should be used for preview?


Solution

  • I will need to find some source to support this, but I think that if you have defined some open graph meta data, it will pick the image specified in there. For example, I have these in one of my sites:

    <meta property="og:title" content="Site Title" />
    <meta property="og:type" content="website" />
    <meta property="og:url" content="http://my.site.com" />
    <meta property="og:image" content="http://my.site.com/images/thumb.png" />
    <meta property="og:description" content="Site description" />
    

    And the image displayed as the link preview on Skype is the thumb image specified in og:image (that is not available anywhere else on the page).