How to share your website links with image in Linkedin

Elia Alonso — Wed, 15 Sep 2021 14:37:40 +0000

Few weeks ago, when I wanted to publish my App "El Mejorado Buscador de Rick y Morty" in Linkedin post, I found a problem: my website preview appeared without any image 😖. I had seen posts in which there were images, so I believed that it happened automatically; however, on second thought, it didn't make sense. How is going to decide the image that had to be shown in the preview? 🤦‍♀️

That's why I started to look for a solution. I discovered I had to write some meta tags in head to comply with necessary information for my website. These are:

<meta 
  property="og:title" 
  content="Title of the article" 
/>
<meta 
  property="og:description"
  content="Description that will show in the preview"
/>
<meta 
  property="og:image"
  content="//media.example.com/ 1234567.jpg"
/>
<meta 
  property="og:url"
  content="//www.example.com/URL of the article" 
/>

Image have to meet some requirements: 5MB max file size, 1200(w)x627(h) px, 1.91:1 ratio

After make this changes live, I tried again to preview my post on Linkedin; but it didn't work. The reason why is Linkedin is caching websites for seven days; fortunately there is a tool to clean this cache. You just have to go to "Linkedin post inspector", enter your website URL and click on "inspect" button. And that's all folks! 😜

Here is the result

DEV Community: Elia Alonso

How to share your website links with image in Linkedin