Tuesday, October 28, 2014

Creating a Blog Header in Photoshop

I've been watching and reading a ton of tutorials and all of them have helped me to start this blog. I posted a couple days ago a few of the other blogs that helped me, you can check that out here: http://fromtheshoe.blogspot.com/2014/10/in-with-new.html. One of my favorite things to use when building a blog is Photoshop.

In Photoshop I have created countless pieces for my foreveremmalouandyou.blogspot.com site. (You should totally go follow us on there.. it's for a good cause!) But, one of my favorite things to alter and tweek and just have fun with is Headers. There are more possibilities than just plain ol' black and white.

Here's how you do it!

1. Go into Photoshop. I have Photoshop version CS5.. super easy to learn.
Once you are in Photoshop open a New Project.

File-New or Ctrl+N. When the little screen pops up put in 970 Width by 315 Height. Your screen should look like this...

Hit "okay" and it will turn into this...

2. Now, you can change your background color or add a pattern. I'm going to leave mine white... because I like white :) 
Now, lets add something special to our background. I'm going to add a frame from my "custom shapes" section.
To find your custom shapes look to your tool bar, two spaces under the text icon there is a shapes icon. Hold it down and select the one that looks like a puddle of goo. Go up top to where it says "Shapes" and select your shape. I you need to download shapes there are tons for free on the web. Search: Free Custom Shapes Photoshop 
and a bunch will pop up.

As you can see I added a frame. You can change the color with this or add a pattern overlay.. whatever you prefer.

3. Now, lets add some text to this.
You can see I added some Pink Text!

I'm trying to do this very general so that you really just getting the idea. I know that when I'm watching or reading a tutorial and there is too much information and I'm super new to something I kind of get confused. So, stick with me.

4. I'm not really liking how plain the background is so I think I'll add another frame behind my grey frame. 
There we go, all little more character, huh? For the sake of this being the most simple header tutorial I'm going to leave it as is. You can customize this completely. Make it your own. Oh, and make sure you save your work.

5. Log into Blogger and go to your Layout. 
Your screen should look something like this. See where it says Header? Click edit in the bottom, right corner of that box.

When the medium sized window appears click to add an image from your computer and  toggle the button that says "Instead of Title and Description" and there you have it!

I hope this was helpful. As soon as I get a new camera (Colton dropped mine during a dramatic photo shoot and bent the lens), I'll be able to make better tutorials and what not. Let me know if you need any help, I'd be glad to lend a hand!
post signature