How to Create a Banner for Twitter

Report a post

Thank you for taking time to help Etsy! Please note that you will not receive a personal response about this report. We will review this post privately...

Why are you reporting this post?

Any additional comments?

Edit Post

Edit your post below. After editing, the post will be marked as edited and the date & time of the last edit displayed.


What is this?

Admin may choose to highlight awesome community posts that are friendly, answer questions, and offer informative links.

What does it do?

Highlighted posts are placed at the top of each page in a thread for greater visibility.

Sign in to participate in this discussion.

Original Post

kcwgallery says

I just posted this on my blog at but thought it'd be handy for my fellow Etsians as well...

There’s been much discussion recently about using Twitter (and whether or not it’s useful, helpful, any good, etc). The only thing I’ve found that I don’t like (so far) is that when I go to someone’s page, their web address is often truncated and their bio/profile is often cut off as well. So I created a banner for my Twitter page which has all my main web addresses and a few thumbnail prints. Voila! Now people don’t have to click through to another page to see my web address!

On Twitter, you have the option of selecting a pre-made background image or choosing your own. If you select your own, you can either have it show up in the left corner or tile the image across your page. I thought it’d be great to create a banner image that fills the left side of the page (not tiled across the page) so that people could see a lot of relevant in formation at once and it worked!

These instructions are for Photoshop. Other similar programs probably have a similar approach.

Open Photoshop and click on File>New. A window will pop up with fields for Name, Width, Height, Resolution, Mode and Contents. Name the file whatever you choose. For the width, enter 225 pixels. For height, enter 550 pixels. (This size will ensure that your banner will be visible on the left side of the Twitter page and that people will not have to scroll down to see all your info. You can, of course, elect to make it a longer banner, if you don’t mind the scrolling). For resolution, 96 pixels/inch is fine since this is only for the web. Select RGB Color for Mode. In Contents, click on an either white or background color. Note that if you select white, you can always change it later with the paint bucket.

Next, size a few thumbnail images. I wanted three images on my banner so I opened each image in Photoshop, clicked on Image/Size in the toolbar, then re-sized each image so that it was close to 100 pixels tall. Note that the image just has to fit within the 225 pixel width.

Then I copied each image into the banner. So, for each image, make sure it’s open, then use the Rectangular Marquee to select the entire image. Hit Control-C (or copy), then open the banner and hit Control-V. Now your image is in the banner on a new layer. Use the pointer tool to move it wherever you want within the confines of the banner. Repeat for any other images.

Then add text. This could be your web address or a few words about who you are and what you do. Remember, Twitter is about connecting, however superfluously. The more people know about you, the more they may want to show their support in your artistic endeavors. Just click on the text tool and type away to your hearts content, checking that the font size/color works well within your banner. Move the text to wherever you think it looks best and you’re done. Well, almost.

Save the banner. In Photoshop it will automatically save as a PSD file. I’d recommend saving it as a PSD so you can change it later of you desire. Then click on Save As, and save the image as a JPG. Save it somewhere easy to find. You’re going to need it in just a minute.

Go to Twitter, log in and click on Settings in the upper right corner. The next page will have 6 tabs across the upper portion of the page; one of which will be “design”. Click on it. Then you’ll see some pre-selected backgrounds. Beneath them on the left, you’ll see “Change Background Image”. Click on that. A field will open up below with a box next to it which says “Browse”. Click Browse and locate your image. Once you click on your image, click on “Save Changes” at the bottom of the page. Don’t click the box which says, “Tile Image”. Now you’re done!

Hope this has been a help. You can see my banner at See you out in the Twitter-verse!

Posted at 5:15 am May 26, 2009 EDT

Unfollow username?

Are you sure you want to stop following this person?