How to Add Twitter Widgets to Your Website or Blog
It’s Twitter Tip Tuesday — every Tuesday we’ll focus on one Twitter Tip and show you how to integrate it into your social media strategy. This week we’ll show you how to add the official Twitter Widgets to your website or blog.
Is your website “sticky”? What’s the bounce rate of your blog? When people visit your website or blog, are they sticking around, reading multiple pages, and clicking links, or are they bouncing off to another site that’s more engaging? Adding a Twitter Widget to your website or blog is a great way to pique your readers’ interest with a variety of interactive, Twitter content. In general, engaged website visitors stay on your site longer, click more links, and may even leave more comments on your articles. We’ll show you the types of Twitter Widgets available, and how to customize and insert them into your website or blog.
Twitter Profile Widget
Twitter’s Profile Widget lists the most recent tweets from any Twitter account you specify in the “Username” field. By default, the display box lists the Twitter account name and avatar, along with about three or four tweets.
The tweets are completely interactive and contain all the standard Twitter options, like “reply,” “retweet,” and “favorite.” Inserting the Twitter Profile Widget on your website or blog will give your visitors a glimpse of the topics you tweet about on Twitter.
To access the Twitter Profile Widget, visit the “Resources” page on Twitter, click the Widgets graphic, select the “My Website” link, and then select Profile Widget.
Twitter Search Widget
The Twitter Search Widget allows you to create a Twitter search query for any keyword, topic, or phrase, and display the results in real time. For example, you could create a search for tweets containing the word “widgets” (where “widgets” stands for any keyword that’s relevant to your business). Presumably, if your blog readers are interested enough to come to your blog to find out about a given topic, they might be interested in what tweeters have to say about that topic as well.
To construct a Search Widget, type a keyword in the field titled “Search Query” (you can also use operators like “+” to construct an advanced search query). Give the widget a title and a caption by filling in the corresponding fields.
To access the Twitter Search Widget, visit the “Resources” page on Twitter, click the Widgets graphic, select the “My Website” link, and then select Search Widget.
Twitter Faves Widget
Have some favorite tweets that you’d like to share with your blog readers? The Twitter Faves Widget displays tweets that you’ve tagged as “Favorite” on Twitter. When visitors to your site see your favorite tweets, it provides them some insight into what type of tweets, comments, and links that you consider important enough to save. You can select the username, title and caption for this widget by filling in the corresponding fields on the Settings page.
To access the Twitter Faves Widget, visit the “Resources” page on Twitter, click the Widgets graphic, select the “My Website” link, and then select Search Widget.
Twitter List Widget
Twitter Lists are groups of Twitter accounts that share something in common. For instance, you could create a Twitter List of all your Twitter followers who live in Chicago, or you could create a list of Twitter accounts having the word “salesperson” in their bios.
The Twitter List Widget allows you to highlight one of those lists, right on your website or blog. Like the other widgets, assign the Twitter account you’d like to use in the “Username” field, and add an appropriate title and caption, if you choose. Select the Twitter List you’d like to highlight by clicking the dropdown menu in the “List Name” field.
To access the Twitter Faves Widget, visit the “Resources” page on Twitter, click the Widgets graphic, select the “My Website” link, and then select List Widget.
Test, Customize, and Grab Your Widget’s Code
Twitter Widgets are fully customizable. For any given widget, click the “Preferences” tab to configure options such as the number of tweets displayed in the widget, and whether avatars, timestamps and hashtags are visible, by default.
Click the “Appearance” tab to configure the colors in the widget, including the background, borders, tweet text and links. Changes are automatically reflected in the sample widget to the right of the screen.
Finally, click the “Dimensions” tab to configure the width and height of the widget, in pixels. Changes are not automatically updated in the sample widget.
For each of the widgets and its corresponding options that you modify, click the “Test settings” button at the bottom of the page to see what your changes will look like. When you are happy with the customizations you’ve made, click the “Finish & Grab Code” button to generate the corresponding HTML code for the widget. Copy and paste the code wherever you’d like the widget to appear in your website or blog.
You Could be Featured on Twitter Tip Tuesday
We’d like to invite you to submit your own Twitter success stories to be considered for future Twitter Tip Tuesday articles. Our goal is to reiterate the value of using Twitter for business by highlighting real world success stories from our readers.