hi guys and girls, i have a problem i can’t seem to solve, no matter how much i try (many hours)…
(about sharing my read-only link: since i started a company with a specific -relatively rare- name in my language, i wouldn’t want customers noticing my company’s name in the link when they do a google search (together with my profile and all my other posts), is that possible or is there a solution to this so that i can share the read-only link if that would be necessary, be it in a more private setting/solution?)
the problem:
getting facebook to share the right Open Graph card when someone shares my facebook Page
what works:
the card description and title are as they should be when shared
what doesn’t work:
the Open Graph image doesn’t work when someone shares my Page on facebook…
…although in the OG settings panel of my home page, the OG card looks as it should, this includes the OG image…
…also, on facebook, when i do a “test-post” (as explained on the OG pages of the webflow documentation, which is; filling in a post with the url of my site and seeing what loads in facebook, without posting) then it also loads as it should…
so in short; everything works everywhere, except the OG image when my facebook Page is shared…
this is a list of all the things i tried (bear in mind, it’s the first time for me learning about Open Graph and i’m not a coder):
-i tried both a larger image and then a smaller image of 1281 x 671px (122kb), with an aspect ratio of 1.90909:1 (close to the mentioned minimum size of 1200px by 630px and the mentioned 1.91:1 aspect ratio) which i uploaded in the webflow image browser, then i opened the image in my internetbrowser (safari) and copied the url to paste in the OG settings panel of my home page under “OG Image URL”
-in the OG panel of my home page i also filled in the OG title and the OG description by checking the “Same as SEO Title Tag” and the “Same as SEO Meta Description” boxes
-by now the OG Preview in the OG settings panel looked good and exactly as it should
-then i went to the facebook sharing debugger and scraped a few times until the link preview was right
-then i went to facebook and tried everything a few times, waited (sometimes for 10 minutes, other times for a few hours), but the image wouldn’t load when the Page was shared
-then i went back to the debugger and having read al sorts of “solutions” i did something about the debugger warnings, which were:
“The following required properties are missing: og:url, og:type, fb:app_id”
in order to try to remove the warnings, i pasted custom code in the head of my home page, this is what i pasted:
<link rel="canonical" href="https://www.mysite.com/“ />
<meta property="og:image:width" content="1281" />
<meta property="og:image:height" content="671" />
<meta property="og:url" content="https://www.mysite.com/“ />
<meta property="og:type" content="website" />
<meta property="og:image" content="https://uploads-ssl.webflow.com/myimageurl.jpg" />
-then i went to the debugger again and the warnings were gone, except for the fb:app_id (“The following required properties are missing: fb:app_id”) which i don’t have
-then i scraped again, went to facebook, waited, tested, waited, went back to scrape (and so on…)
and yet, it doesn’t work and i really don’t know what more i can do to make this work, it would be great if someone can help me with this as i can’t invite people to share my Page when there is no decent share including an image, thank you for looking into this