Twitter seems to be making it harder and harder to pull your own content out of their ecosystem.
They recently changed their API over to v1.1, and now require all requests to be authenticated using OAuth. Even simple GET requests need OAuth. Setting up OAuth is a pain, if all you want to do is display a list of tweets.
The simplest way to display a list of tweets is to use Twitter’s embedded timelines. Not only can you use them to display tweets, but you can also use them to display search results, favorites and lists.
To create a timeline log in to Twitter and go to Settings -> Widgets, click on “Create new” and define your timeline.
You can add a timeline in two ways: copy the generated HTML code into a block or use the Twitter Block module.
In this tutorial, I’ll show you how to display an embedded timeline using the Twitter Block module. The module offers a few benefits over just copying HTML code into a block. The biggest benefit to using Twitter Block is the ability to configure a timeline’s options using a form.
Also, if you’re going to allow users to copy HTML code into a block, they need access to the “Full HTML” text format, which could be a security issue.
Getting Started
Just download and install Twitter Block and make sure you install the core Block module.
Create Embedded Timeline
Log into twitter.com and go to Settings -> Widgets (make sure you’re logged in) and create a widget.
Once you have configured the widget click on “Create widget”.
The next thing you need to do is get the widget ID that we need for the module. You can copy the ID directly from the URL after creating the widget. Just grab the long ID number after /widgets.
Or you can get the ID from the text area that has the embedded HTML code, just search for the data-widget-id attribute.
Create Block
Now that we have created our widget, and we have the widget ID, it is time to use Twitter Block to display the timeline.
Go to Structure -> Blocks and click on “Add Twitter block”.
Paste the ID into the “Widget ID” field, enter a block description and click on “Save Block”.
Assign the block to a region and then click on “Save blocks”.
Now if we go to the homepage, we should see the block.
By default, the module displays a single tweet, but in the next release it’ll default to “Auto” (view issue for more details). Change the “Tweet limit” drop-down list on the block edit page to display more tweets.
You can display a maximum of 20 tweets. This limit is set by Twitter and not by the module. For more details go to the documentation page and search for “Tweet limit”.
Twitter Block is brilliant at displaying embedded timelines and that’s it. If you need to do any type of custom integration; then you’ll have to use the Twitter module.
The Twitter Pull module for Drupal offers similar functionality it allows you to pull in and display tweets. However, there is an issue to update the module to use Twitter’s latest v1.1 API.
UPDATE: Twitter Pull version 7.x-2.0-alpha1 supports Twitter’s latest v1.1 API. View issue for more details.
Great article. Lets see how long we can use this method before Twitter changes the system again 🙂
Heheh, absolutely true. 🙂
The twitter block works well and is easy to set up. I’d like to just display the actual tweet though, without the logo, full name and twitter handle. It just fits nicer into the layout on my front page in a “Latest Tweet” section. Unfortunately, everything is displayed via iframe which keeps me from CSS targeting containers like the p-author to hide them. Do you have any thoughts or ideas about that?
Cheers 🙂
That is a limitation of Twitter’s embedded timelines. 🙁
Look at the 7.x-2.0-alpha1 version of Twitter Pull (https://drupal.org/project/twitter_pull). I haven’t used the 7.x2.0 version of Twitter pull, but it may give you more flexibility in how the tweets a displayed..
Sweet, thanks for the suggestion. I’ll give that a try!