FB iframe tab - hide/alter contents if page is not “liked”

问题

How is this done? I've seen some iframe content which was either hidden - in which case a graphic pointing up and saying something to the effect of "like us..." - or an offer - for example a discount available to the viewer if the page is "liked".

I've dug around for this, but haven't had any luck. It's been done, but I didn't have the foresight to note which FB pages were doing it.... argh!

回答1:

You will need a Facebook application in order to achieve this. Once you have set that up, create your page and when the page loads, the user will need to authorise your application so that you can get access to their personal information to see whether they like the page using some FQL. The code below will check to see if a Facebook User likes the page, but this will only run if a user has allowed access to your application.

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
    FB.init({
        appId : 'yourAppId',
        status: true,
        cookie: true,
        xfbml : true
    });
    FB.getLoginStatus(function(response) {
        if (response.session) {
            var user_id = response.session.uid;          
            var page_id = "xxxx"; //The Page that you want to Like
            var the_query = FB.Data.query("SELECT uid FROM page_fan WHERE page_id = {0} and uid={1}", page_id, user_id);          
            the_query.wait(function(rows) {              
                  if (rows.length == 1 && rows[0].uid == user_id) {                 
                     $("#divWhenLiked").show();         
                  } else {                  
                     $("#divWhenNotLiked").show();
                  }          
            });      
        } else {        
            // user is not logged in   
            $("#divNoPermission").show();               
        }    
    });
</script>

In the code, you'll see 3 <div> tags which will be shown dependant on whether the user has allowed your application, not Liked the page, and Liked the page. In the <div> tag that shows the permissions, in order to get this to work you'll need a hyperlink that will link off to your application, for example:

http://www.facebook.com/dialog/oauth?client_id=yourAppId&redirect_uri=http://yourWebsite/yourRedirectPage

This will display a Pop-up window from Facebook asking for the user to allow permission to the application. It will then redirect to your Redirect Page that you have specifed in the link. In your RedirectPage, you'll just need a simple redirect piece of code in the <body> tag:

<script>
window.location.href = "http://www.facebook.com/pages/YourApp?sk=app_yourAppId";
</script>

You can get the hyperlink from the Facebook application page. Hope this helps.

来源：https://stackoverflow.com/questions/6908890/fb-iframe-tab-hide-alter-contents-if-page-is-not-liked

标签

facebook

iframe

facebook-like