Friends, Let's Create social inviter plugin

This Plugin will work to invite your facebook friends, when you click on the plugin it will bring something of this nature without coping and pasting of emails from different social networks.

Please how to start it from adam

Your Comments Counts towards success

Thanks a lot

  • https://developers.facebook.com/docs/reference/dialogs/requests/

    hmm

     

    JavaScript SDK

    Sending requests to specific people:

    FB.ui({method: 'apprequests',
      message: 'My Great Request',
      to: {user-ids}
    }, requestCallback);

    Sending requests using the Friend Picker:

    FB.ui({method: 'apprequests',
      message: 'My Great Request'
    }, requestCallback)
  • Add a Facebook Invite Friends Link to your Blogger Site


     

    Over at 9Lessons I read a very helpful tutorial to add an "Invite your Facebook Friends" link to a website. I was able to modify this in order to add to a gadget which now appears in the sidebar on all pages of Blogger Buster (beneath the Facebook Like box).

    If you click on this link, a box will appear on the page enabling you to invite chosen friends from your Facebook profile to visit Blogger Buster.

    In this simple tutorial I'll explain how you can add this functionality to your own Blogger powered blog.

    Create a Bit.ly URL for your blog

    The first thing you'll need to do is create a short bit.ly url for your blog. This will enable us to circumvent the requirement for a secure base URL (beginning with https which we can't natively use with Blogger).

    Make a note of this short bit.ly URL as you will need it when creating your app on Facebook.

    Create your Facebook App

    Now you'll need to create a Facebook Application as you'll need an appID to use in your code. Visit the Apps page on Facebook Developers to do this.

    Name your application and fill in the first set of details as follows: 

    Next, click on "Select how your app integrates with Facebook" and fill in details as follows:


    If you like, you can add an icon and thumbnail for your application at the top of the page; these will appear when readers use your app. Then save your changes.

    Once you've done this, be sure to make a note of your App ID which will be shown at the top of the page as you'll need to add this to the code to be pasted in your site.

    Add a custom gadget to your site

    Finally, go to the Layout section of your Blogger dashboard and choose to add (or edit) an HTML/JavaScript gadget.

    Paste the following code into your gadget, replacing the values highlighted in red and blue:

    <script src="http://connect.facebook.net/en_US/all.js"></script&gt;
    <script>
    FB.init({
    appId:'your-app-id',
    cookie:true,
    status:true,
    xfbml:true
    });
    function FacebookInviteFriends()
    {
    FB.ui({
    method: 'apprequests',
    message: 'Your Message Here'
    });
    }
    </script>
    <div id="fb-root"></div>
    <span class="invite-friends-link"><a href='#' onclick="FacebookInviteFriends();">
    Invite friends link text
    </a></span>
    <script type='text/javascript'>
    if (top.location!= self.location)
    {
    top.location = self.location
    }
    </script>

    And save the changes.

    This will create a basic text link which your blog visitors can click to bring up a Facebook dialogue box in which their friends can be invited to visit your site.

    Here's a demo of how the "Invite Facebook Friends" link works:

     

    Invite friends to Blogger Buster

    For those who may be reading this post in their feed reader. here's a screenshot of the Facebook pop-up screen:

    image



    If you would like to style the link to look like the one which appears above and in the Blogger Buster sidebar, go toTemplate>Customize in your Blogger dashboard, scroll down to the Advanced section and add the following to your Custom CSS (or modify to suit your requirements):

    .invite-friends-link a {
    background: url(http://2.bp.blogspot.com/-E5PpxJP0Dr4/T_YWB_HvV-I/AAAAAAAADSk/7fIRr2gw-B0/s1600/facebook.png) left no-repeat;
    padding-left: 30px;
    line-height: 30px;
    font-size: 16px;
    font-weight: bold;
    color: #3b5998;
    display: block;
    }

    That's all there is to it!

    Final thoughts

    Admittedly it did take a while for me to figure out how to get my own app working properly. The biggest problem I had was finding a way to use a secure base URL as Blogger does not support https requests. Thankfully I discovered that bit.ly enables us to use a secure shortened URL, though you could alternatively use the free service provided by Social Server.

    I hope you have found this tutorial to be useful in creating your own "Invite Facebook Friends" link for your Blogger powered site. Please feel free to leave your comments and suggestions below.

  • trying this but when i enter details for facebook app it says 

    Error

    szsocial.com must be derived from one of: Site URLMobile Site URLCanvas URLSecure Canvas URLPage Tab URL orSecure Page Tab URL.

    http://bit.ly/szsocial?

    https://bit.ly/szsocial?

  • Thats exactly how it has to be configured and the tutorial is also a good one. I have implemented a similar one for another site (but on wp, see the sidebar). if time allows, I will covert it to an elgg plugin and upload here.

    - Mahin Akbar

  • @Team Webgalli sounds good please!!! i cant see a tuitorial on http://www.cheenachatti.com/ what i posted seems like the best way untill you get a plugin but its keeps giving me a error when i enter app details as you can see on page 1

    RE:

    trying this but when i enter details for facebook app it says 

    Error

    szsocial.com must be derived from one of: Site URLMobile Site URLCanvas URLSecure Canvas URLPage Tab URL orSecure Page Tab URL.

    http://bit.ly/szsocial?

    https://bit.ly/szsocial?

  • wow v nice!!!!!!!!!!!!!!! THANKS Team Webgalli !!!!!!!!!!!!!!!!!

  • szsocial.com must be derived from one of: Site URLMobile Site URLCanvas URLSecure Canvas URLPage Tab URL orSecure Page Tab URL.

    http://bit.ly/szsocial?

    https://bit.ly/szsocial?

    followed instructions from here http://www.webgalli.com/blog/invite-friends-facebook-elgg/

    Error

    There was a problem saving your changes. Please try again later.

  • AppsSzSocial2Basic
     

    Error

    There was a problem saving your changes. Please try again later.

      SzSocial2
    App ID: 00000000000000000
    App Secret: 0000000000000000000000000000(reset)
     
    This app is in Sandbox Mode(Only visible to Admins, Developers and Testers)

    Basic Info

    Display Name:
    Namespace:
    Contact Email:
    App Domains:
    szsocial.com
    Sandbox Mode:

    Select how your app integrates with Facebook

    Website with Facebook Login
    Site URL:
    App on Facebook
    Canvas Page:
    Canvas URL:
    Secure Canvas URL:
    Canvas Width:
    Canvas Height:
    Unity Integration Enabled:
    Mobile Web Bookmark my web app on Facebook mobile.
    Native iOS App Publish from my iOS app to Facebook.
    Native Android App Publish from my Android app to Facebook.
    Windows App Publish from my Windows app to Facebook.
    Page Tab Build a custom tab for Facebook Pages.
     

     

  • fixed 

     

    Select how your app integrates with Facebook

    Website with Facebook Login
    Site URL:
    App on Facebook
    Canvas Page:
    Canvas URL:
    Secure Canvas URL:
    Canvas Width:
    Canvas Height:
    Unity Integration Enabled: