Thursday, July 16, 2009

How to Make an Etsy Banner

by Jennifer Tang of "MaJenta Designs"

I'm so excited to have finally updated my Etsy shop banner to include images of my actual items for sale in the shop! I often read in Etsy forums how important it is to have an eye-catching banner, since it is the first thing potential buyers see, and often its your banner and avatar that first draws people in!

Etsy Banner - with pendants

Thanks to "BlissbyHeather" blog for their helpful tutorial, it was very easy to make my new banner! You dont even need Photoshop, I just used the free program, "Gimp," instead! Here is the step-by-step instructions all copy/pasted for those who want instant gratification:

1) On the GIMP toolbar, click on "File" then "New"

2) a box will pop up that says "Create New Image"

3) In the box beside "Width", type in the numbers "760"

4) In the box beside "Height", type in the numbers "100", click on the box that says "OK"

5) A rectangular shaped box will pop up. This is your banner.

6) If you want to add text to your banner, go back to the GIMP toolbar and click on the icon that looks like a capital letter "T".

7) If you look at the bottom half of the toolbar you can see that there are options to adjust the size of your font, the style of letters etc.

8) Click on your banner where you want the text to show up. Start typing!

9) To add other pictures to your banner, you can go to the GIMP toolbar and click "File", "Open" and browse through the files on your computer to find pictures that you have already saved. I found that in order to get a product to fit onto my banner I had to shrink the size of the picture first. I did this through an online site: http://www.resize2mail.com/ . I chose "shrink the photo by 75%" and then for some photos, I had to go back and do "shrink the photo by 25%". This was how I added the purse and wallet pictures to my banner.

10)After the photos were resized and saved, I went to "File", "Open" and found where I'd saved them. Then in order to add them to my banner, I went to the GIMP toolbar and clicked on the icon in the top left hand corner (it looks like a grey rectangle). I used this to select the areas of the resized photo that I wanted to use on my banner, and then I copied it and pasted it on my banner. (To copy, click on the piece that you want to copy, and hit the control button and the letter C on your keyboard. To paste, click on the banner where you want the item to be, and hit the control button and the letter V on your keyboard). If you want to move the picture that you just pasted on your banner, click on it and moved it.

11) To save my banner, I chose "File", "Save As". A grey box that says "Save Image" will pop up. Click on the cross icon beside "Save File Type by Extension". A white box will show up at the bottom, scroll down and choose "JPEG image" and then click on the "Save" bottom in the bottom right hand corner.

12) A grey box that says "Export file" will pop up. Click on the "Export" box.

13) A grey box that says "Save as JPEG" will pop up. You will want to move the bar to the right, so that it says 100 in the white box and click "OK".

14) You're finished!

15) To upload your new banner, sign into your etsy account, click on "Your Etsy", in the left hand colum under "Shop Setup", click on "Appearance". Under the heading "Banner" you can click on the "Browse" button and find where you saved your banner. Scroll to the bottom of the page and click on "Save Changes". That's it :)

58 comments :

  1. Seems as if "T" is now an A, and you don't mention adding layers to add phots...or at least this is what I had to do to get my photos not to paste in my text box. But this is a great step by step.
    Thanks!

    ReplyDelete
  2. Thank you so much for taking the time to make such a great detailed account of how to make a banner! I just opened my shop this week and needed some help as to how to get text onto my photo. Susan's comment was helpful too.
    I could not find how to alter the basic text though. :( hmmmmm.... so I just put "TutusChic" on the photo regardless. Is there any way to change the font's size, color or type on Gimp?
    Thank you so much and Happy Holidays to you!
    Sarah

    ReplyDelete
  3. This comment has been removed by a blog administrator.

    ReplyDelete
  4. Whew! Thanks for this. Without it, I still wouldn't have an Etsy banner.

    ReplyDelete
  5. Just to let you know that I had some trouble doing the banner because it seemed that GIMP did not download all that I needed onto my mac. Not your problem! I am grateful for your help as I was able to combine your tips with using Keynote on my mac and then exporting it out as a jpeg, cropping it and then then that enabled it somehow (!) and could download it to the banner.
    Thought knowing that for mac users would be helpful.
    Thanks
    Sarah
    TutusChic

    ReplyDelete
  6. I DID IT!! :D thank you thank you
    you've saved me about $100
    tell me what you think! http://www.etsy.com/shop/my3andme

    now to get an avatar.

    ReplyDelete
  7. Oh my gosh, this helped me SO much!! You rock!

    ReplyDelete
  8. I soooo agree, YOU ROCK. This helped me sooooo much. I now have my own creation of a banner up, at least the 1st. The more you work with gimp the more you learn, and yes, I also found layering is a trial and error thing. Text goes on last after pics, the text goes over everything. Thank You for taking the time to right these instructions. I'm @ http://www.bobblesbycarol.etsy.com if you would like to check out my handy work

    ReplyDelete
  9. Fantastic! Couldn't have done it without you. I didn't even know where to begin. I had to do the "add layers" too to get my photo to come up. That was the only glitch I had but with a little work, it looks great. Thanks again.

    ReplyDelete
  10. Thank you so much for your tips. I was able to create the banner I wanted. Your directions were easy to follow.

    ReplyDelete
  11. Thank you, thank you, thank you for your post. I was finally able to make my banner, your step-by-step directions were awesome.

    ReplyDelete
  12. Hi: I have tried making a banner twice following these directions, but when it comes into etsy, it is all blurry, especially the text. Any suggestions? Thanks so much!

    ReplyDelete
  13. Loved seeing all your finished banners! :)

    Laura, maybe try making sure the size dimensions of your project is the size that Etsy suggests for the banner, and adjust this before you add anything to it.

    ReplyDelete
  14. This post really helped me alot with making my banner. There were some glitches (things you didnt mention) having to do with how to put the images in the banner, but I fiddled around and finally got it. Going to "NewLayer" is the trick. Saving it in jpeg is important too. Thanks so much!

    ReplyDelete
  15. I tried the video tutorial and this as well and it just seems like it's not working for me. I wasn't able to move my font like in the tutorial, but I only have Windows 2000, maybe since it's a "different version" something is a little off. I'm not sure but I made a banner and I am ready to use it!!

    ReplyDelete
  16. Thanks so much for doing this! I'm new to etsy AND gimp so I was very grateful for your helpful post! It saved me a lot of time bungling about!

    ReplyDelete
  17. What is Gimp? I dont have a Mac..it seems like you all do.

    ReplyDelete
  18. I have a PC, Gimp is just a free program at www.gimp.com

    ReplyDelete
  19. Thanks, the previous instructions I read and saw from a Utube video on Etsy wasn't very detailed, so I had no idea how to make photos the right size,etc. I think (hop) I can do it now!

    ReplyDelete
  20. Thank you for sharing! This was so much help.

    ReplyDelete
  21. Thanks so much for the instructions! I'm having one problem though. When I upload my jpeg banner to Etsy the text is blurry. If anyone has any tips as to how to fix that I would be so appreciative!!
    Thanks!
    Kim

    ReplyDelete
  22. Thank you so very much! I was having a hard time with making a good looking banner for my Etsy. Everyone else seem to have such cute ones but I never could figure out how they did it. Thanks to this blog I have now succeeded!! =)

    ReplyDelete
  23. Thank you thank you thank you!

    You are so awesome for writing such detailed instructions. Thanks to this post I finally was able to make a banner all by myself with no help! I will admit, it's not perfect, but it's a start. I now at least understand how to put all the different elements together.

    Can't wait to fix this one up and make some great holiday themed ones!

    Thanks again,
    Kathleen
    Fat Cat Crafts

    ReplyDelete
  24. Thank You so much I have now made my own Banner and I am very proud of it.
    Again thanks for taking the trouble to help us all out

    ReplyDelete
  25. Thank you so much for the detailed directions. They were a life saver ;)

    ReplyDelete
  26. Thanks for sharing the great details on how to create a banner. The photo resizer was a perfect resource for other projects im doing too!!

    ReplyDelete
  27. thanks for getting me started! had no idea - now I do.

    ReplyDelete
  28. Great information. I actually managed to make a banner. It took a while but your instructions were great. Many thanks!

    ReplyDelete
  29. Great information. I actually managed to make a banner ~ whoohoo! Wonderful instructions.

    ReplyDelete
  30. Thanks for the tips, but I have spent a long time trying to figure out how to upload my pics to the banner. I can't get it to work. Any suggestions? On the Etsy video they say just drag the photos in. I have a MAC and it does not work, nor do I see a place to upload pics or insert them. Thanks for any help you may have.

    ReplyDelete
  31. Hi Melissa,

    Sorry to hear of the troubles you're having. I dont have a Mac, but if you look at the comment by "Tutu Chic" sounds like she had a Mac and mentioned some additional pointers for Mac users.

    ReplyDelete
  32. You can also make a banner using Microsoft Publisher.

    1.Open Publisher
    2.type in banner
    3. Pick any banner
    4. Change width to 27" and height to 3.55"
    5. Make your banner
    6. You can either save and then save as a jpg or you can just save as a jpg from the beginning. I save first, then go back and save as a jpg, that way if I want to change anything on it I don't have to start from scratch.
    a.after pressing save as, go
    to the second box titled
    "Save As"
    b. Choose "JPEG File
    Interchange Format"
    c.Save
    7. Enter your saved jpeg as your banner where indicated on Etsy.
    8.Done!!
    9. Mine is very basic...just opened my shop yesterday, but you can check me out at http://www.etsy.com/shop/DivaClubChic. If you have questions you can post on my blog (http://knowspecifictopic.blogspot.com/).

    ReplyDelete
  33. Update! Okay, finally did it.But, there were a lot more steps then in you outline. Also, I have my own logo and I just could not figure out how to "layer?" that on top of my photo.
    But, my new banner is much better than what I had! :)
    Thanks for pointing me to GIMP!
    Sincerely,
    Susan McDonald

    ReplyDelete
  34. Thank you so much for explainibg how to make a banner and telling us about Gimp. It looks like a very useful program.I can't wait to get started!

    ReplyDelete
  35. Thank you for the tips. So awesome!

    ReplyDelete
  36. Thank you! I just opened an Etsy shop, and tomorrow I will be abl to make a banner, thanks to you!
    Bless you! Linda

    ReplyDelete
  37. To use GIMP, X Windowing Layer is required. But to download it is says there's a bug in the package and therefore can't downgrade to the version it states. I don't understand this and I don't know if I should download something that has a bug in it. Did anyone else see this? What are others's experiences?

    Thank you,
    Karen

    ReplyDelete
  38. Thanks! My Photoshop banner was blurry with muted colors, but I re-did it in GIMP and it's crystal clear!

    ReplyDelete
  39. Thanks a bunch! this worked really well for me. Great help!

    ReplyDelete
  40. Try etsy banner generator. As well here you have possibility to order a custom banner. This online tool was really helpful for me.

    ReplyDelete
  41. I went through all of the steps. . I guess you cant chang the font?? Anyway I am having trouble saving it as a Jpeg. When I get to that part there is not even an option to do that so I cant get it onto etsy. . Could you help???
    Thank you for the tutorial!

    ReplyDelete
  42. I am having trouble saving it as a Jpeg file. There is not even that option for me.Help! Thank you!

    ReplyDelete
  43. I need help saving as a jpeg. There is not an option for this.

    ReplyDelete
  44. Okay it took a few tries buttttttttt this HELPED a bunch!!!! Thank You so much for sharing!!!!!

    ReplyDelete
  45. THIS WAS AWSUM!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

    ReplyDelete
  46. Thank you for the step-by-step process post! I am trying to create a banner for my Etsy shop, and this looks like it might work. But I don't know, I have been trying for 2 days and nothing is downloading or working correctly. I tried Picasa and that didn't work, so now I am trying GIMP. :)

    ReplyDelete
  47. After many tries, it isn't working. Saving it as a JPEG or really anything that Etsy accepts is impossible. I give up, I'm using paint.

    ReplyDelete
  48. This was SO helpful! Thank you!

    ReplyDelete
  49. This was a huge help, but I was not able to save it as a JPEG in Gimp either. It wasn't even an option, and I had to use Paint.

    ReplyDelete
  50. I went to gimp and couldn't figure anything out, it had options of resizing photos but then just sent me to the Apple page ...oh well

    ReplyDelete
    Replies
    1. Go back to step 9. She used a different program to resize.

      Delete
  51. Thanks for this tutorial! I figured out the problem with saving .. in order to save it as a jpeg, you save a copy and then "export" to a jpeg file. It took me a little bit and google to figure it out :) Hope this helps those who had trouble like I did!

    ReplyDelete
  52. You can't "save" in .jpeg/.jpg format in GIMP. You have to use the "export" function (in the "file" menu) and then select the .jpeg/.jpg format.

    The problem I have with GIMP is that when I resize the pictures I want to incorporate in my banner, they end up all blurry. I have tried changing the resolution of the original picture, same result. I have also tried the neat little program you mention in your post, same result! My pics are blurry. Any suggestion anyone?

    ReplyDelete
  53. Thank you so much for this i finally made my own banner.

    ReplyDelete
  54. I suck - 8 years later and still can't make a banner- somebody shoot me -

    Thanks so much for sharing I wish I was savvy as everyone else (aaaag)

    ReplyDelete
  55. Thank you!! I am trying it now.

    ReplyDelete
  56. Thank you very much for this tutorial. I had a cobble together banner from one of the banner sites but am much more satisfied with the one I just made for myself with some of your suggestions.

    ReplyDelete

Related Posts Plugin for WordPress, Blogger...