2012-02-15 12 views
9

Po prostu próbuję załadować stronę facebook sharer do elementu iframe, który znajduje się w pozycji div bez powodzenia.Załaduj Facebook Sharer w iFrame

Oto kod używam do iframe,

<iframe src="http://www.facebook.com/sharer.php?u=http://www.website.com&t=Title Hoes Here"></iframe> 

Kiedy wyświetlić stronę jego puste i źródłem iframe jest

<iframe src="http://www.facebook.com/sharer.php?u=http://www.website.com&t=Title Hoes Here"> 
<html> 
<body></body> 
</html> 
</iframe> 

Gdybym zobaczyć URL bezpośrednio, wszystko pojawia się poprawnie.

Czy blok facebook ładuje sharer w iFrame? i jakie są moje alternatywy, aby sharer facebook pojawił się w oknie modalnym?

Dzięki

+0

Nie powinieneś używać żadnej przestarzałej funkcji w nowej wersji. Jest nieobsługiwany i zostanie wyciągnięty spod nas w dowolnym momencie. Zobacz: https://developers.facebook.com/docs/share/, aby uzyskać więcej informacji na temat tego, co powinieneś zrobić. – DMCS

Odpowiedz

7

Tak, dość dużo Facebook blokuje cały ładowanie ekranów wewnątrz iframe.

Jeśli korzystasz z usługi Facebook connect, istnieje kilka prostych metod javascript, które można wykonać, aby uzyskać okno dialogowe na stronie, a uruchomienie usługi Facebook zajmie się dużo pracy, aby ekran wyglądał ładnie.

Zobacz ten link (http://developers.facebook.com/docs/reference/javascript/FB.ui/) lub użyć kodu poniżej:

FB.ui(
    { 
    method: 'feed', 
    name: 'Facebook Dialogs', 
    link: 'http://developers.facebook.com/docs/reference/dialogs/', 
    picture: 'http://fbrell.com/f8.jpg', 
    caption: 'Reference Documentation', 
    description: 'Dialogs provide a simple, consistent interface for applications to interface with users.' 
    }, 
    function(response) { 
    if (response && response.post_id) { 
     alert('Post was published.'); 
    } else { 
     alert('Post was not published.'); 
    } 
    } 
); 

Jeśli nie używasz Facebook connect potem naprawdę to jedyna możliwość, aby ta dokładnie ekran jest rzucić pop-up.

Inną opcją byłoby użycie wtyczki przycisku jak/wyślij, to nie jest taka sama funkcjonalność, ale łatwiej ją zintegrować. http://developers.facebook.com/docs/plugins/

Pozdrawiam!

+3

F @ # $ facebook, twitter, link in, pinterest i cała reszta, którzy chcą szpiegować twoich użytkowników i spowalniać ładowanie twoich stron. Żadne z nich nie pozwala na ładowanie swoich rzeczy tylko wtedy, gdy użytkownik chce skorzystać z usługi. Chciałem, aby wyglądało ładnie w iFrame, ale nie pozwalają na to. Google Plus to jedyny, który zezwala na element iframe. – pathfinder

+0

@pathfinder: Tak, zrobiłem też trochę badań i załadowałem kosz mediów społecznościowych tylko wtedy, gdy użytkownik go kliknie. Na tej stronie http://meezingeninrotterdam.nl (której wydarzenie jest teraz zamknięte) możesz zobaczyć, jak to zrobiłem. Kliknij na ikonę na Facebooku, na przykład poprosi o potwierdzenie plików cookie stron trzecich. Po tym wtyczka addthis zostanie załadowana, jeśli zdecydujesz się kontynuować. Ta metoda pozwala zaoszczędzić użytkownikowi dużo ruchu, a użytkownicy mogą być śledzeni tylko wtedy, gdy zaakceptujesz okno dialogowe plików cookie stron trzecich. Ta metoda pozwala również zaoszczędzić na dodaniu banera strategii plików cookie DLA WSZYSTKICH użytkowników na stronie. – Codebeat

0
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script> 

Powyższa linia w głowie.

<div id="fb-root"></div> 
<script> 
window.fbAsyncInit = function() { 
FB.init({ 
appId : '', 
status : true, // check login status 
cookie : true, // enable cookies to allow the server to access the session 
xfbml : true // parse XFBML 
}); 
}; 

(function() { 
var e = document.createElement('script'); 
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js'; 
e.async = true; 
document.getElementById('fb-root').appendChild(e); 
}()); 

</script> 

<script> 
$(document).ready(function(){ 
$('#share_button').live('click', function(e){ 
e.preventDefault(); 
FB.ui(
{ 

method: 'feed', 
name: '', 
link: '', 
picture: '', 
caption: '', 
description: '', 
message: '' 
}); 
}); 
}); 
</script> 
Powiązane problemy