I am using Share on Facebook button with www.facebook.com/sharer.php?etc URI. However, I have some problems. Here's what I want to do.
My site is kind of like a blog in which each blog has a lot of photos
So when people click on Share on Facebook button, I want the users to be able to choose which photo to use as Facebook thumbnail. I'm aware this is the default method of Facebook Share which is to scan the whole page for images.
However, my problem is the thumbnails won't show. I viewed the source to find that the URI to the images is incorrect. For example :
**SHOULD BE :** http://www.mysite.com/web/images/photo.jpg
**ACTUAL :** http://www.mysite.com/images/photo.jpg
So in short, facebook fails to read the "web" in the URI. That's why the thumbnail won't show. Any idea how to fix this?
The link to the site :
http://www.biiiz.com/nya/blog.php?id=1
It's actually just a temporary hosting. 'm sure the share on FB will work fine when I move the files into their own hosting, but I'm just curious about this.
You can get facebook to clear their cache and re-download your meta data by entering your URL into their linter:
http://developers.facebook.com/tools/lint/
Consider the documentation
`<link rel="image_src" href="thumbnail_image" / >`
FB caches for... like... ever. You can't clear it manually, so just wait until their private crawler hits your site again.
Related
My requirement is to share a URL/page that is accessible only after the login!! sounds weird and meaningless but that's the requirement!! The problem is I can not use Open graph because facebook, twitter, and other social media who use Open graph will always take the title, text, and image of the login page from the meta information. So I searched and googled to get a way around to share the private URL with custom text, image, and URL. I have created some POC and have followed some plugins but nothing is helping me out.
I followed this article of "Share this":- https://www.sharethis.com/support/legacy/how-to-customize-which-url-text-and-img-to-share/ ( need to change button js to https://ws.sharethis.com/button/buttons.js )
This option is working fine for email sharing but social media is fetching the Login page meta always.
I followed this article for "Add this":- https://www.addthis.com/academy/setting-the-url-title-to-share/ (this seems to be old and they don't specify the date of the article!! )
This option is also not working and does not solve what is required.
So my question is it possible to share the page with custom title, image or description that is not accessible without login ?? if yes then any idea how to achieve this without Meta, Open graph, schema.org etc.
You tried to use OpenGraph tags on pages which require login. Facebook, Twitter and etc cannot access through obviously. Try to somehow recognize social media that request your protected content and give it to them.
We're a website completely written in PHP, we use facebook metatags since we provide facebook sharing, liking, etc...
problem is when we share a link from our site to facebook, it shows the picture correctly, however trying to reshare the same link from another user, removes the picture and shows the link only.
Further troubleshooting using the FB debug tool shows below error message:
Unable to download og:image: The image referenced by the url of og:image tag could not be downloaded.
The weird thing is that the image is already see and accessible in the debugger!!
A sample page:
http://fbcomics.com/home/index/92/date/1462
Debugger for it:
https://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Ffbcomics.com%2Fhome%2Findex%2F92%2Fdate%2F1462
Your cooperation is highly appreciated.
I think that you probably need to urlencode() the url value going into the content attribute of your og:image meta tag.
This might be related to a recent Facebook bug. https://developers.facebook.com/bugs/239522122851150
Issue was solved by itself. It seems that Facebook needs sometime (weeks I think) to store the page information including the picture using its crawlers.
If you face this, most probably you'll need to wait for sometime before sharing your new pages.
Thanks,
I run ads on my site which are usually YouTube videos. I would like to find out if a user clicked these videos. I'm basically trying to use this data in a statistics plugin that I'm creating.
I've tried searching many different keywords but I can't really find anything.
I would appreciate it if I could be pointed in the right direction. Any ideas, hints or links are welcomed.
As you mention YouTube I doubt you have control over the URL.
But, if you can control the URL embedded in the video, then I would suggest building a simple redirect script on your server. Make sure the URL contains either the redirect URL or a code representing the URL which would be held in your Data Base. Add a logging function to the redirect script and hey presto.
If you have no control over the URL, then off the top of my head maybe you could implement some client side JS to add an overlay to the video which becomes the click-able element and implement the URL redirect script above. Some methods to get the URL from the video: https://www.google.com/search?q=jquery+youtube+URL
What I'm trying to accomplish seems like it should be pretty simple...
I have a gallery of 10-20 photos in a grid, all on a single PHP page.
I want a Facebook "Like" button below each photo. When the "Like" is shared on the user's profile (if they choose), I want it to show the photo they liked, but link to the page with the gallery.
A wireframe image of what I'm trying to accomplish is here: http://i.stack.imgur.com/u3h0E.png
Right now, I'm simply using a simple Facebook Like Button, but I want to tie each Like Button to the respective photo, yet have it all tied back to this gallery page.
Any help or direction is appreciated! Would certainly prefer to stay away from setting up anything complicated with the Graph API, but if that's the only method, let me know!
One quick solution would be to have each photo in the gallery (and its respective like button) render within its own IFRAME. As far as the photo display and LIKE button are concerned, they live in a separate context (and URI). You could then redirect any requests to that URI that don't originate from an AJAX request (i.e. whenever someone tries to access the content that has been "Liked") to the gallery page. This has the added advantage that you can (as your app evolves) use AJAX calls to substitute out and load in new photos, in place of the old ones, with minimal effort (that's a tangent though).
If I insert in my wall a link like this:
http://blog.bonsai.tv/news/il-nuovo-vezzo-della-lega-nord-favorire-i-lombardi-alluniversita/
then facebook extract the image in the post and not the first image in the webpage ( not image logo or other little images for example ) !!
How facebook does that ?
Hm, impossible to say without more information about the algorithm they use.
However, from looking at the page's source code you can see that while the image of Bossi is not the first image in the page, it's the first inside the divs "page_content" and "post_content". Maybe Facebooks knows the HTML IDs that the blogging system (Wordpress in this case) uses, and uses these to find the first image that is actually part of the page content.
That would actually be a good idea, and is essentially an implementation of the "semantic web"...
As others have said, we have no idea how Facebook decides what to choose in the absence of any relevant metadata (though Sleske's guesses seem reasonable; I'd also guess that they look at the first big image), but you can avoid that by going the correct route and simply giving facebook (and similar services) addiotnal metadata about your page by using Open Graph Protocol tags, for example if you want to specify a particular image to use for a facebook like, you'd include this in your head tag:
<meta property="og:image" content="<your image URL>" />
OGP is also used by LinkedIn, Google+ and many others.
If you're in Wordpress you can control these tags with an open graph plugin. Other systems can do it manually or via their own plugins.
I can imagine that the Facebook crawler can identify the actual content part, and select an image from it. Similar functionality is used by the Safari Reader functionality. It probably helps that the software used is Wordpress, which is the most popular blogging software. It's a quick win for Facebook to add specific support for this software.
My guess is facebook has built some algorithms for distinguishing the actual content from the other data in a html page. When looking at the page you provided it's quite easy since the html element that contains the page content has id="page_content" which is self-explanatory.