Upset.
I have just spent four hours to figure out how to put an image preview for URLs linking to custom web pages which you put on LinkedIn profile pages. You know, those links added as media.
- First, you have to add Open Graph meta tags to your website. Just put those meta tags as shown below in the
<head>html tag:Don’t forget to modify content attributes value! I think LinkedIn only needs a few meta tags from what is in the example code but testing how LinkedIn crawls my website is just a pain in the ass.
- VERY IMPORTANT: It seems the LinkedIn crawler needs the webpage to have at least one
<article>tag to work with. Or else, the crawler will crash and you will get this error message:Sorry, there was a problem processing your request. Please try again.
- Before adding your link to LinkedIn, check if open graph tags are properly set by following this link and log in: Open Graph Debugger. Facebook should find the Open Graph tags when you put your URL and click “Fetch new scrape information”. If not, check your code.
- Then, you can put your link on LinkedIn.
If you want to make changes to your image, you will have to deal with the LinkedIn caching system. This system keeps the Open Graph data and associates it with the URL you provided on LinkedIn. So you will have to workaround this system by adding extra unused query string to use a new URL. For example, if the pointed page can be accessed at http://example.com, you can use those alternatives:
http://example.com/index.html http://example.com/index.html?a=1 http://example.com/index.html?a=2 http://example.com/index.html?linkedin=wtf etc...
Pretty complex, isn’t it? Okay, it’s time to close my 40 browser tabs and get some sleep now. ^^’