Invite Friends from Facebook

From KickApps Documentation

Jump to: navigation, search

Letting your users invite their Facebook friends to your community offers a great opportunity for them to connect with friends on your site, while helping you attract more members and stimulate activity.

Please note: You must enable Facebook Connect to use this feature. See this doc: Facebook Connect and KickApps

Follow these steps to add an "Invite friends from Facebook" button to the Invite Friends page under the "my home" section:

  1. Copy this CSS code into the <head></head> area of your Global Page Template.

CODE

<style type="text/css">
    #ka-invite-facebook-wrapper {
        overflow: hidden;
        display: inline-block;
        cursor: pointer;
    }
    
    #ka-invite-facebook-wrapper { display: block; }

    #ka-invite-facebook-friends-button {
        float:left;
        background: #5F78AB;
        border-bottom: 1px solid #1A356E;
    }
    
    #ka-invite-facebook-friends-button-text {
        font-size: 16px;
        color: #fff;
        border-top: 1px solid #879AC0;
        float:right;
        line-height:19px;
        font-family: lucida grande,tahoma,verdana,arial,sans-serif;
        padding: 0 4px 0;
    }
    
    #ka-invite-facebook-friends-fb-icon {
        float:left;
        height:20px;
        width:20px;
    }
    
</style>

  1. Copy this JavaScript code into the Footer area of your Global Page Template.

CODE

<script type="text/javascript">

(function() {
    
    if (Ka.Info.PAGE === 'pages/inviteFriends.jsp') {
    var ka_invite_facebook_wrapper = "<div id='ka-invite-facebook-wrapper'><a id='ka-invite-facebook-friends-button'><img id='ka-invite-facebook-friends-fb-icon' src='http://appassets.kickstatic.com/20804/images/facebookIcon.png' /><div id='ka-invite-facebook-friends-button-text'>Invite friends from Facebook</div></a></div>";
        jQuery("#newMessage > fieldset").prepend(ka_invite_facebook_wrapper);

    	jQuery("#ka-invite-facebook-friends-button").click(function() {Ka.FacebookConnect.inviteFriends();});

    }
})();

</script>
  1. Click Save.


Voila!

InviteFriendsFromFacebook.png