How to put a Twitter badge on your blog
Look down my sidebar and you’ll see a large purple box, or badge, that shows my latest Twitter updates.
Today I’ll show you how to put one up on your WordPress.org blog. This is, unfortunately, not possible on your WordPress.com blog as it requires HTML script, but there is a widget available that will show the RSS feed of your Twitter stream. You can view how to install that from my ‘What and how to use widgets’ e-course.
Update for 15 April 2011: A new version of Twitter is out, so a revised version of this post has been written. It covers how to create a Twitter badge, but not how to put it into your blog – rejoin this post when you are ready to do that procedure.
First, go to your Twitter profile:
and pan down to the bottom links:
Click on the link ‘Goodies’:
And click on ‘Widgets’:
And choose ‘My Website’:
And click on ‘Profile Widget’:
Fill in your Twitter username in the field, and then select ‘Preferences’:
Tick the boxes you require (I’ve selected scroll bar, show 5 tweets, and confirmed the timestamps and hashtags), and then select ‘Appearance’:
Here I chose the colours I wanted to dress my badge up in. You can choose from the selection offered to you (click on the coloured squares and a pop up box with a selection will appear), or if you know the hex code of your colours like I do (#800080 is that magenta colour) fill those in the appropriate field in the pop up box. Have a play until you get what you like (it will show up in the example on the right, or click the ‘Test settings’ button at the bottom to view). Next click on ‘Dimensions’:
If you know your sidebar’s dimensions in pixels (!), put that in. My guess at 200 width was fine. The length is up to you, but I didn’t want my badge to dominate my sidebar, so I made it just a little bit longer at 250. The scroll-bar allowed the bottom tweets to be seen. There’s always the auto-width box to tick if you wish.
Now click on the ‘Finish and Grab Code’ button:
Highlight and copy the code. Now open your blog in another window and go to the dashboard:
Select ‘Widgets’ under ‘Appearances’:
Find and drag a text widget into your desired space on your sidebar. When it opens, past the badge’s code into it:
Don’t forget to click the ‘Save’ button. Now you can go to your blog through the ‘View Site’ button at the top and look at your brand new badge in your sidebar:
Hope you like it! Keep popping back to check it works – it’s so much fun seeing your latest Tweets appear as if by magic!
Latest posts by Alice Elliott (see all)
- Five tips for a powerful content strategy to generate business leads - 21 April 2021
- How minimalist design can increase conversions on your blog - 20 April 2021
- 9 techniques to grow your social media marketing presence - 11 April 2021
- How to find your competitor’s keywords - 10 April 2021