Quick Tip: Fun with Twitter Feed Widgets


In Ghostbusters, they always say "don't cross the streams," but this Hoop.la tip will help you do that (without getting slimed).

Twitter offers a simple way to get embed code. And you can use this embed code in a Hoop.la custom widget to present dynamic Twitter content within your community. 

You can do lots of fun things with this tool. For example, you can use Twitter lists to present combined feeds, you can pull in a hashtag stream, or you can display your Twitter badge (with a "follow me" link).

Here's how to put some Twitter in your Hoop.la:

In this example, we'll be making a widget using Twitter Lists to combine several feeds. The first thing you need to do is create a Twitter List that contains the feeds you want to show in your Hoop.a widget.

  1. In your browser, go to Twitter (make sure you're logged in).
  2. Click your avatar to open the Profile and Settings menu. Click Lists.
  3. Click the Create New List button. Fill in the name and description, and save the list. Use the search box to find the accounts you want to add to the list.
  4. Once the list is created, copy the URL of the list.
  5. Next, we're going to create the List Widget. Still in your Profile and Settings area on Twitter, click Widgets in the left side navigation.
  6. Click the "Create New" button to open the selection menu. Select "List."
  7. Paste the URL to the Twitter list you created in the first step.
  8. Once you submit the URL, you'll see code that you can copy. Note that the default size of the widget is HUGE. If you want to put this widget in the right column of your Hoop.la community, you'll want to click "Set Customization Options." For the width, set it to 300, and you may want to make the height smaller as well.

Screen Shot 2016-08-02 at 1.46.26 PM

Note: You don't have to use one of your own Twitter Lists; you can use this tip with any public List. Same thing applies for other Twitter feeds or hashtags; any public content can be turned into a widget.

Now let's make a custom widget in your Hoop.la community, so you can display this beautiful stream.

  1. In your Hoop.la control panel, go to Manage Widgets.
  2. Click "Add Custom Widget."
  3. Paste your embed code from Twitter into the Widget Content/HTML box, and give it a title. You can also put it within a standard Hoop.la widget box if you like.Screen Shot 2016-08-02 at 1.50.54 PM
  4. Click Update Widgets.
  5. Now go to the page in your Hoop.la community where you want the new widget to appear, and click Manage Widgets.
  6. Click Add Widget, and then choose Custom Widgets. You new widget title should appear so you can select it.
  7. Click "Exit Edit Mode" to return to your page and see the live stream!

Screen Shot 2016-08-02 at 1.54.51 PM

Have you done anything creative with embedded social content? Feel free to share your own tricks here!

Featured image via Flickr CC: renee.


Photos (3)

Add Comment

Comments (0)