20 Kasım 2012 Salı

Blog Button

To contact us Click HERE

Do you have a blog button?  Why do you need one?  How do I make one?  Once I make it, what do I do with it?

Yeppers, I plan to answer all of these questions today! 

This week I have been working on revamping my blog.  Since this series is gaining more and more posts, as I find many things to share with you… I decided to give these blogging tutorials a name--- Bling my Blog!

The Bling my Blog Tutorials

Background

Header

Blog Button

Up next:  Grab box for the blog button

So, why have a blog button?  Well, it helps brand your blog.  Just like when you see golden arches.. you know it’s McDonalds.  You want people to see your blog button and know it is your blog.  It is also important to have for other bloggers/websites to use to link back to your site (using a blog button grab box---tomorrows post).  You could even use it as a ad on another site if you please.

 

How do you make one?  Follow along with my tutorial to see how I created mine.

 

Let’s get to it!

Note: I am making this blog button in Adobe Photoshop.

 

Step 1: Open up the Photoshop program.  File>New.  Change your setting to match those below.  180x180 pixels.  Background: Transparent.  Click ‘OK’

image

 Step 2: Open up your favorite square or circle shaped border.  This one is from KPM Doodles and I LOVE it!  Once your border is open, drag the actual border onto the the new 180x180 pixel file you just created in Step 1.

image 

 Step 3: Once the shape is on your 180x180 pixel page, use the keyboard shortcut: CTRL T (click them both at the same time).  This shortcut will allow you to re-size the shape.  Grab a corner of the shape, hold down SHIFT and resize the border image to fit on the page.

image 

Step 4: Add a circle (or square, depending on your border shape) to create the background of your button. As seen in the picture below, use the tool bar. Click on the line tool button to get other choices of shapes. Go down to the “Ellipse Tool”. Hold SHIFT and and drag your shape to the size you need.

image

Step 5: To change the color of your shape, double click the black square seen in the ‘Layers’ tab. (In the photo below you will find this on the lower right hand side.) A solid color picker will show up after double clicking.  If you want the button to match your blog header, open your header.  Use the eye-dropper to select the color you want from your header.  Otherwise, just choose a color from the pick a solid color box.

image

Step 6: As you can see I chose the pink color from my header.  The pink circle was in front of my border and I didn’t like it that way.  So, in the layers tab (bottom right), I click on the pink circle layer and drug it below the border layer.  I also dragged the text (Me & Marie Learning) from my header to my button and resized it (CTRL T).  The header file must be a Photoshop file to drag just the text.  You can also just use the text tool (big T on the left hand side) and create your own text.  I also dragged over my kid clipart and used the eraser tool to erase part of their bodies.

image

Here it is all done!  The checkerboard in the background will be transparent.  To save: File>Save for Web & Devices>Choose where to save it and click ok!

image

 

Okay, I have a blog button.  Now what??  Come back tomorrow to learn about creating a grab box for your button.

Hiç yorum yok:

Yorum Gönder