How to successfully implement og:image for the LinkedIn

前端 未结 13 2680
陌清茗
陌清茗 2020-12-25 10:36

THE PROBLEM:

  • I am trying, without much success, to implement open graph image on site: http://www.guarenty-group.com/cz/
  • The homepage
相关标签:
13条回答
  • 2020-12-25 10:58

    In my case I did exactly this and it worked fine (on my page of course).

    Put these four lines in the head:

    <title> aanalytics </title>
    <meta data-react-helmet="true" property="og:image" content="/photos/s5.jpg">
    <meta data-react-helmet="true" property="og:type" content="website">
    <meta data-react-helmet="true" property="og:url" content="https://www.aanalytics.de">
    

    BUT, pay attention that if you have more than one head in your page, these lines need to be inserted in the first head otherwise it will not work.

    I also had prefix="og: http://ogp.me/ns#” in the html

    0 讨论(0)
  • 2020-12-25 11:01

    After researching for a day, I found that meta tag with attribute property should be used instead of name.

    <!doctype html>
    <html prefix="og: http://ogp.me/ns#">
    <head>
         <meta property="og:type" content="website" />
         ...
    

    Ref: https://ogp.me/

    0 讨论(0)
  • 2020-12-25 11:07

    This may be a bit late for the OP, but there is new documentation at https://www.linkedin.com/help/linkedin/answer/46687/making-your-website-shareable-on-linkedin. Hopefully this helps others.

    0 讨论(0)
  • 2020-12-25 11:08

    Just a little late lol,

    But I came across this exact issue, figured out that linkedIn was pulling the meta tags from the final landing page.

    My website that i was trying to link to had an instant redirect, adding the og tags to the page where it was redirected to fixed the issue.

    0 讨论(0)
  • 2020-12-25 11:10

    I got it finally working by adding the full image path:

    <meta name="image" property="og:image" content="https://hasan.life/images/preview.png">

    0 讨论(0)
  • 2020-12-25 11:11

    Make sure your og: tags are part of the head tag.


    I ran into this recently, spent a huge amount of time working on it with all the types of solutions above. I was working with someone else's HTML and finally figured out that the html was simply missing the head tag, while it did have the closing tag for head.

    Linked In is apparently not scanning page text for the og tags, but processing the page dom, and if the dom objects aren't properly coded, they won't process. If you have issues with unmatched tags or unclosed tags, this could be your issue if everything else is not working.

    I did not need to add prefix to the meta tags or add og image height and width tags once the html was fixed. Linked In processed it fine once the html was fixed.

    0 讨论(0)
提交回复
热议问题