3

Has anyone had any luck displaying a Facebook Like button in their Unity based Facebook App? The current Facebook SDK for Unity (6.2.1) doesn't have any support for a Like button which is really annoying because they have support for social buttons in their iOS, Android and Web SDKs. I've been trying to inject the javascript necessary to display a Like button above the canvas using Unity's Application.ExternalEval function and I've actually managed to display the button but the javascript that Facebook gives to enable their javascript SDK is caused the FB.Init function in their Unity SDK to fail for some reason. I'm hoping someone knows why and has suggestions on how to fix this. Here's the code I have so far:

    // add Like button above the canvas
    string strFacebookSDKScript = 
        "(function(d, s, id) {" +
            "var js, fjs = d.getElementsByTagName(s)[0];" +
            "if (d.getElementById(id)) return;" +
            "js = d.createElement(s); js.id = id;" +
            "js.src = \"//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=INSERT_APP_ID&version=v2.0\";" +
            "fjs.parentNode.insertBefore(js, fjs);" +
            "}(document, 'script', 'facebook-jssdk'));";

    // this calls the above javascript to initialize the SDK but appears to prevent the FB.Init within Unity working later on
    Application.ExternalEval(strFacebookSDKScript);

    // this code displays the Like button
    string strLikeButton = "<div class=\"fb-like\" data-href=\"https://www.facebook.com/YOUR_APP_LINK\" data-layout=\"button_count\" data-action=\"like\" data-show-faces=\"true\" data-share=\"true\"></div>";
    FacebookManager.AddHTMLAboveCanvas("div", strLikeButton);

The above code is called as early as possible in one of the scene object's Awake methods. Then I have this "AddHTMLAboveCanvas" function in FacebookManager.cs file to use Unity's Application.ExternalEval to inject HTML above the canvas. Note that this code succesfully displays html above the Facebook canvas in the Firefox browser but really messes up on all other browsers sticking it below the canvas and screwing up the canvas size so maybe someone knows how to fix that too?

public static void AddHTMLAboveCanvas (string strElement, string strContent)
{
    string strInjection = "if(navigator.userAgent.indexOf(\"Firefox\") >= 0){" +

        "var headerElement = document.createElement('" + strElement + "');" +
        "headerElement.innerHTML = '" + strContent + "';" +
        "var body = document.getElementsByTagName('body')[0];" +
        "var insertionPoint = body.children[0]; " +
        "body.insertBefore(headerElement, insertionPoint);" +

        "}else{" +

        // not working on IE, Safari or Chrome yet
        "var headerElement = document.createElement('" + strElement + "');" +
        "headerElement.innerHTML = '" + strContent + "';" +
        "var body = document.getElementsByTagName('body')[0];" +
        "var insertionPoint = body.children[0]; " +
        "var unityPlayer = document.getElementById('unityPlayerEmbed');" + 
        "unityPlayer.parentNode.insertBefore(headerElement, unityPlayer.nextSibling);" +
        "var embedTag = unityPlayer.getElementsByTagName('embed');" + 
        "embedTag[0].setAttribute('style','display:block;width:1200px;height:600px');" +
    "};";

    Application.ExternalEval(strInjection);
}
user2136772
  • 89
  • 2
  • 3
    I've figured out how to do this - Instead of calling the Application.ExternalEval(strFacebookSDKScript); code above which initializes the Facebook Javascript SDK (and conflicts with the Facebook Unity SDK), go to the Facebook menu in Unity, then Edit Settings and check the Xfbml box under FB.Init. This will then parse the HTML and replace the "
    code with a Like button. I haven't "Answered" this question because I still need someone to modify the AddHTMLAboveCanvas function to work properly on browsers other than Firefox. Any takers?
     – user2136772 Mar 16 '15 at 16:39

0 Answers0