How to Embed a Twitter Widget
It’s any Twitter timeline, to-go.
With Twitter’s newly updated widget, which the company released at the beginning of September, you can embed the full Twitter.com experience on any website.
What does that mean? Now, you can re-create a timeline as you'd see it on Twitter, then post to any other site. From there, anyone who sees it can reply to you, reply to a specific tweet, retweet and favorite any tweets in the widget without leaving your site.
This is a huge help to anyone with a website looking to boost socical engagement. Creating ways that visitors can engage you on social media without leaving your content removes a cumbersome step from the social media equation. Now, the interaction can happen side-by-side.
Furthermore, the update allows you to embed the full timeline of any public user, that user's favorite tweets, any public list that you've created or that you're subscribed to, and any filtered search. And you can create it using Twitter's self-serve widget creation platform.
Here’s how to do it:
From your Twitter settings page, head to the widgets menu, then click “Create new.”
Here you’ll have to choose which kind of widget you want to create. There are several new kinds of widgets you can create with Twitter’s update: a Twitter user’s timeline, a Twitter user’s favorites list, a list you’ve created or that you’re subscribed to, or a filtered search.
To create a widget with a user’s timeline of tweets or favorites list, use the tabs across the top of the page to get to either the “User timeline” or “Favorites” section. Then, type in the name of the user who you want to create a widget for in the first field. You’ll see the list of tweets update to the right. Note that you won’t be able to embed the tweets for a user whose profile is not public.
To create a widget for a list, you can only choose those lists that you are subscribed to or that you’ve created. Go to the “List” tab, then choose the list you want from the first dropdown menu.
To embed a widget with a filtered search, click the “Search” tab.
You can use any term you’d like, and you only need to include a hashtag if you want only tweets that have hashtags in them. For example, if you search “corgi” you’ll get any tweet that mentions “corgi” anywhere, even those that have the hashtag. However, if you search “#corgi” you’ll only get tweets with the hashtag, and no tweets that merely mention the word itself.
Remember that you can also use Twitter’s advanced search functions to create your widget. Below, the search is filtered to show only tweets with “corgi” within 15 miles of New York City. Here’s a list of Twitter’s advanced search parameters, so you can brush up on your search technique.
Once you’ve picked what kind of widget you want to create and filled in the tweets you’d like to display, you can customize the look of your widget to fit your website.
Using the height adjuster, you can determine how long the embedded widget will be. Widgets can be no larger than 1200 pixels, and note that by increasing the height of your widget, it will not display more tweets. Rather, with a longer widget, people who visit will have to scroll down your page to see more tweets instead of scrolling through the tweets in the widget. Keep in mind the size of the page or post where you’re embedding the widget when picking its height: Twitter’s default widget height is 600 pixels.
Next, you can choose between a “Light” and “Dark” theme for your widget, which changes the background and border colors. But be careful to modify the color of the links in your widget so that people will be able to see them. Links are black by default, and if you change the theme to “Dark” it may be difficult to see the links.
Finally, one of the most important steps is correctly identifying the domain where you want to embed the widget. Without this, the widget will not display on your site. You can choose to opt-out of tailoring Twitter by checking the box below. Opting-out means that Twitter will not use data from your widget to give you tailored suggestions for people to follow.
When you’re comfortable with your customized widget, click “Create,” and you’ll see the embed code below the timeline. Copy this code and paste in your site or blog post, and you’ve got an automatically updating Twitter timeline!
Although the concept of embedding tweets is not actually new for Twitter, this updated version of Twitter’s widget lets your website's visitors engage with the tweets in your widget much like they would with any tweet on Twitter.com.
In the image above, you can see that when users roll over a tweet in the list, they can reply, retweet or favorite a tweet. There's even a field at the bottom of the widget where visitors can reply direcly to you, without leaving your site.
This update is a huge advantage for engaging new Twitter users, or people with whom you already interact. By removing the need for your website visitors to go to Twitter.com to engage, the Twitter widget creates a bridge from content to social: converting content consumers to social engagers is one step closer.
Social Media Today