Moodle Twitter Widget

Did you know you can display tweets from Twitter in a Moodle Block using Twitter's official Widget tool? It is possible to display tweets from a single account, from multiple accounts, your own favourite tweets or tweets based on a search such as a hashtag. You will need a Twitter account to create the Widget.

It is a simple two-step process

1. Create a Twitter Widget in Twitter Widget Configurator which produces some HTML code.
2. Add an HTML block containing the Widget HTML code to your Moodle module.

Create your Twitter widget

Login to Twitter and go to Settings, then Widgets

• Click the Create new button
• Choose one of the 4 Timeline options: User Timeline, Favorites, List or Search.
• Complete the form. There are some timeline specific options and then some common settings that are used by all timelines.
  • User Timeline - type a username (your own or another user). You can also choose whether to include Replies in the timeline.
  • Favorites - type a username (your own or another user).
  • List - select a pre-prepared List
  • Search - type a keyword or #hashtag in the Search query box. You can also choose to restrict the timeline to the top tweets only and to apply safe search filter.
  • Optional - Amend the common settings:
  • Options: Untick Auto-expand photos to remove photos from your timeline.
  • Height: Increase or decrease the height of the timeline. (The default 600px will display roughly 4 or 5 tweets)
  • Theme: Choose Light or Dark. (Light is recommended for Moodle)
  • Link Colour: You can keep the standard blue or use City red by pasting "c9282e" in the pop-up and clicking Done.
• Click Create Widget to generate the HTML code for your Widget.  It will be displayed on the right below the Widget preview.
   
• Copy the code to use it in the next step - Adding the Twitter Widget to a Moodle HTML Block

Adding the Twitter Widget to a Moodle HTML Block

• In Moodle, turn editing on in your course

• Scroll down until you find "Add a block"
• Use the drop down menu to select HTML block

• Scroll down and find the new HTML block; click on the spanner to ‘configure’ the block

• Enter the Block title as ‘Twitter Feed’
• Click the HTML button in the toolbar

• Paste the Widget code you copied from Twitter into the HTML source editor and update

• Save changes