How to Create a Cover Photo for Your Facebook Timeline (Updated)

How to Create a Cover Photo for Your Facebook Timeline (Updated)

Reader Comments (211)

    • Rosie, what a great job! I love how the pictures complement each other and they are all gorgeous.
      Very nice!!

      Karla

    • Ah yes, I left seasonal updates out of my idea list! I designed a cover photo for a painting studio with the intent to change their featured paintings to reflect the seasons. Thanks for mentioning this!

    • oh and btw how did you do that “welcome” option? Really nice! What happens if someone does not click on it? Seemed to me the page would be kind of frozen??
      I am sorry I am so overwhelmed with all things SM …
      Thanks
      karla

  1. We took a poll that asked our “fans” who we should feature on our FB cover. Got a nice little spike in “likes” and visits from that technique.

    • You’re welcome, Julius. I think the Facebook cover photo is a great opportunity for brands to connect with fans in a non-sales way, which should help keep the “social” in “social media”. 🙂

    • Tanya, that is a good quality photograph that really shows off your interior design work. Since you paired that photo with yourself in the profile icon, it’s perfect! In a comment above, Rosie reminded me about an idea for seasonal image updates, which would probably work well for your business, too.

    • Thanks for sharing, Brad. Glad you found my template useful. I couldn’t find a good template online, and some conflicted each other about the exact size, so I ended up making my own layered PSD file based on screenshots and lots of test images uploaded to my own Page. AFA your cover photos, it looks like you’re following all of the guidelines well.

      • Thanks for the comments, Danielle.

        Most (but not all, unless I’ve missed them) of the specs are hiding in a few places, but you’d think FB themselves would have created something like this. I suppose that just means it’s an opportunity for folks like you. 🙂

        • I agree Facebook should publish a guide and a template in several file formats. That would have saved me a lot of hours this month! The crazy part is that some of Facebook’s own Help answers contradict each other.

    • Sonia edited this article for me, but the timing is definitely thanks to her for publishing it! I would love to see what you come up with. Please share your link here when your cover photo is ready.

    • Glad to be of help. I had a hard time figuring out the dimensions, too. I found a lot of conflicting information online, even in Facebook’s own Help section. I had to take actual screenshot measurements and do a few upload tests in order to figure all of this out.

    • Your cover photo follows all the guidelines and the color is eye-catching. You may try placing your words down the right edge instead of the left, then it wouldn’t get covered by your profile image and I think it would still have the same branding impact.

  2. On my author site, lindaharperwrites.facebook.com
    I cannot get my profile picture into the smaller site within the Large cover picture. I cannot drag and drop it, I want my picture in the smaller space as my profile pic. But it will not do this. Please check and get back to me asap

    Thank you
    Linda Harper Shimmins

    • Linda, the URL above does not work, so I could not view your Facebook Page, but I think I can answer your question. The small square profile icon image is separate from the cover photo. To edit it, first, make sure you are logged in as the Page administrator so you can make edits. Then, place your mouse over the profile icon until the “Edit Profile Picture” button appears. Then use the options in that menu to make changes.

  3. My apologies to Danielle for inappropriately crediting myself as the author today. 🙂 Moving a little too quick this morning and forgot to update that author field! (blush)

  4. We put ours up a little while back and even did a blog post to “tour” it. We’ve incorporated mini-sites inside our Facebook page using “landing pages” directly built within our WordPress theme. That way, our “signature colors” are consistent throughout our various sites.

    Since we’re relatively new, we don’t have a “vanity URL” yet, but you can see our timeline page at

    http://www.facebook.com/pages/Another-Turn-Used-Books-LLC/316975438328526

    and read our “tour” at

    http://anotherturnusedbooks.com/2836/take-a-tour-of-our-facebook-timeline-page

    • One thing we’ve noticed during our implementing the Facebook Timeline is that their iFrame manipulation in their apps changes from one moment to the next. We’ve experienced our app tab pages not being fully displayed to being fully displayed. We’ve taken a “wait and see” approach to see what it ultimately ends up being, but are preparing ourselves for the most probable inevitability of having to change our code to meet their ever-changing specs.

      Hopefully, if you visit our Timeline, you won’t see our pages getting cut off (Welcome->Our Catalog->Books, for example)!

      We’re using Genesis/Enterprise, BTW! Couldn’t be happier! 🙂

    • Your book spines photo seems to capture the essence of your brand very well. I noticed a few Facebook feature changes earlier this week, too. I’m not a Facebook app developer, but my colleague who is an app dev wasn’t happy about the seemingly unannounced changes Facebook made to apps this week.

      • Thank you, Danielle. I like how the angle of the books direct the eye toward the app tabs where the essence of our site resides.

        I can commiserate with your developer friend. You try to keep up with the trends, but sometimes, they turn around and you get left behind! I’m hoping that they’ll settle soon on how to resize a Canvas height beyond the 800px you’re given by default! Until then, my pages may or may not get cut off! (It’s embarrassing when your pages don’t load correctly!)

        I’ve posted a thread on the Genesis forum if anyone is interested in working out the kinks (look for “Landing Page to Interface with Facebook iFrame App”). The thread includes the code that worked when I turned the Timeline format on. After Facebook switches permanently to their new format, it might be necessary to revise the code to make it work on *that* day! Hopefully, we can share the secret to success of creating landing pages for Facebook for the benefit of all Genesis users. 🙂

  5. Thanks for this. Right now mine is just my logo and tagline, but I like the idea of having a stunning picture that conveys the feel of my site and content.

  6. I was so happy to hear that Pages would get the cover photo feature. I found the specs by following the Facebook instructions given when they made the announcement. I looked around at some of the big brand pages to get ideas and found Microsoft Windows. The panels caught my eye, so I decided to work that into my design. The photos I use are royalty-free from MS Office’s clip-art site (except the cat — I took that one!) and I made the collage in Photoshop. I’m a writer, just getting started, so I don’t have the shortened URL yet. Here’s my page; I had fun with it!
    http://www.facebook.com/pages/Darla-Writes/143130005782966.

      • Thanks! I use Microsoft Office for all the photos on my blog. What a great business you have — I love to read — and family-owned is the best. Hope you do well!

        • I’m doing the same with the Microsoft images. 🙂

          Thank you on your well-wishes. It’s a small business attached to a big dream. 🙂

    • Darla, that white frames layout is a nice clean way to show off multiple images. You did a good job selecting photos that coordinate well in color and style. The link that Rosie posted in the second comment is another good example of white frames and coordinating photos.

        • And thank YOU for calling me a “professional graphic designer”. I haven’t used that term for myself since I first graduated with a Design degree! LOL. What I like about social media marketing is sometimes I get to use Photoshop to design things, especially now that Facebook Pages have cover photos. Yay!

          • I read your About page at DG Design and it sure sounds like you have the credentials! I owned a secretarial service and had to teach myself Adobe software to keep ahead of the competition. Love their products. Now I’m trying to get the hang of social media, late bloomer that I am. Hope your weekend is great!

    • Wow, THANK YOU THANK YOU THANK for these guidelines on how to create great ‘eye candy’ for the new Facebook time line. I worked on mine last night as well; took note of Darla’s and Debi’s collage set-up, and came up with a few different versions using Picasa. I hope they don’t mind that I used their ideas as inspiration for my cover photo!!!
      https://www.facebook.com/enhfan

      I used the stock images I had on hand however, still working on a developing a Logo and I should perhaps use the full business name in the facebook web address ..since it’s no longer a ‘fan page’.

      Slowly getting everything streamlined, including a new website coming soon to elementsofnaturalhealth.com
      This was a lot of fun!!! 🙂

  7. I’ve been doing a test of the timeline image – I have social “links” in text format (small) to see if they will contact me or take it down. Hopefully they won’t but you never know.

  8. This is incredibly helpful. I’ve been looking at the notification on my Facebook page that tells me I have to do something or other by a certain date, but it overwhelmed me so I ignored it. I think I have a plan now for at least something temporary – instead of a gray rectangle at the top of the page – and I appreciate that. I checked out all of the links to the FB pages. Wow! Such creativity! Great job to all and thanks for all of the information, Danielle.

  9. It’s now after midnight on March 31, and I checked timeline is LIVE for Facebook Pages — even those that still haven’t added a cover photo. Those Pages have a blank space where the cover photo would be, and the Page admins have a new alert message in that space that tells them what happened. See a screenshot of this in my Facebook Page post at http://ow.ly/9ZEmr.

    • You’re welcome, Kuong. The only potential mistake I see is the arrow pointing to your profile icon is similar to the example of what not to do in the Facebook terms (4th bullet point in Step 1, above.)

  10. Amazing article, so useful for me right now. I’ve been racking my brain to think of a great cover photo that represents my brand and is nviting. Currently, it’s just a big picture of me but I definitely know that’s not the most effective. I know what I’m working on tomorrow.

  11. Wow! Danielle ! i’ve been looking for a ‘how to’ and came across your article! thanks, came in handy ! now I love my cover photo!

  12. Thanks for your How-to help, Danielle. I always welcome tips, demystifying solutions, and Facebook best practices. Your directions helped me get our cover photo posted on time as well as develop a strategy for frequent modified variations. Please have a look: http://ow.ly/a0xys

  13. Thank you for that feedback, Mari. Your design is very original. I could see how those photos could be changed out to update it over time. Great job!

  14. For those not artistically inclined or who don’t have the time you can find some pretty talented people on Fiverr willing to create a header image/Facebook cover for $5. Many are well worth the price and I bought a service for the first time last week and was very pleased.

    • I can assure you it takes more time than $5 to make a cover photo that follows these steps. Usually when someone is willing to work for free or cheap there is an unfortunate reason for it.

    • LOL it’s up to you if you want to change it. I would recommend creating a profile image that is in focus so that people can read your logo when your icon shows up next to posts.

  15. I already made my facebook cover and removed it because it looks distorted. Now I know the exact size to use and what to include on my cover. Thanks for the information.

  16. I was having trouble to upload the cover photo for my fb page, as I failed to notice the ‘Save Changes’ option. This guide helped me… Thank you, Danielle.

  17. Has anyone noticed a change in the cover photo size/profile picture or profile picture border recently? I had text placed along the bottom edge where it would not be covered by the inset profile picture, but I’ve noticed that it’s slightly hiding how.

    • I just checked mine and they look the same. I’m not sure what would explain the apparant change you are seeing. Please let me know if you figure it out.

      • Hmmm, it’s been switched back. This page was designed so that the cat’s yarn “connected” between to the two pics. Last week, the yarn in the cover was almost 0.25 inch offset to the left. Back to normal this morning though.

  18. Thanks for the info.
    FB is just now forcing the timeline on me. For some reason until tonight I had the old site.
    I have one question. I notice you have a image of a qr code in your examples. Just want to make sure since the qr code can contain website, contact info, calls to action, or what ever, facebook doesn’t care about putting one of those in my cover image?

    Thanks

  19. Can we use animated gifs in that page? specially in 133 pixel area? if yes, then please let me know how.
    Thanks

    • Farhan, I haven’t seen anyone using an animated gif in Facebook— I assume because it isn’t possible. I haven’t personally tried it though. From a user experience design perspective, I want to caution that animated gifs are generally regarded as annoying visuals, so be sure the business use overcomes this factor.

  20. I was wondering what the deal is with the sizes… I was uploading new elements for my personal facebook page and was surprised that when i loaded my 133 x 133 profile image that it told me that i needed to have a width of 180px for the profile image… is the profile image itself different and the place where the cutout of the profile 133 x 133?

    also when loading up an 851 by 315 picture for my cover photo I know see that on m.facebook.com and inside the iphone and ipad apps that the image doesn’t rescale down as expected…. are there different requirements to getting the mobile version to look as good as the full web version… thanks.

    Great article by the way!

    • Troy, The profile icon is displayed at 125×125; however, Facebook oddly requires a minimum upload size of 180×180. Unfortunately, the mobile rescale is something controlled by Facebook and your device, so there is nothing I know of that we can do to change how it appears there. I just updated my Facebook iPhone app now, and it still does not display cover photos for Facebook Pages, only personal Profiles. Are you seeing cover photos for Pages in the app version?

  21. Although the size for the Cover photo is correct, the size of the profile pic is not. It is actually 180 pixels by 180 pixels. This will only be an issue for those of you who put text near the Profile pic like I did. Otherwise, this was extremely helpful!

    http://www.facebook.com/ResourcesHD , don’t forget to like when visiting!

    • Ashley, you are correct that the profile icon upload size is 180×180; however, the display size inset in the cover photo is 160×160. Both specs are noted in my template image embedded in the article, above. I know it’s hard to see that text in the shrunken, embedded image, but if you click on the image it will load the full size version in a new window.

  22. Amazing and creative article i read here. I ‘m designing Facebook time cover site, got some useful information about image size and pixels

    • Sean,

      The cover that’s there looks fine to me. The profile image looks a little blurry, though.

      But in general, give FB an image in exactly the size they ask for if you can help it, and in jpeg it seems. I always use 24bit PNG and haven’t had an issue, but depending on many factors, conversion from other image formats to jpeg can goof things up.

      FWIW,

      -brad

      • It’s just around the black color where you see distorted white triangles. But thanks for the feedback. Great blog post.

        • Sean, Rest assured, as the creator of the original art, you are probably the only person who notices any distortion there. That image is possibly the crispest cover photo I’ve ever seen. The profile image is very pixelated though. Brad gave some excellent tips. Whenever one of my images looks worse after Facebook conversion, I make sure it’s the exact right size and then try saving the image in different formats with different settings until I get a converted one I can live with.

          • Thanks Danielle. I have no tie to the page itself, my friend just asked me to make a cover photo for them. I told them about the profile pick, I’m sure they will fix it soon 🙂

      • I have clicked where it says cover photo and added one, but when I open my page, the picture isn’t there. Are there different types of fb pages?

        • There are different types of Facebook Pages, but as far as I know every type of Facebook page includes a cover photo area. It sounds like you have the cover photo option. Are you clicking the save or submit button after you upload it?

          • I have pressed the save changes button but still it doesn’t appear on my mobile, or any of my friends. I can see it on the computer, under all the admin panel stuff, but not on my iPhone.

        • Mine changed me over to the new timeline. When I open it I still see my wall in the same way but when others open it they see the cover photo and timeline. If you click on your profile name in top right corner you can see how others see it.

  23. Why does it say 160 x 160 pixels,when the minimum image upload size of 180 x 180 pixels? Does it crop the minimum or resize it or is that for the frame?

    • Robin, If you click to enlarge my template image above, you will see I have noted that the display size is 160 yet the minimum upload size is 180. Facebook shrinks the image for you, so no need to worry about cropping.

  24. On your template image you say the width of the cut-out space is 168 pixels wide but the profile icon size is 160 pixels wide. Wouldn’t they both be the same?

    • No, the cut-out space is the entire area which is cut out of the cover image, which includes the borders around the profile icon. The profile icon itself, sans the borders, is displayed at 160.

  25. Danielle, you are a godsend. I have been trying to find a really good post like this for designing Facebook covers for a while (all the ones I’ve found up until now confuse the heck out of me). I’ve been a reader of CopyBlogger for a while but somehow missed this post until now. This is awesome, just used it to do a new cover for the auto shop where my mom works (http://www.facebook.com/canyonauto), and I will be using it for my own pages real soon!

    Cannot thank you enough. 🙂

    • Tanya, Thank you so much! I was really confused by other articles too, and that’s why I had to get down to the pixel and write my own article. Facebook isn’t consistent with their own documentation versus what actually displays, so that is probably why there are so many conflicting/confusing articles!

  26. Hi Danielle!

    I created a cover photo for a ministry event’s Facebook page, and I can’t figure out why it looks distorted. I followed the specifications (851 x 315 pixels) and saved as a jpg, and used quality elements in the image — most of which were vectors or text created or dropped onto Photoshop layers. The image looks crisp when I look at it in Photoshop, and even looks crisp when I look at it in Facebook as a stand alone image (i.e. when you click on the cover image and you see it in “album” format), but when you look at it placed on the actual page, it looks a bit distorted to me. I’m having the same problem with the profile pic (which actually looks even worse than the cover pic). I created it as 200 x 200, and it looks fine in the actual photo albums. Why would they look crisp in Facebook as stand alone images but distored when placed as cover and profile pics? The link is below.

    Thank you so much for your help!:)
    Dinah

    https://www.facebook.com/#!/CrownsMinistries

    • Hi Dinah,
      I took a look at your page and your cover image looks very crisp to me, but your profile icon looks very blurry. I suggest creating the profile icon at their min. upload size of 180×180 so that when Facebook displays it at 160×160 it will have less shrinking to do, and therefore less room for quality loss.

      I have had experiences where Facebook’s image upload processing changed my image’s colors, added grain around high contrast edges, or added blur. Blur usually means your image size or proportions aren’t exact, so double check that the file you are uploading is exactly 180×180. Other than that, check that your file’s color profile is sRGB, check the box to embed that color profile in the Save for Web options, and try saving the file with different quality settings and formats (gif, jpg, png). Facebook processes each file type slightly differently upon upload.

  27. Ok so I am thinking about removing my site from Tumbler and get it to a WordPress site. I think this is a wordpress site right? If it is, may I ask where you got the theme? Thanks a bunch!

  28. It seems picking a single cover photo that looks good on both desktop and mobile is a challenge. Further, I couldn’t find any online source dealing with that topic. I sort of stumbled into something I like on both platforms. It’s an abstract photo. This is ok for a personal page, but probably not desirable for a business page. Seems like this could be a good leading edge topic for you to cover. http://Www.facebook.com/jaybenedictbrown

    • Jay, Thank you for bringing this topic up. I am not sure if the mobile version was active when I originally wrote this article, but it does appear the location of the inset profile icon is different on mobile. I tried to click your Facebook link but it says page not found.

  29. Hi,

    I run the social media for a school, and I’m in the process of creating a contest. I’d like to post, for the duration of the contest, a Facebook header image that speaks to that. Is that okay by Facebook standards? I am having a bit of trouble finding that information.

    For instance, could I say something that would include the following CTA: “Show us by submitting your photo… Enter the contest below.” >> Referring to the 3rd party app link below the header.

    Thoughts?

    Cheers,
    Non

    • Non, I double checked my article above and the Facebook terms page, and it still says you should not include a call to action (CTA). See above Section 1, last bullet point, and Facebook Terms Section III.B.iv.

  30. Thanks, Danielle. Yes, I did eventually figure it out. Explicit CTAs are not okay, but you can say something along the lines of “Submissions are Open.”

    Thanks for your follow-up.

    Cheers,
    Non

  31. Thank you so much for this information. In the past I found myself guesstimating and going to extremes to make things line up! now with the exact pixel measurements it took me less than 2 minutes to achieve the timeline cover/profile image that look blended together. 🙂

    -Gina

  32. My facebook profile is not professional but now since I know the dimension I will make my own facebook time line very soon and then let you know because timeline dimension first I got from your webpage thankss…

  33. Hey. I spent a lot of time designing a new cover image for my Timeline page on my fb page. I am a professsional graphic designer and I even followed your advice on image size, RGB profile etc… STILL my cover image will NOT upload properly. I was easily able to change out my thumbnail image but the Cover Image is giving me fits! I’m sure I did everything right. I composed it in Photoshop Elements (didn’t see the need to use full version Photoshop on my Mac. Used Elements on my P.C.). I don’t understand what is happening to prevent my new cover image from uploading properly. When I upload it, my thumbnail image disappears to a white square and my cover image won’t let me drag it around to reposition it. Any idea what is going on? Thanks, Jon B. Ingram. http://www.facebook.com/jon.b.ingram HELP! 🙂 I spent a lot of time on my new cover image..dumbed it down to the right pixel by pixel size, and flattened it in Photoshop Elements and saved it to my desktop as a simply high res. JPEG file.. but not too big… Thanks….Jon B.

    • Jon, I apologize that I don’t think I can trouble shoot from here. The only thing that sounds wrong about your description is that it is correct that you should not be able to drag around the cover image if you sized it correctly; it should just fit perfectly. Have you tried saving the changes and seeing if it looks right when all is done? You can always revert back to your previous cover image.

  34. Have the cover photo guidelines changed? I have read several times that cover photos can’t contain call to actions nor contact information (like URL), but I can’t currently find that information in the Facebook documentation. Here are the cover photo guidelines (https://www.facebook.com/help/276329115767498/) and the pages terms (https://www.facebook.com/page_guidelines.php), and it doesn’t prohibit this information in either. If this information is still prohibited, can you post the source link? Thanks!

    • Cassie, The original source is linked in the first section of this article, and I see now that Facebook updated their terms page in Dec. 2012. They removed many restrictions and added a new restriction that a cover photo can’t contain more than 20% text. Great job on double checking!

This article's comments are closed.