Facebook Cover Template (late 2015) in Photoshop CC

Facebook is rolling out more changes! The cover image and profile image dimensions are changing again and these latest changes mean that all those nicely crafted facebook covers no longer work! But fear not, Tipsquirrel.com has you covered (baboom tish! sorry for the poor pun). This post shows how to create the perfectly positioned profile image & cover using our FREE Facebook Cover Template for the late 2015 changes.

Below is a walk through of how to create your own pixel perfect facebook cover, and after the walkthrough is the downloadable template available only from Tipsquirrel

First step is to the load template into Photoshop CC. (This theme may well work with older versions of Photoshop but changes in the Creative Cloud version makes exporting the images so much easier)

As you can see above, I have already prepared a finished cover art that fits into the our template. If you notice in the layers panel on the right there are 3 main sections..

1. guides
2. cover design
3. selections

Guides are the overlays that line up with the current Facebook cover, and contain the box around the profile photo and areas that contain your name (or company name) and your call to action button. Cover design is where you create your own artwork and Selections are the correctly sized areas for the cover image and the profile photo.

Use the guides to create your own cover art, positioning elements of your design to fit the profile image and avoiding the areas for name and ‘call to action’. Once you have created your own artwork, flatten the image and continue.

Let’s turn off the guides layers and selection layers as shown below..

To create our selection for the profile photo, simply CMD (Ctrl on Windows) & click the profile photo layer as shown below to create a selection around the profile photo area.

The marching ants now show the selected area for the profile photo.

Select the main cover image layer as show below and with the selection still active..

Click CMD (Ctrl on Windows) J to create a new layer with the selected portion on the cover image. This will be our profile photo

Rename the new layer to profile.jpg. Setting the layer name to end with .jpg works magic within Photoshop CC as we will soon see

Make sure that ‘Generate Image Assets’ is turned on within File/Generate and Image Assets should be ticked

with only the profile photo layer & the cover image layer visible in Photoshop, both layers having a .jpg suffix to the layer name and Generate Image Assets turned on… Navigate to the location of your original cover image in Finder or Windows File Explorer and see the newly created assets folder which now contains your Facebook cover image and profile image.

In Facebook, load up your new cover image and profile image see how perfectly they match up! (until Facebook changes the design again..)

 

---

I hope you found this walk through and template useful, and as always I would love to hear your comments and thoughts below.

[sociallocker id=”21239″]

Thank you for the support! Click here to download the file.

[/sociallocker]

---