Плагины Jquery для Twitter API

Последнее обновление 23 июля 2019 12:27:07 (UTC / GMT +8 часов)

script1adsense2code

script1adsense3code

Вступление

Плагины jquery для Twitter API - это простой и удобный способ использования функций API Twitter. В этой статье мы обсудим работу плагинов Jquery поверх Twitter API.

Tweetie

Плагин Jquery, который мы обсудим здесь, это Tweetie. это простой плагин Twitter Feed, который работает с новым API Twitter 1.1.

Для этого вам необходимо получить CONSUMER_KEY, CONSUMER_SECRET, ACCESS_TOKEN и ACCESS_SECRET. Вы можете найти подробное руководство о том, как получить это здесь .

Clone Tweetie для Github

 sudo git clone https://github.com/sonnyt/Tweetie.git

Предоставьте надлежащие разрешения папке Tweetie.

Отредактируйте файл config.php, присутствующий в папке api в Tweetie. Замените CONSUMER_KEY, CONSUMER_SECRET, ACCESS_TOKEN и ACCESS_SECRET вашими ключами.

Код для реализации плагина jQuery выглядит следующим образом

<!DOCTYPE html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>jQuery Tweetie Plugin example</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
    </head>
    <body>
	<div class="MyTweets">
        <div class="tweets"></div>
    </div>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript" src="tweetie.js"></script>
    <script type="text/javascript">
        $('.MyTweets .tweets').twittie({
            username: 'w3resource',
            list: 'sql',
            dateFormat: '%b. %d, %Y',
            template: '<strong class="date">{{date}}</strong> - {{screen_name}} {{tweet}}',
            count: 10
        }, function () {
            setInterval(function() {
                var item = $('.example2 .tweet ul').find('li:first');
                item.animate( {marginLeft: '-220px', 'opacity': '0'}, 500, function() {
                    $(this).detach().appendTo('.example2 .tweet ul').removeAttr('style');
                });
            }, 5000);
        });
    </script>
     </body>
</html>

Вы можете посмотреть живое демо здесь

Предыдущий: Twitter REST API Tutorial
Далее: учебник по Google Plus API