How to Create a Twitter Faves Widget for Your Website

Social-Media-Ideas-GirlTwitter allows you to easily create a widget for your website that shows your latest favorite tweets. This guide will show you how to “favorite” a tweet and how to customize the widget for your website.

How to “Favorite” a Tweet

 

Yes, favorite is now a verb and for Twitter, you can “favorite” or bookmark some of the tweets you like best or want to refer to later. It’s easy to make a tweet one of your favorites. All you do is go to your timeline.


When you see a tweet you want to “favorite”, place your mouse over it and you will see some options appear:


If you click “Favorite”, the start will now be yellow and will become one of your favorite tweets.


As you can see above, you can remove the tweet from your favorites anytime by clicking “unfavorite”.

Once you have some favorite tweets, you are ready to use the Faves Widget on your website. You can add favorites anytime and the widget will continue to update.

Creating & Customizing Your Faves Widget

Navigate to: http://business.twitter.com/about/resources/widgets/widget_faves

And you’ll be immediately taken to the “Settings Page”.

Settings

On this page, you can specify the Twitter user. You can actually display the favorites of any account, as long as it’s not a private account.


 As you can see above, you can specify the username, a title for your widget and a caption. You can see a preview of how this will look when you look at the left side of the screen. We are showing that preview below. This is the default color, but don’t worry, you can edit the colors a little later on.


 

Preferences

Now you can click “Preferences” on the left menu and you’ll see a few options:


Let’s talk about these preference options mean…

  • Poll for New Results: Tweets will appear in real time if this is checked. Otherwise, static tweets will appear.
  • Include Scrollbar: This will include a scrollbar in the widget if checked.
  • Behavior: This section allows you to choose between “Timed interval” or “Load all tweets” and decide how many tweets to be shown in the widget. “Timed interval” means that new tweets will be shown up to the maximum at an interval you specify. “Load all tweets” means all the tweets will be loaded to the maximum, without any time interval.
  • Show Avatars: Choose this if you want the users’ avatars to appear beside each tweet.
  • Show Timestamps: Choose this if you want the timestamp to appear for each tweet.
  • Show Hashtags: Choose this if you want any hashtags in the tweets to appear. They will be clickable in the widget.

Appearance

Next, you’ll have the option to change the colors on your widget. You can match your website, come up with your own color scheme or whatever you wish. Simply click the color box and you can select a color using the easy color-selecting tool. Click “Done” when you’ve chosen the colors you want.


You can customize the background and text in the “shell”, which is the outer-edges of the widget. You can also specify the background and text of your actual tweets. And finally, you can specify the color of hyperlinks in the widget.

Dimensions

The final customization you can make to the widget are its dimensions. You can either a specify a height and width or you can choose “auto width” which will automatically resize the widget, according to the space provided and the height required to display the tweets.


Test Settings & Grab Code

Once you’ve adjusted all your settings, you can go to the bottom of the page and test the settings or grab the code. We’re going to grab the code for our web page.


Once we click “Finish & Grab Code” our code appears.


You can now copy and paste the code into your website. If you happen to use Blogger, you can use the handy Blogger tool to insert your widget. Here’s what our widget looks like:


Speak Your Mind

*

*