How to Create a Twitter Widget for Your Website or Blog

Show off your Twitter presence with a great looking widget

An image of the Twitter app loading on a smartphone.

Chesnot / Getty Images

Many people use Twitter clients to update their status and read tweets, but there are also a host of useful Twitter widgets that you can publish on a blog or website.

These widgets allow you to do things like show your latest tweets, inform visitors of a relevant hashtag, or showcase a particular moment.

Access the Widgets Tab From Your Twitter Account Settings

Twitter.com Widget section

Sign in to your Twitter account from a web browser by visiting Twitter.com.

Click your profile photo icon in the top right corner of the screen and select Settings and privacy from the dropdown menu. In the left sidebar, click the Widgets option.

On the Widgets tab, click the Create New button. Several options appear in a dropdown menu; click any one of them. They all open up to the same new page where you'll be able to select the kind of widget you want to publish.

Select the Type of Twitter Content You Want to Embed

Twitter.com embed screen

On the following page, click the down arrow in the Enter a Twitter URL field to see the list of options available for the types of content you can transform into Twitter widgets.

These include:

  • A collection
  • A tweet
  • A profile
  • A list
  • A moment
  • A likes timeline
  • A user handle
  • A hashtag

Select any of the default URLs to see an example of what the widget looks like.

Get the Twitter URL of the Content You Want in Your Widget

Twitter.com display options

If you don't already have the Twitter URL ready for the content you want in your widget, you'll have to open a new browser tab or window to navigate to Twitter.com and find the collection, tweet, profile, list or other content types you want.

Once you've found it, copy the URL and go back to the Twitter widget publishing tab to paste the URL into the Enter a Twitter URL field.

After pasting the URL into the field, click the arrow pointing right to move to the next step.

Choose Your Display Options

Twitter.com display options

After entering in a URL, you'll be asked to select from the available display options. Different display options will be available depending on the type of content you've chosen for your widget.

Copy the Embed Code and Paste It Into Your Website or Blog's Code

Twitter.com preview page

You'll be shown a preview of what your widget looks like plus a string of code right above the preview.

If you're happy with the way your widget looks, click the blue Copy Code button to copy the code and paste it somewhere in the code of your website or blog. The height and width of the widget is built to be flexible, so it should remain within the constraints of the area of your blog or site where you're featuring it.

If you want to change something about the widget, click set customization options to see what changes can be made.