Facebook share not recognizing image thumbnail - facebook

I have created an facebook share button using the url below:
http://www.facebook.com/sharer/sharer.php?s=100&p[url]=http://www.elementalworks.nl/KPJH/Homepage&p[images][0]=http://www.elementalworks.nl/KPJH/images/logo.jpg&p[title]=KPJ Halsteren voor jouw schuurfeesten en trekkertrek activiteiten&p[summary]=Schuurfeesten, Trekkertrek en allerlei andere gezellige bijeenkomsten vindje bij KPJ Halsteren
In addition to this i placed the open graph image tag as follows:
<meta property="og:image" content="http://www.elementalworks.nl/KPJH/images/logo.jpg" />
BUT.. the facebook debugger (https://developers.facebook.com/tools/debug) sais that the image is'nt big enough, it has to be 200x200. The image itself is 365x250 50kb.
Strange thing is that in the small preview window below the debugger the image does show.
So why doesnt it show at the moment of sharing? You cna find the page in question here: www.elementalworks.nl/KPJH

Related

Facebook Status Update Doesn't Show Thumbnail

Although the Facebook Debugger is showing the correct thumbnail for: http://www.apparelyzed.com/forums/topic/26287-burned/
When this url is entered into the profile update, it only fetches the text, and not the meta-image as well.
Thanks
Simon
In the above given page source has a this link tag and has an image. What is the purpose of this image. Try removing this link and see.
<link rel="image_src" ref='http://www.apparelyzed.com/forums/public/style_images/master/meta_image.png' />
and also check that your image size is minimum 50x50 and its good to have 200x200
The og:image property has some optional structured properties:
1. og:image:url - Identical to og:image.
2. og:image:secure_url - An alternate url to use if the webpage
requires HTTPS.
3. og:image:type - A MIME type for this image.
4. og:image:width - The number of pixels wide.

Facebook sharer underneath facebook video

I have a facebook video embedded in a fan page tab. You can click to share a message but the dialog that pops up appears underneath the video itself. I had a screenshot to show you but it won't let me post it because I don't have enough rep.
Is there a way to have the sharing message above the video? I have tried z-index in css and that didn't work. I also tried adding these tags to the embed code:
<param name="wmode" value="transparent" />
wmode="transparent" (in the actual embed tag)
but that didn't work either.
Try instead to use wmode="opaque" as described here: http://developers.facebook.com/docs/appsonfacebook/tutorial/

Prevent sideway scroll of site in mobile safari

I have a website based on jQuery Mobile.
I'm using the viewport tag to fit my site to screen size.
So far so good.
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
But the Problem is now, that I'm still able to scroll my whole site (the whole mobile safari browser) around the screen.
I tried to set
body {
overflow:hidden;
}
like described in other posts here. But it does not work for me. Anyone an idea how to fix that?
I had the same problem, and ended up using this workaround:
document.ontouchmove = function(event) {
event.preventDefault();
};
Well zooming and scrolling doesn't always have to be related. Your problem here is not with the viewport but with the actual width of your site, if the size is wider than the screen size you will have scrolling issues. You would have to give us a live example so we can help you to find the elements that are overflowing your layout
I compared your site with one of our own. You're using jQuery Mobile 1.0RC1 and we're using 1.0b3. The problem occurs with your site but not with ours.
Maybe try upgrading to the latest jQuery Mobile?
As Jasper pointed out, you have a 404 while trying to fetch these:
http://www.m.fdl.de/wp-content/themes/jquerymobile-FDL%202/img/cursors/grab.png (image)
http://www.m.fdl.de/wp-content/themes/jquerymobile-FDL2/wp_properties.css?ver=1.13 (page)
http://www.m.fdl.de/wp-content/themes/jquerymobile-FDL%202/js/jquery-1.6.2.min.js (jQuery Library)
You look like you have a space in a folder name "jquerymobile-FDL 2", I would rename this without the space.
Also I'm not sure if you can have a meta tag inside the title or style tags, maybe move all meta tags to the start pf your head tag?
http://www.w3schools.com/html5/tag_meta.asp
Also you seem to be importing two different versions of jQuery
http://code.jquery.com/jquery-1.5.2.min.js?ver=3.2.1
http://www.m.fdl.de/wp-content/themes/jquerymobile-FDL%202/js/jquery-1.6.2.min.js

Using HTML pages in UIWebView, strange issues with relative page images but links work

So I'm creating an app which basically is a UIWebView that loads an HTML page, which should have images on it. The HTML page is loading fine (confirmed with a little text on the page), but then I have this code in it:
<img src="images/image_1.png">
test
Check this out:
The tag has a broken image link
But, when I tap on the link, the
image loads!
How is this happening? What kind of solution is there?
I have the images in a subfolder of resources, which I added by "Create Folder References."
Help? A note: This is on iPad, using 4.2. But that shouldn't matter, right Apple? (Also, changing it to xml <img /> type tag doesn't do anything)
The image was way too big - over 2500px wide. Resizing to 1024px fixed it. Thanks Jose Vega.
Also, Automator is a gift from the Gods when it comes to batch operations.

Use FBML to embed a custom video player / video on facebook walls?

I'm trying to get a video (flv) or an swf video player to work on Facebook walls, however no matter what I do - facebook posts the raw fbml and ignores the code. What am I doing wrong?
<fb:swf
swfsrc='http://www.domain.com/flv_player/Main.swf'
imgsrc='http://www.domain.com/large1.jpg'
allowscriptaccess=”all”
flashvars='config=http://www.domain.com/playerConfigEmbed/2179.xml'
width="384" height="283" />
I've also tried fb:flv
<fb:flv src='http://www.domain.com/files/file.flv' width='400' height='300' title='my movie' color='#FFBB00' salign='r' img='http://www.domain.com/thumbs/large1.jpg' scale='showall'/>
You can easily do this with Open Graph meta tags. I've written a short tutorial on how to do it right here: http://ahrengot.com/tutorials/custom-video-player-on-facebook/
This method will also allow you to have HTML5 fallback for iphones, which will even work in the Facebook iPhone app - My example is set up with HTML5 fallback that shows that functionality as well.
try that one:
<fb:swf
swfbgcolor="000000"
imgstyle="border-width:3px; border-color:white;"
swfsrc='http://vimeo.com/moogaloop.swf?clip_id=12941088&server=vimeo.com&show_title=1&show_byline=1&show_portrait=1&color=00ADEF&fullscreen=1&autoplay=0&loop=0'
imgsrc='http://lojke.pl/PapayaLearn/video_link.png'
width='400' height='302'>
Insure yourself of placing the label
<Fb:fbjs-bridge />
Before creating your <fb:swf />
This will serve you to create a bridge to communicate with the Flash.
Then:
<Fb:swf
Swfsrc ='http: // your domain/yourflash.swf '
Width = '550' height = '400' align ='center ' />
If these working with free Hosting the most probable thing is that Facebook prevents that your SWF is visualized.