December 23, 2012

How to Display Tweets of an User or List on Your Website




Do you love Twitter? Twitter is quite a different platform from other popular social networks such as Facebook and Google+. But best for small talks and conversations, and could be get long enough too. If you have a Twitter account, you can easily add Twitter follow button on your site and let your visitors follow you rightaway without asking them to jump on Twitter. But what if you want more than just adding a follow button? I mean, what if you wanna embed your tweets on your blog or website?


Displaying a Tweet?


Now you may thinking about embedding tweets? Nope, it's not what I'm referring here. How about showing off real-time Twitter updates on your blog or website? It doesn't help you gain bunch of followers, but it allows your site visitors to interact with your Twitter profile while they are on your site. It will help you get more exposure on your tweets as it's not like being on Twitter. When you are on Twitter your updates will be get buried in few seconds, but what if you can show only your tweets to the users? But, is it possible?


Twitter Timeline Widgets


Yeah, it's possible. Now Twitter let you promote public tweets on your blog or website with the timeline widgets. It doesn't need to be your Twitter profile. You can use any public account for this purpose if you find their tweets adding value for your visitors by showing off on your site. Simply you just have to customize your preferred widget and embed it on your site wherever you need it to display. The widget is not only capable of showing tweets of a particular account, but also it can display favorited tweets, tweets of people in your Twitter list or tweets match with any query of your choice. Fascinating. Ins't it? Let's figure out how you can customize and add widgets to your blog or website.


Steps:

1. Sign in to your Twitter account.

2. Click on gear icon on the top.

3. Now select Settings.


4. Jump to Widgets tab from the left pane.

5. Click Create New button on the page.

6. Now you will be directed to Widget Configurator. There you can select which source need to be used for your widget - User Timeline, Favorites, List or Search.

User Timeline

Here you can configure your widget to display any public Twitter user timeline with all recent tweets on it. All you need is entering your preferred Twitter username in Username field and other options are self-descriptive. You can prevent showing off replies but tweets and retweets of that tweep.



Favorites

Here you will able to pull out favorite tweets of any tweep with a public account and display on the widget. Just input Twitter username in Username field and customize other options as you prefer.



List

This will let you show off tweets of the tweeps in any of your Twitter lists. If you have created Twitter lists, this will come in handy as you can promote their tweets. Select a list from your lists and start customizing widget with available options.



Search

If you wanna show tweets with a matching query or hashtag, this is the best option. Enter the query or hashtag in Search Query field and start customizing widget with available options.


7. Once you done with customization, click Create widget button.

8. You will get the code snippet for your customized widget and use it on your website where you need it to be appeared.

Note: If you are a Blogger user and wanna add it as an element, you can add your button code snippet via HTML/JavaScript element. Read How to Add an External Widget or Codes to Blogger. Else if you wanna render it in a Blogger post or page, read How to Embed External Content on Your Blogger Posts or Pages.


More Information:

* You can edit or delete your created widgets at Twitter Widget Settings page.


Enjoy :-)




Awesome! Thanks for coming by and taking your time to read this post :) I hope you have learnt something today. Now you can share it with your friends and I'd love to hear from you too.






Related Posts and Categories


Category, , ,





Comments

* Make sure your comment is genuine and comply with our commenting guidelines.

* Review your email and reply notification settings to receive replies via email.


Lisa Buben said...

Very nice Mayura! Thanks for the mention too. Interesting there are more ways to do it now, for a while I had a plug-in I was using but it slowed down my site, maybe using coding would work better. I had not seen the one from a list before. Really like that one - got me thinking away here.

Mayura De Silva said...

Hi Lisa,


Quite a time I was wondering what happened to old Twitter widgets as I clean up obsolete posts on my blog dear :) I couldn't find anything, and lately I saw there have been moved to Settings. And now with more features and options ;)


Don't you love the the follow button on it and ability to tweet instantly? :) I think you do. Even lists are possible. Now much easier to generate code and you got to add to your blog dear :) No lagging and update real-time.


Hope you enjoy new timeline widgets Lisa :)


Thanks for coming by and sharing your views on these Twitter widgets dear :)


Cheers...

Henri Ligsay said...

Hi Mayura, I followed your comment from one of my blogs, to your g+ profile up to this post, :-)

It's been a long time now that I had not posted on my blogs until last night.

I like your blog page, it's neat and clean. I specially like the picture title for each post, it makes it easy to pin, and it's really standing out to you as if to say pin me. :-)



I will be back to writing again, and will be redesigning my blog, and your page is one of the inspiration.


Including a twitter stream in the blog might be an option to consider so I ended up reading this post.


Actually, I will be reading some of your posts too as they are inviting, :-)


Thank you very much!

Susan said...

Great post, Mayura. I guess I had better start making Lists on my Twitter account! I like the idea of being able to share Favorite Tweets too! Thank you, Mayura, for including me in your blog post!

Tim Bonner said...

Hi Mayura

I have my Twitter feed at the bottom of my blog, mainly because it's an option on the WordPress theme I'm using.

I thought about putting one in the sidebar a while ago but like Lisa mentions all of the plugins I looked at slowed my site down.

I like the look of this way of doing things though. Thanks for sharing!

Enjoy the rest of your weekend.

Harleena Singh said...

This surely is interesting Mayura!


Thanks for the mention - :) I loved the way you capture these so well and display them on your blog posts too.


I did have a widget for twitter long back when I was on Bloggers, but that just used to put up all my tweets one after the other - nothing more and nothing less. It was the same when i shifted to Wordpress too, but like Lisa mentioned, it slows down the site and so I removed the twitter and Facebook widgets from my blog. However, I am sure these would not cause any problem where the site speed is concerned, or do they?


Thanks once again for sharing these with all of us. :)

Mayura De Silva said...

Hi Henri,

Ha ha... Finally you landed here. Glad to see you and welcome here mate :)

Nice to hear that you are back to blogging. I didn't know you weren't writing for some time. lol :D Long time from last night?

I've been used to create simple images in my own way 'cause there are copyrights attached when using other images mate :) They are not best ones, but I'm pretty satisfied with all.

Anyway, wish you all the best with blogging and redesigning is a great way to start fresh with new year too. Then you can think about adding Twitter stream if you like mate ;)

Really glad to hear your compliments about my blog and hope posts here will help you in some way :)


Thanks for coming over and sharing your views here :)


Cheers...

Mayura De Silva said...

Hi Susan,


Ah... Lisa saying the same thing, but you guys are on my Twitter stream. Now how about that? :D lol...


Yeah Susan, favorites may come in handy in most situation, for example, for a brand they can favorite mentions of the brand and show off to visitors on the page as like testimonials or positive feedback.


Thanks for coming by and sharing your thoughts dear :)


Cheers...

Mayura De Silva said...

Hey Tim,

Ah... You have one already ;) Is it to display only the tweets or capable of interact with you instantly as here mate? Well, I'll see when I'll be there of course.

Oh yeah, plugins need to use with care mate :) They occupy more resources and slow down the page. As my experience these widgets are more light-weight than the previous ones as it comes under a new Twitter API.


Anyway you have to try it on and see if it is helping you blog or dragging performance down as there are factors such as theme, other plugins 'cause inconsistencies :)



Thanks for coming by and sharing your thoughts on Twitter widgets mate :)


Have a wonderful weekend ahead...


Cheers...

Mayura De Silva said...

Hi Harleena,

Aha... I'm following you on Twitter so there's the possibility to be mentioned in a screenshot, no? ;)

Twitter widgets are based on JavaScript like Snow plugins, so the scripting needs more resources to work well there. I've used previous widget that shows only tweets on it and compared to that, new widgets are much responsive and light-weight.


They are specifically built to be friendly with mobile and touch devices dear. So you can think how much improved it is to be compatible with :) Well, it affects on performance, but not much now.

Anyway you need to have it implemented there and see how it affects on yours Harleena 'cause when it comes to running scripts, the theme, other widgets/plugins may interfere :)

Thanks for coming over and sharing your experience and thoughts on Twitter widgets dear :)

Cheers...

Sapna said...

Hi Mayura

That's a great knowledge shared.Whenever I am going to use this, I will refer your post as was the case with android app builder.

Sapna

Corinne Rodrigues said...

Thanks for this, Mayura. I've been wondering about whether to put my Twitter updates on my site or not. I'm not very consistent with Twitter so I'll hold back until I am.

Brenda Lee said...

Fabulous tutorial Mayura! You always go above and beyond to show others helpful tips! Rock on my friend!

Vidya Sury said...

Cool. Just two weeks ago, I was looking for this. :-) I also wanted to embed a Facebook thread in a blog post but never figured out how to do that. Thanks for this tut, Mayura. :-) One question though - when we embed, are all the links live?

Mayura De Silva said...

Hi Sapna,



I hope you find this helpful whenever your wanna promote your Twitter profile or interesting tweets on your blog dear :) Well, try it out and see how helpful it is for you.


Thanks for coming by and commenting here Sapna :)


Cheers...

Mayura De Silva said...

Hi Corinne,


Well, that's something to think about dear :) Mmm... I think you can use it as a way to interact with readers as they can directly tweet you from there. Or to show off your favorites? ;)

Alrighty Corinne, hope you can make use of 'em when you find the time to go with it dear :)


Thanks for coming by and sharing your views about widgets dear :)


Cheers...

Sapna said...

HI Mayura


Thanks for giving opportunity to comment. But really twitter is all about spamming, who is reading message every second, I don't want to.


Thanks
Sapna

Mayura De Silva said...

Hi Brenda,

You liking 'em? ;) You can try it on your blog too. I think Girly Parts would go with it as you tweet up your stuff there ;) Hmm... Well, hope you can take a little help here Brenda.

Thanks for coming over and love to hear your compliments Brenda :) Always encouraging and we all rock n roll, don't we my friend? ;)



Cheers...

Sapna said...

1 more query out of context, The comments on your post are showing in which order. Is it order by date or order by name.....I couldn't make out.


Thanks
Sapna

Mayura De Silva said...

Hi Vidya,


Oh if you let me know I'd post this two weeks ago Vidya ;) lol... Really, I had it ready and scheduled to post today as I don't wanna overdo posting dear.

Ah you told me about that, no? :) Still Facebook don't offer that capability, but there's a way to embed your posts on Facebook but not with comments though. I'm not sure, I wanna give it a look.


Absolutely it's LIVE Vidya :) Update real-time and anyone can tweet, retweet, favorite tweets on the widget. How about that? ;)


Thanks for coming over and sharing your thoughts about embedding Twitter timeline dear :)


Cheers...

Mayura De Silva said...

Ah... Sorry for any inconvenience dear :)

By default, Disqus display comments with most likes on the thread dear :)

You can always change the order of comments by clicking on "Discussion" tab. That's what I do always :)

Cheers...

Mayura De Silva said...

lol :D Well, you might having bunch of followers then who share only links dear. Same goes for other networks if you follow that much people.

I always talk to people on Twitter and other social networks too :) Anyway block anyone spamming there.

Cheers...

SHORYA bist said...

Hi Mayura,


Thanks for sharing this useful information.One best thing about your articles is you make it very simple for the users by each and every thing explaining with examples.
Great work bro its always a good experience visiting your blog.


Thank You
Shorya Bist
From Youthofest

Margarita Slavkova said...

Mayura,

this is again an awesome tutorial for "non-tech" bloggers like me. :) I developed a habit, when I don't know how to do something, I come straight to your blog. Great service to the bloggers community.

Mayura De Silva said...

Hi Shorya,


Ha ha... Thank you mate :) That's what I believe in when it comes to tutorials or especially telling something 'cause it's not few group I wanna fit in with :) I've been there and didn't know any.

Thank you for coming and sharing your thoughts about blog posts mate :)

Cheers...

Mayura De Silva said...

Hi Margarita,


Ha ha... My aim for "non-tech" bloggers to be "tech" bloggers dear ;) No matter what, everyday, someone comes online with no idea. I was one that days and I know that dear :) If someone make use of it, I'm happy...

Really glad to hear mostly they are easy to follow and you are visiting here to take a little help from 'em dear :)


Thanks for coming by and sharing your thoughts about tutorials here Margarita :) Really appreciate compliments you have given me all the time.


Cheers...

Carolyn Nicander Mohr said...

Lol, Margarita, I'm a tech blogger, but I don't code so I find Mayura's helpful explanations extremely valuable. He's a treasure!

Carolyn Nicander Mohr said...

Hi Mayura, Excellent, clear explanation of how we can achieve this without a plugin. Your solution seems extremely simple, you explained it so well!


i like this better than a plugin, Mayura. This would be much faster plus it's more versatile. Thanks once again for your sage guidance, my friend!

Neamat Tawadrous said...

Hi Mayura,

That's such a great tutorial post. I am new to your blog but I can see that I can learn a lot of techy stuff here. Sure, I will need to refer to this post again and I will have to read more tutorial posts that I found here in your blog.

Thanks for sharing your knowledge.

Be Blessed,

Neamat

Mayura De Silva said...

Hi Carolyn,

Absolutely dear :) Old Twitter widgets were redesigned and made specifically for mobile and touch devices. Now a whole lot of improvement there with faster and responsive design and interaction made easy, no? ;)

Ah... The steps are quite easy to follow, no Carolyn? :) Well, that's how Twitter made it, not me actually :)

Thanks for coming by and sharing your thoughts about Twitter widgets dear :) Really appreciate your wonderful compliments that encourages me as well my friend :)

Cheers...

Mayura De Silva said...

Hi Neamat,

You're most welcome to my virtual home place dear :)

Absolutely, take your time and explore what you can find helpful dear :) Glad if you can enjoy 'em and find helpful for you some way. Isn't it what bloggers expecting all the time? :)

Thanks for stopping by and sharing your thoughts about the post and my blog :) Appreciate your compliments too dear.

Sending blessings on your way too :)

Cheers...

Mayura De Silva said...

Ha ha... Thank you Carolyn :) I think we all are livin' in a treasure island and I can say we all are treasures in some way. What do you say? ;)

Cheers...

Adrienne said...

This is something that more and more people are putting on their blogs Mayura and who best to show them how. Glad my tweet ended up in your search results for this post, thanks!!!

Now as far as displaying tweets on your blog, I really don't think it's a very good idea. Want to know why! Because it takes your readers away from your blog and remember, this is the only prime real estate you actually own online. You don't want them heading off to check out a tweet before they have finished reading your post. People get so distracted.


Of course they are doing to do what they want anyway so at least now they know how if that's what they want right!


Thanks Mayura, you also share the best tutorials.


~Adrienne

Mayura De Silva said...

Hi Adrienne,

NOW that's the best point to consider here about this widget Adrienne ;) I agree that sending users away is something we do unwittingly by putting such widgets if we really don't want them to go away and check out profile.

But this is a different experience dear ;) All you do on Twitter can be done on this widgets. Users can tweet you rightaway, retweet, favorite, reply and follow too ;) Now how about that?

The old Twitter widget was lack of some options and mostly it tends to send people to Twitter :) But now, you are safe and people stay on your blog while interacting with you on Twitter ;) Cool, nah?

Thanks for coming over and sharing your wonderful thoughts with the tip that mostly we are not aware dear :)

Cheers...