Html – How to successfully implement og:image for the LinkedIn

facebook-opengraphhtmllinkedinshare

THE PROBLEM:

  • I am trying, without much success, to implement open graph image on site: http://www.guarenty-group.com/cz/
  • The homepage is completeply bypassing the og:image tag, where internal pages are reading all images from the site and place og:image as the last option.
  • Other social networks are working fine on both internal pages and homepage.

THE CONFIGURATION:

  • I have no share buttons or alike, all I want is to be able to share the link via my profile.
  • The image is well over 300x300px: http://guarenty-group.com/img/gg_seal.png
  • Here is how my head tag looks like:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title>Guarenty Group : Pojištění pro nájemce a pronajímatelé</title>
    
            <meta name="keywords" content="" />
            <meta name="description" content="Guarenty Group pojišťuje příjem z nájmu pronajímatelům, kauci nájemcům - aby nemuseli platit velkou částku v hotovostí předem - a dále nájemcům pojišťuje příjmy, aby měli na nájem při nemoci, úrazu či nezaměstnání." />
            <meta name="image_src" content="http://guarenty-group.com/img/gg_seal.png" />
            <meta name="image_url" content="http://guarenty-group.com/img/gg_seal.png" />
    
            <meta property="og:title" content="Pojištění pro nájemce a pronajímatelé" />
            <meta property="og:url" content="http://guarenty-group.com/cz/" />
            <meta property="og:image" content="http://guarenty-group.com/img/gg_seal.png" />
            <meta property="og:description" content="Guarenty Group pojišťuje příjem z nájmu pronajímatelům, kauci nájemcům - aby nemuseli platit velkou částku v hotovostí předem - a dále nájemcům pojišťuje příjmy, aby měli na nájem při nemoci, úrazu či nezaměstnání [...]" />
            ...
    </head>
    

THE TESTING RESULTS:

In order to trick the cache i have tested the site with http://www.guarenty-group.com/cz/?try=N, where I have changed the N every time. The strange thing is that images found for different value of N is different. Sometimes there is no image, sometimes there is 1, 2 or 3 images, but each time there is a different set of images.
But, in any case I could not find the image specified in the og:graph!


MY QUESTIONS:

  1. https://developer.linkedin.com/documents/setting-display-tags-shares is saying one thing, and the personnel on the support forum is saying "over 300" Does anyone know What is the official minimum dimension of the image (both w and h)?
  2. Can an image be too large?
  3. Should I use the xmlns, should I not use xmlns or it doesn't matter?
  4. What are the maximum (and minimum) lengths for og:title and og:description tags?

Any other suggestion is of course welcomed 🙂

Thanks in advance, cheers~

Best Solution

This answer I found on LinkedIn forums might be of help to you:

Guys, I've spent a whole day trying different things. What worked for me is using the mata [sic] tags as following:

<meta prefix="og: http://ogp.me/ns#" property="og:title" content="{Your content}" />
<meta prefix="og: http://ogp.me/ns#" property="og:type" content="{Your content}" />
<meta prefix="og: http://ogp.me/ns#" property="og:image" content="{Your content}" />
<meta prefix="og: http://ogp.me/ns#" property="og:url" content="{Your content}" />

Just try to add prefix to every tag (not to html tag), then re-sign in with your LI account to clear the cache... Post your results.