I have searched through a number of similar posts and most seem to be asking how to change their thumbnail...I'm not even getting as far as that.
I have the following meta information in my :
<meta property="og:title" content="MyWebsite"/>
<meta property="og:type" content="company"/>
<meta property="og:url" content="http://www.myWebsite.com/"/>
<meta property="og:image" content="http://www.myWebsite.com/images/logo.jpg"/>
<meta property="og:description"
content="MyWebsite is brilliant."/>
When I attempt to paste http://www.MyWebsite.com into a Facebook status update, it is correctly displaying the description, but it is not pulling the image.
I have used the Facebook Debugger/Linter and it is pulling everything correctly...so where is the disjoint? I have tried different browsers and still no thumbnail.
One thing I have noticed is that if I validate my website with W3C it is saying that "property" is not allowed as an attribute. Is this normal?
Are there dimensions for the logo? Mine is roughly 574px by 187px.
Use the debug tool as the administrator of your application (set the app_id OG tags to help with this). If you are the app administrator, the debug tool should reset the cache and pickup the new image when sharing on Facebook.
Related
I'm using Graph API JS SDK v2.11 and trying to share a link from my website to my Facebook profile. Now, I'm facing the same problem that Facebook has already mentioned here (Please search Pre-caching images):
I just can't see image in dialogue preview on first click. (Although image is shared successfully in my profile)
On second click, it is rendered fine. I have provided all necessary meta tags including og:image, og:image:width, og:image:height (according to width and heights of my images) but still it's not working!
I just can't understand why it's not working! I read same solutions on other similar questions but nothing is working. Can it be because of different origins (The image link has a sub domain)? Does anybody have any idea about it?
Here's markup for meta tags:
<meta property="og:url" content="https://www.example.com/views/1103/your-facebook-profile-picture-popularity/1522777597_5ac3bdfd8c524">
<meta property="og:type" content="website">
<meta property="og:title" content="Know about your Facebook profile picture popularity">
<meta property="og:description" content="Example has a collection of latest fun apps. Know how much your Facebook friends care about you and find out your profile picture popularity.">
<meta property="og:image" content="https://api.example.com/v1/app/images/img_1522777597_5ac8hdfd8c524.jpg">
<meta property="fb:app_id" content="1848969382006870">
<meta property="og:image:width" content="660">
<meta property="og:image:height" content="560">
Image dimensions are: Width 660px, Height: 560px
Image is visible to public (i.e., has all necessary permissions to others)
PS: I can pre-cache the image with the Facebook's Sharing Debugger, but the images are generated dynamically, so it's not possible to do it manually.
Working on a site that contains OpenGraph tags. However, when trying to share one of those pages, the Facebook preview isn't populating properly:
For example: https://www.hkinsurance.com/2018/03/noise-reduction-restaurant/
OG Tags:
<meta property="og:locale" content="en_US"/>
<meta property="og:site_name" content="H&K Insurance"/>
<meta property="og:title" content="Noise Reduction for Your Restaurant - H&K Insurance"/>
<meta property="og:url" content="https://www.hkinsurance.com/2018/03/noise-reduction-restaurant/"/>
<meta property="og:type" content="article"/>
<meta property="og:description" content="Reducing noise is key to maintaining ambiance in your restaurant. Learn about noise reduction techniques on our blog. Call 617-612-6515 to evaluate your insurance coverages."/>
You need to enter your page url and click Scrape Again button in the next page.
https://developers.facebook.com/tools/debug/
If this doesn't help maybe you don't have property requirements for og tags.
Check out this: https://developers.facebook.com/docs/sharing/best-practices
For og:image if you changed image for same url, sometimes facebook caching the image and Scrape button doesn't work. You have two options: wait until facebook cleans its cache or change image name and og:image propery path for the new image and Scrape Again.
After a lot of confusion, I discovered that my file was in UTF-16 format, not UTF-8. As soon as I converted it, everything worked.
Alright so I have set my meta tags exactly how it says on the facebook developer page, and the scraper even shows the data that will be showed to be correct, but when using the facebook share button on my website http://www.etdigitaldesign.com/, all that it shares is the website url, it doesn't include any of the information from the meta tags, that the scraper says it should. No site name, no description, no image. just the website URL.
This is really confusing to me because the scraper says the share button should be showing the proper info, and I'm using a copy/pasted code snippet from the fb developers page, so I can't see what my error could possibly be...
here is what the scraper shows:image at http://i.imgur.com/zNIyhfg.png since I can't post images yet.
and here's my meta code:
<meta property="og:url" content="http://www.etdigitaldesign.com" />
<meta property="og:type" content="website" />
<meta property="og:title" content="ET Digital Design" />
<meta property="og:description" content="Currently doing a grand opening special, making several free websites to get my name out there. Visit the site if you are interested!" />
<meta property="og:image" content="http://www.etdigitaldesign.com/images/etlogobig.png" />
All facebook's examples have self-closing meta tags, so try that and then re-scrape, if that still doesn't work add a fake parameter eg http://example.com/?20 and scape
At the moment the title and image are showing, just not the description. It shows HHTP status 206,which is partial content, but that's not a problem
i'm facing a problem with sharing links on facebook which is displaying the wrong image many times and just sometimes it displays the correct image using the code like this
<meta property="og:title" content="webpage title" />
<meta property="og:url" content="http://www.domain.com/webpage_url.php?id=17515278817738945084phb">
<meta property="fb:app_id" content="app id here"/>
<meta property="og:type" content="website" />
<meta property="og:image" content="http://www.domain.com/large/image.jpg" />
and when debugging the page i get this
The 'og:type' property is required, but not present.
this image is 1000*317px and still not showing up. this happens with all the links of my site. I have to go to url debugger and clear the cache so facebook can get the correct image. so how to fix this problem and make facebook display the correct image directly?
[UPDATE]
using the facebook debugger i get this notice
og:image was not defined, could not be downloaded or was not big enough. Please define a
chosen image using the og:image metatag, and use an image that's at least 200x200px and
is accessible from Facebook. Image 'http://www.domain.com/gallery1/01234.jpg' will
be used instead.
But the og:image is set properly and image size is largr than 200*200 and Facebook displays the correct image after clearing the Facebook cache though it keeps displaying this notice
Try pointing to your index file. eg www.yourdomain.com/index.php when using the facebook object debugger. It fixed the og:name error for me.
I've a web page and I want to share it in facebook but the image shown is not ok.
In the HTML code of the web I have:
<link href="http://www.example.com/img/logo2.png" rel="image_src" />
In the options to select the image, there are other images, but not logo2.png
I've tried to delete facebook cache with facebook debugger, but the result is the same.
Edit:
If I add ?v=1 to the end the URL when I share it, the logo option is shown. It means that facebook debugger is not deleting the cache.
Also, I want that the logo image be the first option.
Can you help me?
Solved:
<!-- facebook tags -->
<meta property="og:image" content="http://www.example.com/img/logo.png"/>
<meta property="og:url" content="http://example.com">
<meta property="og:title" content="Portfolio | web">
<meta property="og:description" content="Portfolio">
I think that you may be using the wrong tag. I haven't done this in a while, but I believe that it should be a <meta tag with a property="og:image" and then content set to your image. The following (really old) question addresses this issue/conforms to what I remember: How does Facebook Sharer select Images and other metadata when sharing my URL?
Let me know if it works :)