Top 30 sites for freelancers
Every site you'll ever need! check it out →

How to Create a Twitter Widget for your Site

How to Create a Twitter Widget for your Site

Twitter is undeniably quite huge at the moment. As one of the biggest Social Networks on the internet, only competing with the likes of Facebook. However, wouldn’t it be completely wrong for your website to miss out on the fun? Why not embed all your latest tweets into the sidebar (or just about any other area) of your website. We’ve got a handy quite on just how to do so…

Get yourself over to the Twitter widget selection page, which can be found right here. From this page, select “Create new” in the top right corner of your page. After you have selected this, you’re now ready to continue you on and select the options and configuration for your Widget.

Twitter Widgets 1


This is quite a simple process and shouldn’t take too long at all. First of all, we need to select the Twitter account that we would like to display tweets for. For this tutorial, we’ll be using the Young Web Builder Twitter account. Just simply enter the username for the account you want to display tweets for. Remember, this doesn’t include the ‘@’ symbol. From here, you’ll also need to select if you want to display reply tweets or not.

You’ll now need to alter the design aspects of your widget. Here, you’ll most likely need to tailor these options to the design and theme of your website. The first option being to choose an appropriate height for your widget, you’ll need to explore how much room you have to play with on your site, but if you’re unsure, just keep it as the default “600” and alter it accordingly from there. You’ll also need to choose between two themes of “light” and “dark”, which fit your site and also select if you wish photos to be auto-expanded (shown large) in the stream.

The last option that you’ll need to complete is the “link color” for your website, you’ll typically want this to fit the colour of the rest of the links on your website. Again, if you’re not too sure, just keep it as the default blue and it should fit just fine. The final option is to opt out of tailoring Twitter, if you’re not too sure what this is about, it’s fine to leave it unchecked.

Finally, choose Save Changes an grab your HTML code from the bottom of the page. You’re then free to embed this on any web page. Look out for more tutorials soon about creating social widgets and if you need any help, shout out in the comments!

Written by Josh M-J

I started building websites at the age of 12, I am now an extremely respected Video Games and Technology Journalist. I currently work with some extremely big names, such as Nintendo and others.