How To Add Together Recent Tweets Widget Inwards Blogger

Do you lot desire to practise a recent tweets widget that displays all the tweets you lot received from others? It volition non only growth your Social exposure, but readers volition likewise accept benefits from it. This widget is non similar our previous Twitter Slider. Though, the functionality is almost identical, but the styling is alone different. This Live Tweet widget displays all the recent tweets that a individual receives on a sure Twitter username. This widget industrial plant on JavaScript too amongst the assistance of Twitter API it derives all the tweets, too thence amongst the assistance CSS StyleSheet it becomes a perfect Live Tweets widget. In this article, nosotros volition travel sharing a Recent Tweets widget for Blogger users, but WordPress users tin likewise implement it on their websites.

RECENT TWEETS (DEMO)

How Does Recent Tweets Widget Works:

Since, nosotros believe inwards simplicity. Therefore, our developers conduct maintain pattern this widget amongst first-class functionalities. It is an automatic Live Tweet widget that displays tweets of dissimilar users. For Example, a individual selects #mybloggerlab tag from the widget’s setting. Now whenever, whatsoever user volition work (#mybloggerlab) tag inwards their tweets. This widget volition automatically fetch too display them. Following is the screenshot of Recent Tweets Widget.

Features of MBL Recent Tweets Widget:

• It volition display all the tweets that a individual volition have from dissimilar users. 
• This widget is interactive. Therefore, tweets volition update instantly.
• It has a compact aspect which volition sure as shooting growth the beauty of a website.
• It industrial plant perfectly on almost each too every browser i.e. Chrome, Internet explorer too etc.
• This widget is highly compressed. Thus, it non affects a person’s site Speed.

How to Install Recent Tweet Widget inwards Blogger:

The steps are pose into words inwards such a agency that both blogger too whatsoever ordinary individual tin easily integrate this widget inwards their website. Follow the next instruction. 

• Go to Blogger >> Template.
• Take Backup of Template.
• Then Select Edit HTML >> Proceed.
• In The Template Search For ]]></b:skin> and higher upward it glue the next Style canvas Code.

#mblfeedtop {
width: 280px;
height: 79px;
margin-bottom:-6px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCgB8GMKTeQz9D7qT8QaS5tqQsP7S_DycStmhuB2QhGD055-KTpw9Ld6w3AK0lbWFvom2Os4Yc5-cFvXIAOCh8CEzJWRiSAXnXTw955OxDngMSHhJRB1TWy1FdRpNM4JnxjUJuCTFxQ_Y/s1600/MBL_TOPPER.png) no-repeat;
}

#mblfeedbottom {
width: 280px;
height: 7px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcWe44Zh6CRuVgRO_jthrjdsqqMSoXI05GNayDVDiNktxZmH7C6LqGY7bGY27DmoPlmqUDzwg9MTfkpj5Vik1hFENRLUantSW_goZKhrcF44uE4ujimX67hikMtTs4oPpjsirTiq3-D_Y/s1600/MBL_BOTTOM.png) no-repeat;
}

#mblfeedinner {
     width: 280px;
     font-family: Arial, Verdana, sans-serif;
     font-size: 12px;
     color: #000000;
}

.ttw-date {
     color: #949494 !important;
     display: block;
}

#mblfeedinner a {
     text-decoration: none;
     color: #095f8f;
}

#mblfeedinner ul {
     margin: 0;
     padding: 0;
     list-style: none;
}

#mblfeedinner ul li {
background: #63defa url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiXMXCcyhbdQXhEUOf4du-ZW5ScbmSZVnF-CFflOqWUp_aqUu6c1oQqT7OgEUntRubkYOW00Sy60Xvp14Kj9FGbjAl2Y2J6tVZvNyyEJWvqSpcd_KwLGfJooY1LN9SN9B5ZSMoophyphenhyphen4BA/s1600/MBL_DIVIDER.png) repeat-x;
padding: 11px 9px;
min-height: 42px;
}

.ttw-body {
     display: block;
}

#mblfeedinner img {
     margin-right: 10px;
     float: left;
}

#mblfeedinner rigid {
     margin-right: 5px;
}

• Again inwards the template search for </head> too higher upward it glue the next JavaScript code.

<script type="text/javascript" src="https://mybloggerlab.googlecode.com/files/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="https://mybloggerlab.googlecode.com/files/jquery.jtweetsanywhere-1.3.1.min.js"></script>
 
    <script>
/*$(document).ready(function(){
    $('div#mblfeedinner').twitterTrackbacks({
        url:'http://twitter.com/mybloggerlab',
        n:4,
        show_n:0,
        image_width: 42,
        reply: '',
        retweet: '',
        info: '',
        show_author: 1
    });
});
$(document).ready(function(){
      $('div#mblfeedinner').relatedTweets({
         query: 'mybloggerlab',
         realtime:0,
         n:4,
         image_width: 42,
         show_source: 0
      });
   });
*/
$(document).ready(function(){
    $('#mblfeedinner').jTweetsAnywhere({
        username: '',
        searchParams: 'q=mybloggerlab',
        count: 3,
        showTweetFeed: {
            showProfileImages: true,
            showUserScreenNames: true
        },
        showTweetBox: {
            label: '<span style="color: #303030">Spread the discussion ...</span>'
        }
    });
});
</script>

• Replace mybloggerlab amongst your twitter user name.
• Now Save the template too drib dead on to the adjacent step.

How To Add Recent Tweet Widget In Blogger:

• Go To Blogger >> Layout >> Add a Gadget.
• Now From the List Select Add HTML/JavaScript.
• Now inside the HTML Box glue the next Code.

            <div id="mblfeedtop"></div>
            <div id="mblfeedinner"></div>
            <div id="mblfeedbottom"></div>

All Done: After pasting the higher upward HTML Coding drib dead ahead too salve the template yesteryear pressing Save Bottom. Now catch your website too bask the unforgotten perfection. 

From the Editor’s Desk:

Hope you lot guys conduct maintain adored today’s Tutorial. Since, the PageRank Update is close why non larn a Dofollow Backlink from Pinterest. According to our estimates, Page Rank volition travel updated inwards betwixt 10 Nov to v December. What are your thoughts close this widget? What is your expectation close the Page Rank Update? Don’t forget to larn out your precious comment. Take a lot attention of your families till too thence Peace, Blessings too happy tweeting.