Social-feed

The jQuery plugin which shows a user feed from the most popular social networks.
Currently are supported: Facebook, Instagram, VK, Google+, (Twitter is currently not supported)

---

If you use this plugin, please write me a short message with a link to the project where you embed the plugin, and some features you want to have implemented here. It will help me to stay focused on the important issues and see the global picture!
It is not mandatory, but I really appreciate it!

Attention: After Twitter has prohibided an anonymous fetching of tweets - this function is currently not supported. Wait an update with a fix.

Check out my other projects: http://kucherbaev.com

Getting started

Connect css:

    <!-- Social-feed css -->
    <link href="css/jquery.socialfeed.css" rel="stylesheet" type="text/css">
    <!-- font-awesome for social network icons -->
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">

Create a container for your feed:

    <div class="social-feed-container"></div>

Connect js:

    <!-- jQuery -->
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>

    <!-- doT.js for rendering templates and moment.js for showing time ago -->
    <script src="dependencies/doT.min.js"></script>
    <script src="dependencies/moment.min.js"></script>

    <!-- Social-feed js -->
    <script src="js/jquery.socialfeed.js"></script>

Initialize the social-feed plugin:

<script>
$(document).ready(function(){
    $('.social-feed-container').socialfeed({
                // FACEBOOK
                facebook:{
                    accounts:['@teslamotors','#teslamotors'],
                    limit:2,
                    access_token:'YOUR_FACEBOOK_ACCESS_TOKEN' // APP_ID|APP_SECRET
                },
                // VK
                vk:{
                    accounts:['@125936523','#teslamotors'], 
                    limit:2,
                    source:'all'
                },
                // GOOGLEPLUS
                google:{
                     access_token: 'YOUR_GOOGLE_PLUS_ACCESS_TOKEN', 
                     accounts: ['#teslamotors'],
                     limit: 2
                 },
                // INSTAGRAM
                instagram:{
                    accounts:['@teslamotors','#teslamotors'],
                    client_id:'YOUR_INSTAGRAM_CLIENT_ID',
                    limit:2
                },
                // BLOGSPOT
                /*blogspot:{
                    accounts:['@iman-khaghanifar']
                },*/
                // GENERAL SETTINGS
                length:400,
                show_media:true,
                // Moderation function - if returns false, template will have class hidden
                moderation: function(content){
                    return  (content.text) ? content.text.indexOf('fuck') == -1 : true;
                },
                //update_period: 5000,
                // When all the posts are collected and displayed - this function is evoked
                callback: function(){
                    console.log('all posts are collected');
                }
            });
    });
    </script>

When you run the plugin, make sure that you have your webserver running

If you want to change the layout of the feed, you can do it in the template.html file.
Also you can simply create template as a string and pass it as template_html parameter. If you don't need to show the feed from all the supported social networks, put the credentials only for those you need.

Dependencies:

- http://fontawesome.io/ - for displaying icons of social networks - http://momentjs.com/ - for displaying time ago - http://olado.github.io/doT/ - for rendering templates

License:

MIT