In core php how to share product title,image and description on social media? - share

In core php how to share product title, image and description on social media?
There are problem in sharing.
Sometime output with previous image or logo or unknown image.
https://www.facebook.com/sharer.php?u={url}
https://www.facebook.com/dialog/share?app_id={app_id}&display={page_type}&href={url}&redirect_uri={redirect_url}

In other for the social network to get the image, name and description you need to add some meta tags to your html page. for example.
<meta property="og:title" content="Title of the page">
<meta property="og:description" content="Some Description of it.">
<meta property="og:image" content="http://domain_dot_com/image.jpg">
<meta property="og:url" content="http://domain_dot_com//somePage.php">
Also some social networks like facebook cached your images and urls to make the image and load faster, in case that your post get share to a lot of users.

Related

Facebook Graph API's dialogue doesn't show image preview first time

‎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.

Why isn't Facebook recognizing my OG tags?

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.

FB meta image tag not working

I have this meta tag for an image to pull when the link to an article is posted on FB:
`<meta property="og:image" content="http://crossfit954.com/photos/t-316.jpg"/>`
However its pulling 3 other images not including the t-316.jpg I need. Running it through
the FB debugger says Can't Download Could not retrieve data from URL.
I'm not sure what else I need to get that image to be the thumbnail that posts on FB when I paste the link, any thought?
The debugger has all errors you need!
Use a bigger image to show the thumbnail you want and add the reuqired OGP tags
<meta property="og:title" content="Example" />
<meta property="og:url" content="http://example.com" />
<meta property="og:image" content="http://example.com/example.jpg" />

Facebook sharing not displaying meta data unless url passed through debugger

I have a strange problem with Facebook sharing. I have a news portal and when I try to share some news, half of them are sharing fine, and half are not recognized at all, just the link is shared without Title, Image and Description.
The news portal is in PHP Codeigniter, and here are the meta tags that every news link has, and they are correct when I see Page Source.
<meta property="fb:app_id" content="the number"/>
<meta property="og:url" content="the full url of the page" />
<meta property="og:title" content="Title of the news story" />
<meta property="og:description" content="The introduction of the story" />
<meta property="og:image" content="full link of the image"/>
I checked there isn't anything common for the stories that Facebook does not take the meta data. I tried with everytype od image, and with many different resolutions, even with the minimum resolution 200x200 but there is no success.
The only solution is to put the link in the Facebook debugger and then it is working fine. After that you can share it normal, but this is wasting of a lot of time and energy to put half of the links in the debugger before sharing...
What am I missing here?

The image to show when a web page is shared in facebook

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 :)