Picasa Photo App Series [Part 9] Blog Header

By
Education & Training with Tech Training for You!
http://actvra.in/4jT

Today I'm going to teach you more things that you can do with the amazing (and free) photo app called Picasa. If you want to see other articles I've written in the Picasa Series, you can click that link to see a list. This post will be about how to use the collage and text tools in order to create a custom blog header graphic that you can use for your ActiveRain blog.

In order to illustrate the points in this blog, I worked with Leah Stern in order to update her blog page. You can see below, the page makeover that we did together and I will teach you in this post how you can do similarly if you want to.

First of all you need to find a few photos that you want to use in your header. Ideally they need to be in the same folder so that you can select them together and then click once on the collage button. If they are in different folders, you can create a custom Album that brings together photos of different folders and displays them in one "virtual folder" that Picasa calls an album.

So once you have found your photos and you have selected them specifically, click on the collage button (you will find it on the bottom toolbar). Next you will want to create a "canvas" that is a custom aspect ratio which is 960 x 130 pixels and is the size that you need to use for your blog header graphic.

When you are working with a collage, you can control the appearance of each photo by clicking on it.

Notice the orange "handle". By pulling out/in you can size a photo and by rotating it you can change the angle. I often also use the white border option on the photos to help them have more of a 3D appearance on the page. Try it with and without and see which you like better in your case.

Next, let's give the canvas (background) a color. Pick the eyedropper tool and then as you move your pointer over the colors in the chroma chart, notice how the background dynamically updates so that you can see the result of your color selection. Click the color you want to lock it in. Another idea you might consider trying is to sample a color from one of the elements in one of your photos. This would give it a matching theme look to your imagery.

We are done with part 1 of our task, so go ahead now and click "create collage" to lock in all of your edits so far.

The next part of your header should be to add some text. Perhaps you want to put your blog title (which often includes your geographic location). Also, maybe you have a good tagline. I also like to recommend a phone number or email reference. The goal is after all to have people contact you! The nice thing about the email reference in the graphic is that that people can see it but spambots will have a very hard time to harvest your email address.

Click the text tool and then click on your graphic where you want to place the text. Pick a nice contrasting color for the text (i.e. light on dark or dark on light). Select a font that you like. You can size (and optionally rotate) the text in the same way that you did with the photos - select the text and grab the orange handle to adjust. Each new text line you want, click again a new point and start typing. When you are done with the text, click the "apply" button

Now your graphic is ready to use. You will need to export the collage file to get it to size just right for placement in your blog. Click the Export button (found on the bottom toolbar). In the box alongside the slider, type in the exact value 960 for the size and then click OK. The folder it sends it to will pop up. Note this folder as you will need to know where to get it at a subsequent step.

When we set our background color in Picasa, it does not tell us the numerical value of the color we used so we need to find out for ourselves another way. Most photo editing apps have an eyedropper tool that you can sample a color and then it tells you the RGB value (and equivalent HTML hex code) that you want to use. Let's illustrate this using the free web app www.splashup.com when you go to that page, click the "jump right in" option. This starts the photo editor web app. On the File menu choose Open, then choose the big browse button right in the center of the screen and load your new header graphic.

On the lefthand toolbar, you will see the eyedropper tool. Click it and then click a point on the graphic to sample the background color at that spot. On the color palette, you will notice the hex number that HTML uses to identify color. Make a note of this color number (and better yet, copy it to your clipboard).

In ActiveRain, start on your "My Home" page and then on the left sidebar at the top you will see the "customize" link. Click it and then on the following page you will see a button "choose file" to upload your custom header graphic. Also, you will want to apply the RGB hex value that you determined to both the "Page Background" and the "Header Background" settings.

The reason why you want to use the same color for the header background relates to the cases of extra wide blog posts. Occasionally you might have a blog post that is wider than standard (e.g. on a re-blog) and it forces your blog to expand bigger than your header graphic is wide. If you have a strange color for the header background, it will look bad. At least if you match the page color, it will be less noticeable.

Whew! That was a slightly longer lesson than I normally do, but I couldn't stop halfway on this one! Hope you find it helpful if you feel like your blog header needs a refresh!

Posted by

Hello! My name is Craig Daniels and I'm glad you stopped by Craig's Classroom! I hope you learned something new today here in my ActiveRain blog. If you did, there is that 'like' button below that makes me glad everytime I get a click :) Also, there's one more click to consider... By subscribing to my blog, you'll be able to see my future posts in your newsfeed (learn more). Check out my Blog Cover Page to see an index to my posts. Caution: I give abundant takeaways and I can keep you busy in 'homework' for quite a while! Check out my Profile Page to learn more about this tech guy and the various tech services that I provide.

close

Re-Blogged 2 times:

Re-Blogged By Re-Blogged At
  1. Karen L. Pietsch 01/31/2011 06:00 PM
  2. Bill Burchard 05/01/2011 08:26 AM
Topic:
ActiveRain Community
Groups:
Active Rain Newbies
The Ninety-ninth Percentile
Addicted to Active Rain
Bananatude
Tags:
picasa
activerain
customization
header

Post a Comment
Spam prevention
Spam prevention
Show All Comments
Rainer
80,800
Karen L. Pietsch
Cary Property Pros - 4 Sale Realty, Inc. - Crystal Lake, IL
Cary Property Pros. Cary Property Pros Premier Real Estate

Craig, I did it!  It was a little confusing cuz I couldn't find everything you were explaining but I figured it out.  Took a while but I figured it out.  I am quite impressed with the finished product, thanks to you.  It really cleaned up the header and now my blog looks, in my opinion, much more professional with a crisp header.  Thank you.  I am pretty darn pleased with myself.  I used Picasa long before I was here and long before anyone else knew about it.  I did this because I always struggled with pictures, especially when I had to upload the listing pictures.  I searched for a good free program to do that and that's how I found Picasa.  Way to go Craig.  I love your technology lessons.  Please keep it up so I can continue to better the look and the feel of my blog.

Jan 31, 2011 05:48 PM #77
Rainmaker
246,180
Joyce Godwin
12810 Telge,Cypress,TX 77429 -Houston,Cypress,Spring,Tomball - Cypress, TX
RE/MAX Realty Center, Houston Area Relocation Info

Craig, Someone (I thought it was you, but cannot find it in your posts) recently gave instructions on how to create the color bar above (or as part of) your signature.  I tried to do it (if you don't mind clicking over to it) and right now it is kind of a mess.  Can you tell me what I have done wrong?  AR is moving so slow today that I can't spend more time looking for it.  I read your post about the cells, html, etc. -- was that it?   If so, I guess I am not following instructions very well.  I thought there was an addditional post.

Feb 01, 2011 04:16 AM #78
Rainer
12,153
Linda Lorenzo
Coldwell Banker Apex - McKinney, TX
GRI, North Dallas/Ft Worth

I use Picasa to edit all my photos, it is so easy and does a great job.  I had no idea, however, that it could do all this other stuff.  I am printing this out to study it - very cool.  I am also going back to read your other information, can hardly wait.

Thanks so much

Feb 01, 2011 11:20 AM #79
Rainmaker
329,430
Steven Beam
RE/MAX Alliance - Parker Colorado Real Estate. - Parker, CO
Parker Colorado Real Estate

I'm going to give this a shot and see what happens. Thank you!

Feb 05, 2011 09:45 AM #80
Rainmaker
212,895
Sandy McAlpine
RE/MAX EXECUTIVE - Cornelius, NC
Search Lake Norman Homes For Sale - Lake Norman NC

Craig, that is pretty cool! I just learned how to make a movie in picasa - see my post here: http://activerain.com/blogsview/2124574/making-videos-with-picasa-lake-norman-real-estate-agent-mcalpine-properties

Feb 07, 2011 05:01 PM #81
Rainer
17,603
Wendy Burns
Keller Williams Realty - Cary - Apex, NC

Craig, I thought I was going to have to pay for a custom banner - thank you so much!  Didn't want to use a boring stock photo and have plenty of my own local photos.  I never even heard of Picasa before I found your post - and now have a personalized active rain blog banner that I am very happy with. 

Mar 19, 2011 04:52 AM #82
Rainer
48,637
David Myre
VIP Realty - Dallas, TX

Great tutorial. The only thing missing here is an access point for Picasa. I found one on Google, and one available for download on CNET. Which do you use?

Apr 24, 2011 06:28 PM #83
Ambassador
418,792
Craig Daniels
Tech Training for You! - Staten Island, NY
Technology Instructor/Project Consultant

David - I had put the download link the first article of this Picasa Series - you can use that link to go to the post - thanks for your comment

Apr 25, 2011 02:33 AM #84
Rainer
342,556
Hrisco & Associates
Hrisco & Associates | Expert Advisor Home Services - Roanoke, TX
-"When Experience Matters - The Agent You Need!"

Hi Craig, another great post and lesson.  Another project to add to the evergrowing list.  nice work on Laura's header.  Are you available for hire for projects like these.  if so, would love to talk to you via phone or email.  Also liked how you grouped your associates, etc...on your profile, after reviewing yours, I am going to revise mine soon.  Shoot me an email or give me a shout.  Looking forward to talking to you soon.

Apr 25, 2011 09:17 PM #85
Ambassador
418,792
Craig Daniels
Tech Training for You! - Staten Island, NY
Technology Instructor/Project Consultant

John - thanks, glad you liked this post - I'll email you soon, thx :)

Apr 26, 2011 07:21 AM #86
Rainer
342,556
Hrisco & Associates
Hrisco & Associates | Expert Advisor Home Services - Roanoke, TX
-"When Experience Matters - The Agent You Need!"

got your email Craig, thank you, I would be happy to speak to you further when your schedule lightens up, no worries, meanwhile, I am playing with the picassa header program mentioned above and will let you know in the next day or so when to check out my work. 

Apr 26, 2011 09:07 PM #87
Rainmaker
1,341,112
Bill Burchard
3B Realty: 951-347-3818, CA - Murrieta, CA
Broker, Realtor, Representing Buyers and Sellers

Wow, Craig... I had no idea Picasa was so versatile... and free!!

Apr 27, 2011 04:57 AM #88
Rainer
342,556
Hrisco & Associates
Hrisco & Associates | Expert Advisor Home Services - Roanoke, TX
-"When Experience Matters - The Agent You Need!"

Hi Craig, still tweaking my picassa headers, will let you know when done for your critiqueing. 

Apr 29, 2011 04:10 PM #89
Rainmaker
148,135
Jeremy Joslin
Coldwell Banker Residential Brokerage - South Windsor, CT
Professional Real Estate Marketing and Sales
Great Post.  Seems really easy to use.  I have created my header and exported it at 960 pixels but having problems when I put it on AR.  I will try support on Monday. It says everything has gone pear shaped?  Love your posts and the catalog!
May 07, 2011 08:17 AM #90
Rainer
135,526
Matt Robinson
Professional Investors Guild - Pensacola, FL
www.professionalinvestorsguild.com

Craig, fantastic information!  Thanks so much for taking the time to share this info with all of us internet/website neophytes.

Sep 06, 2011 06:20 AM #91
Rainmaker
170,083
Wendy Hayden
Photographer, Home Stager, ePRO - Richmond, VA
Chesterfield, Richmond & Powahatan

Love it Craig!  As always, great information.  You do a great job of explaining things.  I love that I was wanting to figure out how to do a new header in picasa, did a search and boom, there you were!  

Sep 08, 2011 01:16 PM #92
Rainmaker
304,415
Tamara Inzunza
RE/MAX Executives - Alexandria, VA
Close-In Alexandria and Arlington Living

Time to pimp my AR blog header for the fall.  Change is good.

Oct 20, 2011 08:32 AM #93
Rainer
342,556
Hrisco & Associates
Hrisco & Associates | Expert Advisor Home Services - Roanoke, TX
-"When Experience Matters - The Agent You Need!"

Hi Craig, well, I finally got around to it, working on more, but wanted you to check out my new blog header and tell me what you think?  Now to fix my blog signature....do you have a post regarding the signature ?

Nov 19, 2011 09:28 AM #94
Ambassador
418,792
Craig Daniels
Tech Training for You! - Staten Island, NY
Technology Instructor/Project Consultant

John - I checked out your new header, very nice work! :) my signature posts might give you ideas for your next project :)

Nov 19, 2011 09:59 AM #95
Rainmaker
43,820
Sharon Denning
Momentum Marketing - West Richland, WA
Marketing that gets it SOLD

Thank You! This has been on my to do list for too long. Now I know how to get it done.

Sep 03, 2012 04:58 AM #96
Post a Comment
Spam prevention
Show All Comments

What's the reason you're reporting this blog entry?

Are you sure you want to report this blog entry as spam?

Ambassador
418,792

Craig Daniels

Technology Instructor/Project Consultant
Ask me a question
*
*
*
*
Spam prevention

Additional Information