I have a website. When anyone shares a link of my website(manually and not by Graph API), an incorrect image is being displayed rather than the logo of my website. Please tell me how to display the logo correctly. Is there a meta tag or something like that to do that thing...Please help me...
There is a special meta property for displaying the correct image. Some of them are as follows :-
<meta property="og:title" content="Your title" />
<meta property="og:url" content="http://example.com/url?dynamic=0 />
<meta property="og:image" content="http://example.com/your-logo.png" />
You can find every detail at the Open Graph Website
Related
Just wondering what HTML5 element is shown as the image for a Facebook post which contains a preview of the URL mentioned in the post?
I want to post a link to my website and have my logo appear in the image box of the URL preview...
Hopefully my question makes sense.
You can achieve that by adding Facebook specific OpenGraph meta tags in the header of your webpage.
Here are the meta tags you need to add
<meta property="og:url" content="WEBSITE LINK" />
<meta property="og:type" content="article" />
<meta property="og:title" content="IT WILL APPEAR IN BIG FONTS" />
<meta property="og:description" content="THIS WILL BE SUBTEXT" />
<meta property="og:image" content="LINK OF THE IMAGE" />
you can check out meta tags in details here
Also to verify how it will look and what actually Facebook sees through meta tags you can go to the Open Graph Object Debugger
Example shows what will be seen once you try to share https://images.google.com
Hope this is what you are looking for.
This Facebook post https://www.facebook.com/damnlolcom/posts/812448255487528 looks like a photo post but is actually link, it clicks through to an external site.
I have tried sharing a link, removing all og metatags from my site except image path but it doesn't look like that.
The closest I can get is the default link behaviour without any title description, so just an image with the url besides/below rather than displayed over the top of the bottom of the image.
So what sort of post is this?
Thanks for any help.
Check out the url in linter .
raw tags found on page
Meta Tag <meta property="fb:app_id" content="172220699476208" />
Meta Tag <meta property="og:site_name" content="Damn! LOL" />
Meta Tag <meta property="og:title" content="Turns Out My Friend's Mom Is A Racist" />
Meta Tag <meta property="og:description" content="Click for your daily dose..." />
Meta Tag <meta property="og:url" content="http://www.damnlol.com/turns-out-my-friends-mom-is-a-racist-47206.html" />
Meta Tag <meta property="og:image" content="http://www.damnlol.com/pics/998/d6c09d2cc01d04bc5e47483e85774aee.jpg" />
Meta Tag <meta property="og:type" content="article" />
Everything looks normal here . They are not using anything special . It is just facebook presents links in slightly different designs on feed on different times .
ps : try setting property="og:type" content="article"
I'd like to add open graph meta data to my site such that links of my site look like the Anthropologie post below, but instead I'm getting a smaller image with text on the right like the Etsy post above it.
These are the open graph tags I'm providing:
<meta property="og:type" content="article" />
<meta property="og:title" content="{{the title of my page}}" />
<meta property="og:description" content="{{the description}}" />
<meta property="og:image" content="{{ the image url}}" />
Should I be using a different type? Or is there another opengraph tag I need to provide to get the bigger image to display?
The Etsy's post you have shown is a feed,
and the Anthropologie's post you've shown is a photo
Understand the difference between the two.
I have followed the official steps from Facebook to create my Like button, pointing to my Facebook page. But when clicking on the Like button to post to my Facebook wall, there is not photo being shown.
I have used the suggested meta tags, still no hope. Any advice is appreciated!
Edited:
The facebook popup is:
And have used the following meta tags:
<meta property="og:title" content="sample title" />
<meta property="og:type" content="product" />
<meta property="og:url" content="https://www.facebook.com/mypagename" />
<meta property="og:image" content="http://www.mydomain.com/images/productimage.jpg" />
<meta property="og:site_name" content="sitename" />
<meta property="fb:admins" content="123456789" />
Another example of this issue, when I use this:
https://developers.facebook.com/docs/reference/plugins/like/
to generate the Like button, for
1. https://www.facebook.com/google - I will see the all the information like title, URL, description, and the image.
2. https://www.facebook.com/KFC - There isn't any information being displayed. This is exactly the same issue as I am facing.
Please advice.
regards
For Facebook pages, you should use the Like Box plugin (as opposed to the Like plugin) as it is designed specifically for liking pages. It has more features aimed specifically for pages. See: https://developers.facebook.com/docs/reference/plugins/like-box/
I'm using the Facebook head tags to generate specific title, description and images when they want to share a link in their Facebook page, it looks like this:
<meta property="og:title" content="title" />
<meta property="og:description" content="description" />
<meta property="og:image" content="thumbnail_image" />
But if I try to share my link it doesn't pick them up, it just shows the default info. If I look in the source code the meta tags are formatted correctly so I'm not sure what am I doing wrong.
Thanks in advance!
Try the Facebook Debugger to see what's wrong with your page:
http://developers.facebook.com/tools/debug