Create custom open graph - php

Here's the scenario, when you post a link to Facebook, the scraper makes an open graph story based on og tags. However, I woudl like to know if it's possible to change the image retrieved by the scraper with one loaded by the user.
Imagine it like this, I want to post a link but the referenced site has no image, I'd like to modify the story so that its image is one I upload manually. Is that possible?

I found the answer in the API as suggested by CBroe. To clarify, I'm posting to a page, not to a profile, so I used the parameter link to, obviously, specify the link I was sharing. I also used the parameter picture to replace the thumbnail the scraper fetches with one I wanted.
This picture is a url, not an uploaded file, if someone is wondering.
So, the final array that will be sent to Facebook's API looks like this:
$data = ['message' => 'your message', 'link' => 'your-link.com', 'picture' => 'url/to/image.jpg'];
As I said, this will post a link to a page and replace the thumbnail fetched from Facebook's scraper with the image specified in the picture parameter.
Hope this helps anyone else with the same question :)

If I correct understood your question.
FB takes image from OG tag, no other way, also you cannot change this tag dynamically. I faced a long time ago with problem, that scraper could not find image on dynamically generated page. The solution was - send to FB another permament link. For example - permament link on main page site.com/module, this page for sharing to FB site.com/module/?c=123123123 (generated page by user, $c - here uniq parameter which was responsible for image in OG tag)
So - anyway if want to share page with picture - it should be contained in OG tags.

Related

PHP & post Youtube ID to another page

I've been searching for this a lot but have not found exactly what I'm looking for.
So, I have a page (index.php) which displays my YouTube channel's uploaded videos as thumbnails, and either displays them inline above the thumbnails, or as links that redirect to Youtube. What I'd like to do, is to get the video's ID (which is in the a href link) and post it to another page (video.php) that shows the full embedded video (of the ID in question), with title & description. Is this possible to do?
My site is loosely based on this: http://www.yvoschaap.com/youtube.html and I've tried Youmax, but like said, they only play videos inline. I want to pass the ID of a clicked video as a parameter to the video.php page.
Sorry if this is confusing, but I'm still quite new to programming :)
You can look into Youtube Data API.
The main link you will need to retreive a list of all Videos for a channel will be somewhat like:
https://www.googleapis.com/youtube/v3/search?key={your_key_here}&channelId={channel_id_here}&part=snippet,id&order=date&maxResults={number_of_videos_you_want}
It will recieve it's response in JSON Format containing information like your Video ID which you can pass as Parameter to your video.php page

How to get Facebook to thumbnail an image from URL in post

I'm building an image library site. It will be mostly private but I'd like users to be able to directly use certain images in facebook posts by special URLs.
The URLs look plain enough: http://example.com/some/path/image.jpg although they're actually generated on demand by a script.
But when I paste that URL (the URL of the image, not a page with the image on) to Facebook it just comes up with the domain name; it does not thumbnail the image.
There are many questions about open graph meta tags - but that's to do with pages, and this question is about the case of a post with a direct image URL. I notice that it works for images from imgur, for example.
Is there something in the way the image is served, or something about the quality of the image itself that I can change to get facebook to work? Or is it just something like facebook knows to treat certain image sites a different way?
Thanks.
I think Facebook grabs the image using some kind of OpenGraph "Browser". So you need to serve it meta information depending on the User-Agent, which is
facebookexternalhit/1.1 (+https://www.facebook.com/externalhit_uatext.php)
for Facebook.
So when a user browser hits your URL you serve the image, when it's facebook you serve it open-graph meta-data.
The only thing, off the top of my head, that I can think of is your favicon for that page.
Visit http://www.w3.org/2005/10/howto-favicon for information on favicons in html.

FB Share pop-up different window than what is posted

I'm new to using the FB share buttons terminology so forgive me if I use the wrong syntax in describing this.
My site is setup to load pages based on the passed parameters in the URL (...?page=somepage&imageid=idnum).
So I have my index file which contains my head, as well as sidebar, etc. Then my main body is generated according to the passed parameter. Simple Enough.
On the homepage, the main body is a gallery of images. When they click on one of those images it takes them to a page that just displays that one image. The page is loaded with parameters of ?page=detail&image_id=1 /*or whatever the id of that image is */
So when they click on the share on FB button on those individual images page, I would like it to populate with the image that is displayed on that page. What I have done is included a php file in my head tag. The php script included gets the page info and passed parameters and then fills out the image url based on the imageid.
echo '<meta property="og:image" content="http://www.chiseledimages.com/clients/vote/'.$imgurl.'"/>';
This works in that when displaying the page source, the meta tag with og:image shows perfectly, also in that when I run it through the FB Object debugger, it gets the correct image and doesn't show me any errors. It even posts the correct image when the users shares on their wall. What is does not do, is show the correct image in the pop window after the uses presses the share button on my site. So even though the result is what I want, the problem with the user not seeing the correct image in the share pop-up, may lead them not to want to share on their wall.
Current location of site: http://www.chiseledimages.com/clients/vote/
Example of a specific pages: http://chiseledimages.com/clients/vote/?page=detail&angel_id=1
Screenshots of pop-up with wrong image, but final posted story having correct image.
How can I make the image in the pop-up match the image that is going to be shared. Thanks.
Edit: I forgot to mention and I'm sure it matters that I'm using Addthis to implement the FB share.
Check https://developers.facebook.com/docs/reference/dialogs/feed/ - look for the 'picture' parameter description
I suggest to you use this http://support.addthis.com/customer/portal/articles/1365475-attribute-based-configuration#.UwPQB6LW6So. just follow their example and you good to go.

Link picture to facebook status (using graph API)

I have tried almost everything to link picture to Facebook status that is created via Facebook Graph API from other web application.
I am sending POST request to https://graph.facebook.com/me/feed with these fields:
message = text that is correctly displayed
link = link to page that also works well
picture = link to picture that I want to display in status (not working)
type = picture
I have tried to use source field instead of picture field, tried to ommit type field, I have also tried to use picture directly as a link field.
I have also tried to use picture (or source) field to point on URL directly with picture data, or to page containing that image mentioned in og:image meta tag.
None of mentioned worked. I can only post a status with text and correct link, picture is never included. On the other hand, I have realized, that link to my picture is wrapped in some Facebook link (this is visible in element inspector in one of div elements of status on Facebook wall), but this link does not work – it shows gray gif picture large 1px by 1px. I have tried to remove all special characters from link, now it is in simple form eg. foo.bar/some/path/picture12.
Nothing worked
Make sure that you include the link to in the post:
link=http://url.to.your.canvas.app/another.link
The link provided as a landing page needs to be on the same domain as the one you have specified in the application settings on developers.facebook.com
Also instead of me you should use your Facebook ID ( as a good practice )`

Post a link on Facebook wall og:image does not works

i just want to copy and paste my website links on users facebook walls , when share from http://www.tvguide.dk/nyheder/2011-10-15/TV2_satser:_Nu_med_spritnye_v%C3%A6rter_!/ share buttons it works and picks a correct og:image thumbnail ,
however when i copy paste the link on the wall the facebook picks the logo image. insted of og:image value
can you guys help me please
You won't be able to change that, unless you always upload a picture when you post on someones wall! The og:image is only used for the open graph which is used from like and share buttons, comments etc, but not in facebook itself.
Read up on internationalization: http://developers.facebook.com/docs/internationalization/
Your website is in Danish but you have used set locale as en_US. Also the title, type and URL properties are not being interpreted correctly by Facebook. http://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Fwww.tvguide.dk%2Fnyheder%2F2011-10-15%2FTV2_satser%3A_Nu_med_spritnye_v%25C3%25A6rter_%21%2F
Make changes and check the progress at URL Debugger(Linter) given above. If everything fails try including the FBJS SDK and use fb:share-button. I had a similar problem once with WordPress which got solved using the JS SDK

Categories